首页 > 编程语言 >小程序登录系统

小程序登录系统

时间:2022-11-18 21:39:09浏览次数:409  
标签:code 登录 程序 系统 用户 token 微信 wx

小程序登录简单分为以下几步:

使用wx.login获取code值
获取code值后再加 AppID appsecret code 传给后端
后端调接口 拿到 seesion_key openid 返回 token
前端存储token

小程序登录的三个角色
小程序
用户使用客户端 由于小程序运行在微信之上 因此小程序可以通过API获取微信用户的身份信息
开发服务器 小程序的后端服务器 用于用户提供服务
微信接口服务 为开发者提供接口服务
小程序获取 code
在小程序中通过 wx.login() 获取登录凭证 code code由小程序内部自动生成 每次调用 wx.login() 获取的code 都不同 需要注意的是 code的有效期为为五分钟 且被微信接口验证一次就失效

发送code
小程序将code 发送给开发者服务器 在获取code后 使用wx.request() 将code 发送给开发者服务器

获取code
开发者服务器将 Appid (微信后台获取) AppSecret (微信后台获取) code
发送给微信接口 检验登录凭证 成功 返回 session_key和 openid等 其中 AppId是小程序的唯一标识 AppSecret 是小程序的密钥 对于微信接口服务而言 他们相当于小程序账号的id 和密码
微信接口返回: session_key 和 openid openid 是用户的唯一标识 seesion_key是对用户数据进行加密签名的密钥

注意: openid 并不等于微信用户的id 同一个微信用户在不同的appid小程序中的 oppenId 是不同的

开发者自定义状态
在用户登录成功后 开发者服务器将openid 和session_key 保存 然后生成一个自定义登录状态的 token (令牌)响应给小程序通过token可以查询到 小程序下次请求时只要携带token 就可以证明用户已经登录

客户端缓存

 

检测用户是否已经登录
一、
微信小程序可以使用wx.checkSession()检查登录状态是否过期就重新登录

wx.checkSession({
success:function(){
// 登录态未过期
},
fail:function(){
// 登录状态过期
wx.login()
}
})
1
2
3
4
5
6
7
8
9
注意:wx.getUserInfo() 获取用户信息 wx.getUserInfo() 来获取用户信息 在获取用户信息前 需要调用wx.login 接口 只有用户登录状态 才能获取到用户相关信息

二、

token 保存在缓存中 下次启动小程序时 应该判断缓存中是否存在token 并且判断 该token是否过期
app.js
checkLogin:function(callback){
var token = this.globalData.token
if(!token){
// 从数据缓存中取token
token = wx.getStorageSync('token')
if(token){
this.globalData.token = token
}else{
callback({
is_login:false})
return
}
}
login(){
wx.request({ //未登录 重新登录
url:".../login",
data:{
},
success:res=>{
callback({
is_login:true})
return
}
}
})
}
},
onLaunch:function(){
// 用于在小程序启动检查用户是否已经登录 如果没有登录则执行登录操作
this.checkLogin(res=>{
if(!res.is_login){
this.login()
}
})
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
获取用户信息
小程序获取信息有两种方式
一、使用 opne-data 组件 他不需要用户收授权 就可以显示用户的头像 呢陈 性别等方式 适合只展示的情况
二、通过单击按钮 提示用户授权 获取用户信息数据
在小程序早期版本中 微信授权通过wx.getuseInfo() 弹出的 如果在小程序启动时就通过wx.getuserInfo() 申请权限 用户体验会大打折扣 因此新版本中 需要用户主动点击按钮才会弹出 在为其添加 open-type属性 还需绑定bindgetUserInfo属性绑定函数

注意 在用户已经授权后 授权数据会被记录下来 下次启动小程序无需要再次申请授权 若要在启动判断是否授权 可以在 app.js onLouch()函数通过如下代码实现

wx.getSetting()
用于获取用户当前的设置 可以获取小程序已经向用户获取的权限
res.authSetting[]
1
2
3
如果需要清除授权 可以单击微信开发工具的工具栏的清缓存按钮

开发数据校验与解密
场景: 开发者服务器想要获取用户信息 则需要在小程序端通过wx.request() 将获取到的用户信息发送给开发者服务器 如果我伪装小程序客户端向开发者服务器发送用户信息 开发这服务器就会接收虚假信息 此时就存在一个问题 开发者服务器无法辨别

wx.getUserInfo(){
success:res=>{
// res =>
// errMsg 错愕信息
// userInfo 用户信息对象 不包含 opneid等敏感信息
// rawData 不包括敏感信息的原始数据子符串 用于计算签名
// signature 使用sha1(rawData +session_key)得到的字符串 用于校验用户的信息
// encryptedData 包括敏感数据在内的完整用户信息的加密数据
// iv 加密算法的初始向量
}
}
1
2
3
4
5
6
7
8
9
10
11
openID //用户在当前AppId小程序下的唯一id
unionId //同一个微信开放平台账号下的用户唯一id
watermark // 数据水印 用于校验数据的有效性
appid // 敏感数据归属 appid 开发者可校验次参数与自身的appid 是否一致
timestamp: 0 //敏感数据获取的时间戳 开发者可以用于数据时效性校验
1
2
3
4
5
注意: session_key 是用户的会话密钥 需要存储在服务器中 调取用户信息等微信接口时 需要用这个会话密钥 才能解密获取相关的数据 为了自身的数据安全 不应该把session_key 下发到小程序 小程序每次调用wx.login() 时会自动生成新的session_key 导致原来的session_key时效
————————————————
版权声明:本文为CSDN博主「du_独孤九剑」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/qq_38686150/article/details/118156691

标签:code,登录,程序,系统,用户,token,微信,wx
From: https://www.cnblogs.com/clark1990/p/16904930.html

相关文章