非常簡單 (大飛附體)
-
首先貼出官方流程圖
說明:
1,小程序調(diào)用wx.login() 獲取 臨時登錄憑證code 日川,并回傳到開發(fā)者服務(wù)器壮吩。
2,開發(fā)者服務(wù)器以code換取 用戶唯一標(biāo)識openid 和 會話密鑰session_key。
之后開發(fā)者服務(wù)器可以根據(jù)用戶標(biāo)識來生成自定義登錄態(tài),用于后續(xù)業(yè)務(wù)邏輯中前后端交互時識別用戶身份。
- 所以第一步就是在前端用微信的登錄請求獲取code,小程序的代碼要在微信開發(fā)者工具里面寫
wx.login({
success:function(res){
wx.request({
url: 'http://localhost/miniAppLogin',
method: 'POST',
header: header,
data: { 'code': res.code},
success: function (res) {
console.log('登陸成功')
}
})
}
}
這樣就獲取到了code并且發(fā)了一個/miniAppLogin的請求去我們的服務(wù)器
在服務(wù)器中拿code去獲取openId,這里發(fā)Https請求 , 可以網(wǎng)上下載工具類 : Https請求工具類
https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
請求結(jié)果轉(zhuǎn)換為json對象,可以用fastJson里面的JSON.parseObject()方法
接著json.get("openId")就可以拿到用戶的openId做下一步操作了
如果你不僅要openId,還想要獲取用戶的頭像 昵稱 unionId等其他資料信息的話 , 就需要用到wx.getUserInfo接口了
- 前端代碼這里得修改一下,差不多是這個樣子
wx.login({
success:function(res){
wx.getUserInfo({
success:function(data){
wx.request({
url: 'http://localhost/miniAppLogin',
method: 'POST',
header: header,
data: { 'encryptedData': data.encryptedData, 'iv': data.iv, 'code': res.code },
success: function (res) {
console.log(res)
var prepay_id = res.data.data.prepay_id;
that.sign(prepay_id);
}
})
}
})
}
})
語法可能有點不太對,前端大佬見諒
- 接著后臺就拿到了你發(fā)來的code,encryptedData和iv , 明確一下,我們的目的是取到encryptedData中的加密數(shù)據(jù)
- 首先第一步還是跟前面一樣,通過code獲取到openId和session_key, 但是這塊我們只需要session_key,直接用AESUtil去解密,網(wǎng)上有工具AES工具類
為了表示認(rèn)真程度,還是貼一句代碼吧
AESUtil.decrypt(encryptedData, session_key, iv, "UTF-8");
- 同樣把結(jié)果轉(zhuǎn)成JSON對象
之后就可以從對象里取你想要的值啦
比如
String unionId = resultJson.getString("unionId");
String username = resultJson.getString("nickName")
OK,需要注意的一點是,小程序沒有web中session的概念, 每次請求都會生成新的session,如果你非要用session存取數(shù)據(jù)的話,那就得記錄對應(yīng)的sessionId,所以前后端連接需要自定義token(token只是一個概念,新手不用太糾結(jié)這個單詞)
在這里個人認(rèn)為最簡單的辦法就是用redis存一個token返回給前端,前端保存在緩存里,然后每次請求時放進(jìn)請求頭 , 后臺加一個攔截器,檢查一下請求頭里的token,如果在redis里有記錄 就放行