微信小程式實現登入功能的邏輯整理

小云云
發布: 2018-01-30 11:35:46
原創
6110 人瀏覽過

為了讓大家更好的開發微信小程序,本文主要和大家分享微信小程序登入邏輯整理,希望能幫助大家。

註冊/登入

小程式端" style="margin: 0.8em 0px; padding: 0px; box-sizing: border-box; font-weight: 100; line-height: 1.3em; font-size: 2.13em;">小程式端:

透過上面wx.login和wx.getUserInfo兩個api拿到對應的資訊,並透過上方介面傳給自己的伺服器.

需要傳輸的資訊有7個參數:

appid  小程序唯一标识
secret  小程序的 app secret
js_code  //wx.login登录时获取的 code,用于后续获取session_key

//下面两个参数用户服务器端签名校验用户信息的
signature 使用 sha1( rawData + sessionkey ) 得到字符串,用于校验用户信息。
rawData  不包括敏感信息的原始数据字符串,用于计算签名。

//下面两个参数是用于解密获取openId和UnionId的
encryptedData  包括敏感数据在内的完整用户信息的加密数据
iv 加密算法的初始向量
当然,可以精简为以下三个参数. 
其余的签名校验的参数可省略,而appid和secret可以直接写在服务器.
js_code //  wx.login登录时获取的 code,用于后续获取session_key
encryptedData  包括敏感数据在内的完整用户信息的加密数据
iv 加密算法的初始向量
登入後複製

服務端處理邏輯

相關的資訊傳送給伺服器後,伺服器

1.先依照js_code去微信伺服器拿到session_key 
2.(此步可省略)使用sha1( rawData + sessionkey )拿到字串,判斷與signature值是否相同,如果相同則用戶資訊無誤,可進行下一步.如果不同,則說明用戶資訊被篡改或過期. 
#3.然後根據解密演算法自行解密(輸入參數為appId,sessionKey,encryptedData,iv,返回一個jsonObj),拿到openId和unionId等資訊,執行伺服器端的註冊/登入操作. 
4.註冊/登入作業邏輯完成後,將我們伺服器的sessionId(或其他token),以及使用者資訊回傳給客戶端.

其中,伺服器去取得session_key的請求為:

(小寫為固定寫好的,大寫為待替換的) 
https://api.weixin.qq. com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code

#
  //正常返回的JSON数据包
    {
          "openid": "OPENID",
          "session_key": "SESSIONKEY"
          "expires_in": 2592000
    }
    //错误时返回JSON数据包(示例为Code无效)
    {
        "errcode": 40029,
        "errmsg": "invalid code"
    }
登入後複製

相關解密演算法:

##https://mp.weixin.qq. com/debug/wxadoc/dev/api/signature.html

注意:範例程式碼中有node,c++,php,python的,沒有java的.

需要伺服器傳回的資訊:

sessionId/token 登入狀態識別

userInfo: jsonObject,使用者在我們平台上的資訊,其內容與getPersonalInfo介面所傳回的相同.

##最後,將登入操作封裝成方法,需要處呼叫即可

//最终供外面调用的方法
function login(){
    console.log('logining..........');
    //调用登录接口
    wx.login({
        success: function (e) {
            console.log('wxlogin successd........');
            var code = e.code;
            wx.getUserInfo({
                success: function (res) {
                    console.log('wxgetUserInfo successd........');
                    var encryptedData = encodeURIComponent(res.encryptedData);
                    thirdLogin(code,encryptedData,res.iv);//调用服务器api
                }
            })
        }
    });
}
function  thirdLogin(code,encryptedData,iv){
    var url = "eeee/xxx/login/ttttt";
    var params = new Object();
    params.code = code;
    params.encryptedData = encryptedData;
    params.iv =iv;
    buildRequest(new Object(),url,params,{
        onPre: function(page){},
        onSuccess:function (data){
            console.log('my  login successd........');
            console.log(data);
            getApp().globalData.session_id = data.session_id;
            getApp().globalData.uid = data.uid;
            getApp().globalData.isLogin = true;
        },
        onError : function(msgCanShow,code,hiddenMsg){
        }
    }).send();
}
登入後複製

相關推薦:

微信小程式取得使用者資訊如何實作

微信小程式開發遇到的問題總結

一個微信小程式版知乎實例分享

以上是微信小程式實現登入功能的邏輯整理的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!