login登录原因:获取到openid和session_key之后,才能够进行更敏感的信息的获取(如手机号)
步骤:客户端获取临时登录凭证->发送给后台,后台接收凭证,并和appid和appSecret一起,发送给腾讯服务器
1、wx.checkSession检验登录态
检查登录态是否过期,通过wx.login接口获得的用户登录态拥有一定的时效性,用户越久未使用小程序,用户登录态越有可能失效。
如果用户一直在使用小程序,则用户登录态一直保持有效,具体时效逻辑由微信维护,对开发者透明,开发者只需要调用 wx.checkSession 接口检测当前用户登录态是否有效。
登录态过期后开发者可以再调用wx.login获取新的用户登录态,调用成功说明当前session_key未过期,调用失败说明session_key已过期
wx.checkSession({
success () {
session_key未过期,并且在本生命周期一直有效
...
},
fail () {
session_key已经失效,需要重新执行登录流程
wx.login(...) 重新登录
}
})
2、获取用户的临时登录凭证:
在App.vue生命周期函数中
wx.login({
success:(res)=>{
res.code;
}
})
3、将临时凭证传给后台,让后台请求腾讯服务器
(1)获取传递的临时凭证
(2)获取appid
(3)获取AppSecret(小程序密钥),在微信程序后台开发处获取
(4)后端拼接请求url
appid、secret、js_code放入对应的数据
let url=`https://api.weixin.qq.com/sns/jscode2session?appid=${appid}&secret=${appSecret}&js_code=${code}&grant_type=authorization_code`;
(5)在后端发送请求,并获取获取返回的openid和session_key(这里使用flyio来发送请求)
let res=await fly.get(url)
JSON.parse(res.data);
openid:微信用户的唯一标识,可以用这个id来区分不同的微信用户
session_key:微信服务器给开发者服务器颁发的身份凭证,开发者可以用session_key请求微信服务器其他接口来获取一些其他信息,由此可以看到,session_key不应该泄露或者下发到小程序前端。
4、业务登录凭证SessionId
已经说到微信侧返回的session_key是开发者服务器和微信服务器的会话密钥,同样道理,开发者服务器和开发者的小程序应该也有会话密钥,在本书中我们就把它称之为SessionId。
用户登录成功之后,开发者服务器需要生成会话密钥SessionId,在服务端保持SessionId对应的用户身份信息,同时把SessionId返回给小程序。
小程序后续发起的请求中携带上SessionId,开发者服务器就可以通过服务器端的Session信息查询到当前登录用户的身份,这样我们就不需要每次都重新获取code,省去了很多通信消耗。
利用本地数据缓存的能力把SessionId存储起来,以便在它还没过期的时候能重复利用,以提高通信的性能
使用本地存储保存sessionId
//page.js
var app = getApp()
Page({
onLoad: function() {
// 调用wx.login获取微信登录凭证
wx.login({
success: function(res) {
// 拿到微信登录凭证之后去自己服务器换取自己的登录凭证
wx.request({
url: 'https://test.com/login',
data: { code: res.code },
success: function(res) {
var data = res.data
// 把 SessionId 和过期时间放在内存中的全局对象和本地缓存里边
app.globalData.sessionId =data.sessionId
wx.setStorageSync('SESSIONID',data.sessionId)
// 假设登录态保持1天
var expiredTime = +new Date() +1*24*60*60*1000
app.globalData.expiredTime =expiredTime
wx.setStorageSync('EXPIREDTIME',expiredTime)
}
})
}
})
}
})
//利用本地缓存恢复用户登录态SessionId
App({
onLaunch: function(options) {
var sessionId =wx.getStorageSync('SESSIONID')
var expiredTime =wx.getStorageSync('EXPIREDTIME')
var now = +new Date()
if (now - expiredTime <=1*24*60*60*1000) {
this.globalData.sessionId = sessionId
this.globalData.expiredTime = expiredTime
}
},
globalData: {
sessionId: null,
expiredTime: 0
}
})
代码示例:
前端传递凭证App.vue:
mounted()
{
wx.login({
success:async (res)=>{
//每次获取都不一样,和用户是否授权登录无关
let code=res.code;
let ans=await request("http://127.0.0.1:3000/getOpenId",{code:code});
console.log(ans);
//发送临时凭证code给服务器端
}
})
}
koa后台接收并向腾讯服务器发送请求,将结果返回给前端:
router.get('/getOpenId',async (ctx,next)=>{
let code=ctx.query.code;
let appid='xx';
let appSecret='xx';
let url=`https://api.weixin.qq.com/sns/jscode2session?appid=${appid}&secret=${appSecret}&js_code=${code}&grant_type=authorization_code`;
//发送请求给微信接口,获取openId
let res= await fly.get(url)
ctx.body=JSON.parse(res.data);
})