登录流程图

1、wxml代码

注意：此处一定用 open-type="getUserInfo" button元素，因为用这个button元素，就算用户拒绝了授权，每次点击都会弹出授权窗口，而如果绑定事件，调用wx.getUserInfo()接口，如果用户未授权，不会弹出授权弹窗

接口调整说明 wx.getUserInfo()> 在用户未授权过的情况下调用此接口，将不再出现授权弹窗，会直接进入 fail 回调（详见《公告》)。在用户已授权的情况下调用此接口，可成功获取用户信息

2、js代码

/**
 * 微信授权登录
 * [@param](/user/param) e
 */
bindGetUserInfo: function (e) {
  let {detail} = e;
  if (detail.userInfo) {  //允许授权
    var that = this;
    wx.showLoading({
      title: '授权登录中'
    })
    // TODO 1、先调用微信登录接口获取到code
    wx.login({
      success(res) {
        // TODO 2、再次调用微信getUserInfo接口获取加密的敏感信息encryptedData和iv 
       // [为什么不用上面的detail中的encryptedData和iv，因为那是在获取code之前获取的，
       // 这样就导致后台拿到code换取的sessionkey是新的，而detail中的encryptedData和iv是用旧的加密的，导致解密时报错]
          wx.getUserInfo({
            success: function (userInfo) {
              // 后台拿到code、encryptedData、iv再加小程序的appId和秘钥appsecret(秘钥放在服务器，最好不要前端传给后台)去请求微信服务器，换取session_key和openid
             api.wxLogin({
                code: res.code,
                encryptedData: userInfo.encryptedData,
                iv: userInfo.iv,
            }).then(loginRes => {
                wx.hideLoading()
                wx.showToast({
                  title: '微信授权登录成功',
                  icon: 'none'
                })
             // 到此，后台就可以从微信服务器拿到用户的openid，如果小程序的主体在微信开放平台还有其他应用，如安卓、ios、web，就可以拿到unionId
            })
          }
        })
      },
      complete() {

      }
    })
  } else {
    //用户按了拒绝按钮
    wx.showModal({
      title: '警告',
      content: '您点击了拒绝授权，将无法使用微信快捷登录!',
      showCancel: false,
      confirmText: '返回',
      success: function (res) {
        if (res.confirm) {
          console.log('用户点击了“返回授权”')
        }
      }
    })
  }
},

注意：在bindGetUserInfo回调中，如果用户同意授权，调用wx.login拿到code后需再次调用微信getUserInfo接口获取加密的敏感信息encryptedData和iv

[为什么不用上面的detail中的encryptedData和iv，因为那是在获取code之前获取的，这样就导致后台拿到code换取的sessionkey是新的，而detail中的encryptedData和iv是用旧的加密的，导致解密时报错] （这个巨坑，我和后台都饱受折磨）