原生小程序一键获取手机号

1.效果图

2.代码index.wxml

html 复制代码
 <!-- 获取手机号 利用手机号快速填写的功能,将button组件 open-type 的值设置为 getPhoneNumber-->
  <button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">获取手机号</button>```
2.index.js

```html
Page({
  data: {
  },
  getPhoneNumber: function (e) {
    var that = this
    // 一定是getPhoneNumber里面的code
    const code = e.detail.code
    wx.login({//通过wx.login来获取code
      success: res => {
        if (res.code) {
          wx.getUserInfo({
            success: res1 => {
              wx.request({
                url: '后端接口',//获取到后端解析后的号码返回给前端
                method: 'POST',
                data: {
                  code: code,
                  encryptedData: res1.encryptedData,
                  iv: res1.iv
                },
                success: res => {
                  that.setData({
                    phone: res.data.phoneNumber
                  })
                }
              })
            }
          })
        } else {
          console.log('获取失败!' + res.errMsg)
        }
      }
    })
  }
})

注意:获取手机号的功能好像只允许经过认证的小程序使用,如果未认证只能使用测试号才可以

相关推荐
于先生吖10 小时前
高并发稳定运营,JAVA 动漫短剧小程序 + H5 源码
java·开发语言·小程序
2501_9159214310 小时前
uni-app一键生成iOS安装包并上传TestFlight全流程
android·ios·小程序·https·uni-app·iphone·webview
CHU72903511 小时前
旧衣新生之旅:旧衣服回收小程序的环保实践
小程序
闹小艾11 小时前
2026 知识付费线上课程小程序 SaaS制作平台深度评测:6 大维度拆解,教你选对不踩坑
大数据·小程序
一只小白菜11 小时前
Taro 4 + 支付宝小程序:Vite 编译报错 chunk.type undefined 的终极解决方案
小程序·taro
低代码布道师1 天前
微搭低代码MBA 培训管理系统实战 25——小程序用户登录与账号绑定
低代码·小程序
清风絮柳2 天前
65.少儿英语微信小程序
vue.js·spring boot·微信小程序·小程序·毕业设计
tjsoft2 天前
unigui开发微信小程序
微信小程序·小程序
m0_462803883 天前
“趣味运动会记分”功能教学指南
小程序
网络安全学习库3 天前
很喜欢Vue,但还是选择了React: AI时代的新考量
vue.js·人工智能·react.js·小程序·aigc·产品经理·ai编程