图片演示

wxml（login.wxml）代码

 <view class="">
    <button class="logoBtn" wx:if='{{hiddenBtn == 0}}' open-type="getUserInfo"  bindgetuserinfo="bindGetUserInfo">微信账号快捷登录</button>
    <!-- <button class="logoBtn" wx:if='{{hiddenBtn == 1}}' open-type="getUserInfo"  bindgetuserinfo="bindGetUserInfo">微信账号快捷登录</button> -->
    <button class="logoBtn" wx:if='{{hiddenBtn == 2}}' open-type="getPhoneNumber"
      bindgetphonenumber="getPhoneNumber">绑定微信手机号</button>
  </view>

js(login.js)代码

  data: {
    openid: '',
    session_key: '',
    showModal: false,//弹出框显示
    hiddenBtn: 0,//微信授权登录显示
  },
   /**
   * 获取微信用户的相关信息
   */
  onLogin() {
    var that = this
    var openid = that.data.openid
    var avatar = that.data.avatarUrl
    var nickname = that.data.nickName
    var address = that.data.address
    var sex = that.data.sex
    // console.log('ccccccccccccc',avatarUrl,nickName,that.data.fid)
    // 给后台传信息
    wx.request({
      url: app.globalData.urlSrc + '...',
      method: 'POST',
      data: {
        open_id: openid,
        avatar: avatar,
        address:address,
        nickname: nickname,
        sex:sex,
      },
      header: {
        'content-type': app.globalData.head
      },
      success: function (v) {
        console.log('微信授权后给后台传相关信息', v)
        var code = v.data.code
        if (code == 1) {
          that.setData({
            showModal: false,
            hiddenBtn: 2
          })
          wx.showToast({
            title: '请继续点击绑定手机号！',
            icon: 'none'
          })
         
          // wx.setStorage({
          //   key: "shibie",
          //   data: app.globalData.shibie
          // })              
        }
      },
    })
  },
  
  /**
   * 点击绑定微信手机号
   */
  getPhoneNumber: function (event) {
    var that = this;
    wx.checkSession({
      success: (res) => {
        console.log('nnnnnnnn', res)
        wx.login({
          success: function (res) {
            console.log('is_code:', res.code)
            if (res.code) {
              //获取openid
              wx.request({
                url: app.globalData.urlSrc + '....',
                method: 'GET',
                data: {
                  code: res.code
                },
                header: {
                  'content-type': app.globalData.head
                },
                success: function (e) {
                  console.log('获取session_key:', e.data)
                  var session_key = e.data.data.session_key
                  var ivObj = event.detail.iv
                  var telObj = event.detail.encryptedData
                  wx.request({
                    url: app.globalData.urlSrc + '...',
                    method: 'POST',
                    data: {
                      session_key: session_key,
                      encryptedData: telObj,
                      iv: ivObj,
                    },
                    header: {
                      'content-type': app.globalData.head
                    },
                    success: function (res) {
                      // phoneObj = res.data.phoneNumber;
                      console.log("手机号=", res.data)
                      var code = res.data.code
                      if (code == 1) {
                        var phone = res.data.mobile
                        var openid = that.data.openid
                        // 传手机号给后台
                        wx.request({
                          url: app.globalData.urlSrc + '....',
                          method:'POST',
                          data: {
                            open_id:openid,
                            phone:phone
                          },
                          header: {
                            'content-type': app.globalData.head
                          },
                          success: function (v) {
                            // phoneObj = res.data.phoneNumber;
                            console.log("传手机号给后台", v.data)
                            var code = v.data.code
                            if (code == 1) {
                              app.globalData.userId = v.data.data.user_id
                              wx.setStorage({
                                key: "userId",
                                data: app.globalData.userId
                              })
                              wx.reLaunch({
                                url: '../community/community',
                              })
                            }
                            // else{
                            //   wx.showToast({
                            //     title: '手机号获取失败，请重新获取！',
                            //     icon:'none'
                            //   })
                            // }
                          }
                        })
                      } else {
                        wx.showToast({
                          title: '手机号获取失败，请重新获取！',
                          icon: 'none'
                        })
                      }
                    }
                  })
                }
              })
            }
          }
        })
      },
      fail(err) {
        console.log('gggggggggg', err)
        that.getSession()
      }
    })
  },
   /**
   * 点击微信账号快捷登录按钮后
   * 
   */
  bindGetUserInfo: function (e) {
    var that = this
    console.log('dddd', that.data.openid)
    // console.log('vvvvvvvv', that.data.tag)

    // if (that.data.openid != '') {}
    if (e.detail.userInfo) {
      //用户按了允许授权按钮
      var that = this;  
      console.log("用户的信息如下：", e.detail.userInfo);
      this.setData({
        avatarUrl: e.detail.userInfo.avatarUrl,
        nickName: e.detail.userInfo.nickName,
        sex: e.detail.userInfo.gender,
        address: e.detail.userInfo.country +',' +e.detail.userInfo.province+ ',' +e.detail.userInfo.city,
        showModal: false,
      })
      that.onLogin()
    } else {
      //用户按了拒绝按钮
      console.log('用户点击了“返回授权”');
      wx.showModal({
        title: '警告',
        content: '您点击了拒绝授权，将无法进入小程序，请授权之后再进入!!!',
        showCancel: false,
        confirmText: '返回授权',
        success: function (res) {
          if (res.confirm) {
            console.log('用户点击了“返回授权”');
            wx.showToast({
              title: '您已经取消了授权！',
              icon: 'none'
            })
          }
        }
      });
    }
  },