微信小程序-获取手机号开发

实现思路：

• 以button组件去调用<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
• onLoad时，通过wx.login获取code,传给后端，获取openID和sessionKey
• method中，通过getPhoneNumber获取encryptedData，iv，组合{encryptedData、iv、sessionKey}请求后台解密获取用户手机号
• 注意：最后确定你的小程序是否有权限调用getPhoneNumber函数，微信只对认证的小程序开放此类接口。

<template>
  <view>
    <button plain="true" open-type='getPhoneNumber' @getphonenumber="getPhoneNumber">获取用户手机号</button>
    <view> 手机号：{{tel}}</view>
  </view>
</template>

<script>
  // 实现思路：
  // 1、以button组件去调用<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
  // 2、onLoad时，通过wx.login获取code,传给后端，获取openID和sessionKey
  // 3、method中，通过getPhoneNumber获取encryptedData，iv，组合{encryptedData、iv、sessionKey}请求后台解密获取用户手机号
  // 4、注意：最后确定你的小程序是否有权限调用getPhoneNumber函数，微信只对认证的小程序开放此类接口。
  export default {
    data() {
      return {
        tel: '11111111111',
        sessionkey: ''
      }
    },
    onLoad() {
      wx.login({
        success: (res) => {
          if (res.code) {
            let param = {
              code: res.code,
            }
            this.getSessionKey(param);
          }
        }
      });
    },
    methods: {
      // 1 获取openID和sessionKey
      getSessionKey(param) {
        this.$request.setRequest('/wx', param,false)
          .then(res => {
            if (res.data.status == 1) { //成功
              this.sessionKey = res.data.data.session_key;
            }
          })
      },
      // 2 获取手机号
      getPhoneNumber(e) {
        if (e.detail.errMsg == "getPhoneNumber:ok") {
          let params = {
            encrypdata: e.detail.encryptedData,
            ivdata: e.detail.iv,
            sessionkey: this.sessionKey
          }
          console.log('参数', params)
          //后端获取参数进行解密
          this.jiemiPhoneNumber(params);
        } else {
          console.log("拒绝授权")
        }
      },
      // 3 请求后端解密
      jiemiPhoneNumber(params) {
        this.$request.setRequest('/jiemi', params)
          .then(res => {
            if (res.data.status == 1) { //成功
              this.tel = res.data.data.tel;
            } else if (res.data.status < 1) {
              this.$request.setErrorMessage(res.data.msg)
            } else {
              this.$request.setErrorMessage()
            }
          })
      },
    },
  }
</script>

<style lang="scss" scoped>

</style>