美文网首页
微信小程序登录

微信小程序登录

作者: beatzcs | 来源:发表于2018-05-10 12:20 被阅读0次

    登录几乎是小程序打开必做的事情,其主要目的是使得该用户唯一且被标识。
    先来张官方流程图:


    登录流程时序.png
    登录流程图.png

    上面两个图都是官方的登录时序图,表达的程度各有千秋,下面是不忍直视的个人制作:


    自己都很难看懂.png
    光看图就已经令人深思了,但是我的理解已经表达出来了,理解万岁!
    1.调用wx.login()获取登录凭证code;
    2.调用wx.request()将code传到服务器;
    3.服务器端调用微信登录校验接口(appid+appsecret+code),获得session_key+openid;

    4.服务器端生成3rd_session(相当于userId),使用3rd_session为key,session_key+openid为value的形式存在服务器,并将3rd_session传送给客户端;
    5.客户端本地存储3rd_session,登录成功!
    6.下次登录时可以用3rd_session传输到服务器端验证登录态是否过期,未过期则登录成功。

    session_key用户信息解密的秘钥,获取用户信息时会用到;openid是用户唯一标识,通常这两个字段都不会直接传输到客户端,仅留存于服务端。

    小程序API中wx.checkSession()可以校验用户当前session_key是否有效。

    wx.checkSession({
      success: function(){
        //session_key 未过期,并且在本生命周期一直有效
      },
      fail: function(){
        // session_key 已经失效,需要重新执行登录流程
        wx.login() //重新登录
        ....
      }
    })
    

    登录的代码:

      appLogin: function (callback) {//无论微信是否登录,都刷新下登陆状态后再调用登陆接口
    
        var code = "";
        var ops = service.app.globalData.launchOptions;
        wx.login({
          success: function (res) {
            code = res.code;
            var params = {
                code: code,
                page: ops.path,
                scene: ops.scene,
                referrerId: ops.query.referrerId
             };
             service.login(params, callback)
          },
          fail: function (res) {
            console.log("微信登陆失败:"+res);
            callback({ code: -1 })
          }
        })
    
      }
    
      login: function (params, callback) {
        HttpClient.request(Func.LOGIN, params, function (res) {
          if (res.code == 0) {
            service.app.globalData.userId = res.result.userId;
            service.HttpClient.userId = res.result.userId;
            wx.setStorageSync("userId", res.result.userId)
          }
          if (callback) {
            callback(res);
          }
        }, true)
      }
    

    关于登录态有效期限的问题:


    登录态有效期.png

    相关文章

      网友评论

          本文标题:微信小程序登录

          本文链接:https://www.haomeiwen.com/subject/gdczrftx.html