微信小程序实现用户手机号授权

以下代码均使用uniapp进行实现

本文的代码只提供了前端代码部分,后端接口部分没有进行提供

javascript 复制代码
<!-- 使用 open-type 来触发手机号授权 -->
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
    绑定手机号
</button>

<script>
  export default {
    data() {
      return {
        phoneNumber: '', // 存储手机号
      };
    },
    methods: {
      // 获取用户手机号的回调函数
      getPhoneNumber(e) {
        if (e.detail.code) {
          var prams = {
            'code': e.detail.code
          }
          // 此处的请求是为了那这用户同意授权后得到的code去后台置换token以及拿到用户的手机号
          http.post(api.smallLogin, prams).then(res => {
            uni.setStorageSync('token', res.data.token)
            uni.setStorageSync('userId', res.data.userId)
            this.phoneNumber = res.data.phone
            uni.navigateBack({
              delta: 1
            })
          })
        } else {
          console.error('用户拒绝了手机号授权');
        }
      }
    }
  }
</script>

以上代码只是我的个人写法,如有不足之处,欢迎批评指正!

相关推荐
Stanford_11066 小时前
【2026新年启程】学习之路,探索之路,技术之路,成长之路……都与你同行!!!
前端·c++·学习·微信小程序·排序算法·微信开放平台
初学者52137 小时前
微信小程序调用录音没反应,本地开发测试却没问题,operateRecorderfail appid privacy api banned
微信小程序·小程序
微爱帮监所写信寄信8 小时前
微爱帮监狱寄信写信小程序信件内容实时保存技术方案
java·服务器·开发语言·前端·小程序
说私域9 小时前
基于开源AI大模型AI智能名片S2B2C商城小程序的内容价值生成与多点选择传播策略研究
人工智能·微信·小程序·开源
2501_916007471 天前
iPhone APP 性能测试怎么做,除了Instruments还有什么工具?
android·ios·小程序·https·uni-app·iphone·webview
2501_915106321 天前
Windows 环境下有哪些可用的 iOS 上架工具, iOS 上架工具的使用方式
android·ios·小程序·https·uni-app·iphone·webview
2501_915106321 天前
iOS 抓包工具有哪些?不同类型的抓包工具可以做什么
android·ios·小程序·https·uni-app·iphone·webview
云起SAAS1 天前
供求求购供应发布VIP会员抖音快手微信小程序看广告流量主开源
微信小程序·小程序·ai编程·看广告变现轻·供求求购供应发布
毕设源码-朱学姐1 天前
【开题答辩全过程】以 基于微信小程序旅游疫情防控管理系统为例,包含答辩的问题和答案
微信小程序·小程序·旅游
weixin_lynhgworld1 天前
陪诊小程序系统开发:开启就医陪伴新体验 [特殊字符]
小程序