溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能

發(fā)布時間:2020-12-10 14:08:34 來源:億速云 閱讀:390 作者:Leah 欄目:開發(fā)技術

微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能?針對這個問題,這篇文章詳細介紹了相對應的分析和解答,希望可以幫助更多想解決這個問題的小伙伴找到更簡單易行的方法。

讓用戶登錄,標識用戶和獲取用戶信息,以用戶為核心提供服務,是大部分小程序都會做的事情。我們今天就來了解下在小程序中,如何做用戶登錄,以及如何去維護這個登錄后的會話(Session)狀態(tài)。

在微信小程序中,我們大致會涉及到以下三類登錄方式:

  •  自有的賬號注冊和登錄;
  • 使用其他第三方平臺賬號登錄;
  • 使用微信賬號登錄(即直接使用當前已登錄的微信賬號來作為小程序的用戶進行登錄)。

第一和第二種方式是目前Web應用中最常見的兩種方式,在微信小程序中同樣可以使用,但是需要值的注意的是,小程序中沒有Cookie的機制,所以在使用這2種方式前,請確認你們或第三方的API是否需要依賴Cookie;還有小程序中也不支持HTML頁面,那些需要使用頁面重定向來進行登錄的第三方API就需要改造,或不能用了。

我們今天主要來討論一下第三種方式,即如何使用微信賬號進行登錄,因為這種方式和微信平臺結合最緊密,用戶體驗比較好。

登錄流程

引用小程序官方文檔的登錄流程圖,整個登錄流程基本如下圖所示:

微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能

該圖中,“小程序”指的就是我們使用小程序框架寫的代碼部分,“第三方服務器”一般就是我們自己的后臺服務程序,“微信服務器”是微信官方的API服務器。

下面我們來逐步分解一下這個流程圖。

步驟一:在客戶端獲取當前登錄微信用戶的登錄憑證(code)

在小程序中登錄的第一步,就是先獲取登錄憑證。我們可以使用wx.login()方法并得到一個登錄憑證。

我們可以在小程序的App代碼中發(fā)起登錄憑證請求,也可以在其他任何Page頁面代碼中發(fā)起登錄憑證請求,主要根據(jù)你小程序的實際需要。

步驟二:將登錄憑證發(fā)往你的服務端,并在你的服務端使用該憑證向微信服務器換取該微信用戶的唯一標識(openid)和會話密鑰(session_key)

首先,我們使用wx.request()方法,請求我們自己實現(xiàn)的一個后臺API,并將登錄憑證(code)攜帶過去,例如在我們前面代碼的基礎上增加:

你的后臺服務接著需要使用這個傳遞過來的登錄憑證,去調(diào)用微信接口換取openid和session_key

我們先來介紹下openid,用過公眾號的童鞋應該對這個標識都不陌生了,在公眾平臺里,用來標識每個用戶在訂閱號、服務號、小程序這三種不同應用的唯一標識,也就是說每個用戶在每個應用的openid都是不一致的,所以在小程序里,我們可以用openid來標識用戶的唯一性。

那么session_key是用來干嘛的呢?有了用戶標識,我們就需要讓該用戶進行登錄,那么 session_key 就保證了當前用戶進行會話操作的有效性,這個session_key是微信服務端給我們派發(fā)的。也就是說,我們可以用這個標識來間接地維護我們小程序用戶的登錄態(tài),那么這個session_key是怎么拿到的呢?我們需要在自己的服務端請求微信提供的第三方接口 https://api.weixin.qq.com/sns/jscode2session 

從這幾個參數(shù),我們可以看出,要請求這個接口必須先調(diào)用wx.login()來獲取到用戶當前會話的code。那么為什么我們要在服務端來請求這個接口呢?其實是出于安全性的考量,如果我們在前端通過request調(diào)用此接口,就不可避免的需要將我們小程序的appid和小程序的secret暴露在外部,同時也將微信服務端下發(fā)的session_key暴露給“有心之人”,這就給我們的業(yè)務安全帶來極大的風險。除了需要在服務端進行session_key的獲取,我們還需要注意兩點:

  • session_key和微信派發(fā)的code是一一對應的,同一code只能換取一次session_key。每次調(diào)用wx.login() ,都會下發(fā)一個新的code和對應的session_key,為了保證用戶體驗和登錄態(tài)的有效性,開發(fā)者需要清楚用戶需要重新登錄時才去調(diào)用wx.login()
  • session_key是有失效性的,即便是不調(diào)用wx.login,session_key也會過期,過期時間跟用戶使用小程序的頻率成正相關,但具體的時間長短開發(fā)者和用戶都是獲取不到的

步驟三:生成3rd_session

前面說過通過 session_key 來“間接”地維護登錄態(tài),所謂間接,也就是我們需要 自己維護用戶的登錄態(tài)信息 ,這里也是考慮到安全性因素,如果直接使用微信服務端派發(fā)的session_key來作為業(yè)務方的登錄態(tài)使用,會被“有心之人”用來獲取用戶的敏感信息,比如wx.getUserInfo()這個接口呢,就需要session_key來配合解密微信用戶的敏感信息。

