微信小程序-授权登录

321 阅读1分钟

前端-获取用户手机号 - 微信官方文档 · 小程序

// html 点击按钮获取用户手机号
<button type="default" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">获取手机号</button>

// js
getPhoneNumber(e) {
    console.log("获取手机号==>>", e)
}

// 返回参数
{  
    "detail":{  
        "cloudID":"63_IcXeHUrBNH8l-6gIsPy2_JR9yaXtxkL_a3-ocGcjS9QHwBD7lU-PuyQLrDc",  
        "code":"cdbc2dac755e3f47e1cab21e8b80e23eae74385606c59e74f470527e2c22eff2",  
        "encryptedData":"/wkc1MFqdWYscpcTVu4s0T+GC1aOoUDRjklqu3D6H2LOBTBVDsHMzHMJjvxAf0YOjWRmbFL+YJA4vtQIC+qzVi7ByQMQYKpDcdEbYTMQ1dKHdSx4xSvbZ+CgpTouwOsXvZYRPdniHfqLudG6L7VOn6SD+JJ+tvwO8rv9iLy73z2iSJD0YLOkpC2IA9yQidzG64qvJXXFqtMZwDPyq9fLBg==",  
        "errMsg":"getPhoneNumber:ok",  
        "iv":"jgqYp1J6+1yM/yqaA0A9oQ=="  
    }  
}

wx接口调用凭证 - 微信官方文档 · 小程序

后端-解密用户手机号 - 微信官方文档 · 小程序

解密请求地址

POST https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=ACCESS_TOKEN

属性类型说明
access_token / cloudbase_access_tokenstring 是接口调用凭证
codestring 是手机号获取凭证

获取用户OpenId

获取用户OpenId - 微信官方文档 · 小程序

页面展示用户信息

<!-- wxml页面 用来展示用户信息 -->
<view style="width: 100rpx; height: 100rpx; border-radius: 50rpx;  overflow: hidden;">
    <!-- 展示用户头像 -->
    <open-data type="userAvatarUrl"></open-data>
</view>
<view class="user-avatar">
    <!-- 展示用户昵称 -->
    <open-data type="userNickName"></open-data>
</view>

解密用户手机号

前端完整代码

    getPhoneNumber(e: any) {
      let identifier = e.target.dataset.identifier
      // 设置身份信息
      this.setGlobalIdentifier(identifier)
      if (e.detail.errMsg != 'getPhoneNumber:ok') {
        app.util.showModal("您取消了授权")
        return
      }
      // 登录 获取 code
      wx.login({
        success: loginRes => {
          if (loginRes.errMsg != 'login:ok') {
            app.util.showModal("获取微信code失败")
            return
          }
          let param = {
            "loginCode": loginRes.code,
            "phoneCode": e.detail.code,
            "identity": identifier
          };
          wx.showLoading({ title: '登录中...', mask: true })
          app.request.wechatLogin(param).then(d => {
            if (d.code != 0) {
              app.util.showModal("登陆失败")
              wx.hideLoading()
              return
            }
            app.globalData.isLogin = true
            app.globalData.login = d.data.login
            if (d.data.isRegister) {
              // 跳转页面
              if (identifier === "IDENTITY_BIZ_CUSTOMER") {
                wx.navigateTo({ url: "/pages/my/company_info/index" })
              }
              if (identifier === "IDENTITY_BIZ_FLEET") {
                wx.navigateTo({ url: "/pages/register/fleet_register/index" })
              }
              if (identifier === "IDENTITY_BIZ_DRIVER") {
                wx.navigateTo({ url: "/pages/register/driver_register/index" })
              }
            } else {
              wx.switchTab({
                url: '/pages/index/index'
              })
            }
            wx.hideLoading()
            console.log("【登录页面】getApp<IAppOption>().globalData.isLogin==>>", getApp<IAppOption>().globalData.isLogin)
            console.log("【登录页面】app.globalData.isLogin==>>", app.globalData.isLogin)
            
          })
        },
      })
    }