微信小程序登录验证
标签(空格分隔): 微信
微信登录逻辑,先贴前端代码
wx.login({
success: function (res) {
if (res.code) {
//发起网络请求
wx.request({
url: 'https://25eecc9a.ngrok.io/onLogin',
data: {
code: res.code
},
success:function(response){
console.log(response.data)
var oppenid = response.data.oppenid
var session_key= response.data.session_key
window.localStorage.setItem("openid",openid)
window.localStorage.setItem("session_key", session_key)
}
})
} else {
console.log('获取用户登录态失败!' + res.errMsg)
}
}
});
解释:
wx.login
方法从微信服务器获取code
,然后把这个code
发送给我们服务器,自己服务器拿着这个code
和其他什么appid
,secrect
等东西,再去调用微信的一个接口,这个接口返回给我们服务器一个oppenid(唯一)
和session-key
,后端把两货发送给前端我们就可以搞事情了!
小程序->微信服务器: 1. wx.login
微信服务器->小程序: 2. code
小程序->自己服务器: 3. code
自己服务器->微信服务器:4. appid+secrect+code+authorization_code
微信服务器->自己服务器: 5. openid+session_key
我是分割线
交互图
上面是前端代码,主要步骤是123,下面贴下后端步骤,主要是45的实现
app.get('/onLogin',function(req,res,next){
console.log("onLogin 接口访问成功")
// console.log("req code",req)
let JSCODE=req.query.code
let appid='xxx'
let secret='xxx'
let wechatUrl="https://api.weixin.qq.com/sns/jscode2session?appid="+appid+"&secret="+secret+"&js_code="+JSCODE+"&grant_type=authorization_code"
let grant_type='authorization_code'
console.log(JSCODE)
request(wechatUrl,(err,response,body)=>{
// console.log(response)
let data=JSON.parse(body)
console.log(data)
res.set({
"Access-Control-Allow-Origin": "*"
,"Access-Control-Allow-Methods": "POST,GET"
,"Access-Control-Allow-Credentials": "true"
});
res.json(data)
})
})
主要流程就是酱紫,后端是自己撸的,这个一般是要查询一次数据库的,看看数据库有没有这个oppenid,如果有登录通过,如果没有gg。为了图方便我直接返回给了小程序session_key和openid,这样做是很不安全的。单纯demo演示
网友评论