那么我們?nèi)绻勺约旱牡卿洃B(tài)標識呢,這里可以使用幾種常見的不可逆的哈希算法,比如md5、sha1等,將生成后的登錄態(tài)標識(這里我們統(tǒng)稱為'skey')返回給前端,并在前端維護這份登錄態(tài)標識(一般是存入storage)。而在服務端呢,我們會把生成的skey存在用戶對應的數(shù)據(jù)表中,前端通過傳遞skey來存取用戶的信息。

步驟四:在客戶端保存Session ID

開發(fā)Web應用的時候,在客戶端(瀏覽器)中,我們通常將Session ID存放在cookie中,但是小程序沒有cookie機制,所以不能采用cookie了,但是小程序有本地的storage,所以我們可以使用storage來保存Session ID,以供后續(xù)的后臺API調(diào)用所使用。

在之后,調(diào)用那些需要登錄后才有權限訪問的后臺服務時,你可以將保存在storage中的Session ID取出并攜帶在請求中(可以放在header中攜帶,也可以放在querystring中,或是放在body中,根據(jù)你自己的需要來使用),傳遞到后臺服務,后臺代碼中獲取到該Session ID后,從redis中查找是否有該Session ID存在,存在的話,即確認該session是有效的,繼續(xù)后續(xù)的代碼執(zhí)行,否則進行錯誤處理。

前面我們將skey存入前端的storage里,每次進行用戶數(shù)據(jù)請求時會帶上skey,那么如果此時session_key過期呢?所以我們需要調(diào)用到wx.checkSession()這個API來校驗當前session_key是否已經(jīng)過期,這個API并不需要傳入任何有關session_key的信息參數(shù),而是微信小程序自己去調(diào)自己的服務來查詢用戶最近一次生成的session_key是否過期。如果當前session_key過期,就讓用戶來重新登錄,更新session_key,并將最新的skey存入用戶數(shù)據(jù)表中。

步驟五:支持emoji表情存儲

如果需要將用戶微信名存入數(shù)據(jù)表中,那么就確認數(shù)據(jù)表及數(shù)據(jù)列的編碼格式。因為用戶微信名可能會包含emoji圖標,而常用的UTF8編碼只支持1-3個字節(jié),emoji圖標剛好是4個字節(jié)的編碼進行存儲。

這里有兩種方式(以mysql為例):

1.設置存儲字符集

在mysql5.5.3版本后,支持將數(shù)據(jù)庫及數(shù)據(jù)表和數(shù)據(jù)列的字符集設置為 utf8mb4 ,因此可在 /etc/my.cnf 設置默認字符集編碼及服務端編碼格式

[client]
default-character-set=utf8mb4
[mysql]
default-character-set=utf8mb4
[mysqld]
character-set-client-handshake = FALSE
character-set-server=utf8mb4
collation-server=utf8mb4_unicode_ci

設置完默認字符集編碼及服務端字符集編碼,如果是對已經(jīng)存在的表和字段進行編碼轉換,需要執(zhí)行下面幾個步驟:

設置數(shù)據(jù)庫字符集為 utf8mb4

ALTER DATABASE 數(shù)據(jù)庫名稱 CHARACTER SET = utf8mb4 COLLATE = utf8mb4_unicode_ci;

設置數(shù)據(jù)表字符集為 utf8mb4

ALTER TABLE 數(shù)據(jù)表名稱 CONVERT TO CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

設置數(shù)據(jù)列字段字符集為 utf8mb4

ALTER TABLE 數(shù)據(jù)表名稱 CHANGE 字段列名稱 VARCHAR(n) CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

這里的 COLLATE 指的是排序字符集,也就是用來對存儲的字符進行排序和比較的, utf8mb4 常用的collation有兩種: utf8mb4_unicode_ci 和 utf8mb4_general_ci ,一般建議使用 utf8mb4_unicode_ci ,因為它是基于標準的 Unicode Collation Algorithm(UCA) 來排序的,可以在各種語言進行精確排序。這兩種排序方式的具體區(qū)別可以參考: What's the difference between utf8_general_ci and utf8_unicode_ci

2.通過使用sequelize對emoji字符進行編碼入庫,使用時再進行解碼

這里是sequelize的配置,可參考 Sequelize文檔

{
 dialect: 'mysql', // 數(shù)據(jù)庫類型
 dialectOptions: { 
 charset: 'utf8mb4',
 collate: "utf8mb4_unicode_ci"
 },
}

附:后臺代碼(tp5)

微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能

微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能

微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能

微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能

微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能

微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能

關于微信小程序怎么實現(xiàn)一個用戶登錄與登錄態(tài)維護功能問題的解答就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,如果你還有很多疑惑沒有解開,可以關注億速云行業(yè)資訊頻道了解更多相關知識。

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權內(nèi)容。

AI