小程序登錄
之前也寫過微信小程序登錄的相關文章:
也可以通過官方的這張時序圖了解小程序的登錄流程:

從流程圖上可以看出微信小程序登錄需要先調用
wx.login()獲取 臨時登錄憑證code,並回傳到開發者服務器。然后在服務器端調用 auth.code2Session 接口,換取 用戶唯一標識openid和 會話密鑰session_key等信息。之后開發者服務器可以根據用戶標識來生成自定義登錄態,用於后續業務邏輯中前后端交互時識別用戶身份。
登錄方式
wx.login() 是在微信小程序端登錄的時候調用,而常見的登錄方式有以下幾種:
- 啟動小程序之后彈出登錄彈窗
- 點擊特定按鈕登錄
- 二者結合實現
登錄實現
我這里的實現是通過 點擊登錄按鈕 實現登錄。在《小書架》項目中有兩處可以進行登錄。
- 我的頁面,未登錄會顯示登錄區域

- 在文章詳情頁面,未登錄會彈出登錄彈窗

在點擊了登錄按鈕之后會調用下面的代碼,將登錄憑證發給服務器:
wx.login({
success: function(loginRes) {
if (loginRes.code) {
let userStorageInfo = wx.getStorageSync('userInfo');
// 請求服務端的登錄接口
wx.request({
url: api.loginUrl,
method: 'POST',
data: {
account: loginRes.code, // 臨時登錄憑證
type: 100, // 100 表示小程序用戶
userInfo: JSON.stringify(userStorageInfo)
},
success: function(res) {
console.log(res);
if (res.statusCode == 200) {
console.log('-----得到 Token---------');
wx.setStorageSync('loginToken', res.data.token);
} else {
console.log("Error:" + res.errmsg);
}
},
fail: function(error) {
// 調用服務端登錄接口失敗
}
});
} else {
// 獲取 code 失敗
}
},
fail: function(error) {
// 調用 wx.login 接口失敗
}
});
當微信小程序端發送code登錄憑證給服務端之后,服務端調用微信提供 的接口,獲取openid等數據。

token 鑒權
在服務器開發中有些接口API是需要登錄后才能使用,比如:收藏、評論等。而如何判斷用戶是否登錄,在移動端常見的手段是通過 token 來驗證登錄的時效性。也就是在用戶登錄之后,生成一個具有有效期的token,返回給客戶端使用,token超過了有效期就說明用戶的登錄狀態失效了,需要重新登錄。
ps: token的介紹可以查看我之前的相關文章。
獲取 token

驗證 token

咨詢請加微信:輕撩即可。

