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

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)
        }
      }
    })
  }
})

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

相关推荐
weixin_lynhgworld15 小时前
盲盒抽谷机小程序系统开发:从0到1的完整方法论
小程序
weixin_lynhgworld16 小时前
短剧小程序系统开发:赋能创作者,推动短剧艺术创新发展
小程序
一匹电信狗19 小时前
【C++】异常详解(万字解读)
服务器·c++·算法·leetcode·小程序·stl·visual studio
说私域1 天前
基于开源AI智能客服、AI智能名片与S2B2C商城小程序的微商服务优化及复购转介绍提升策略研究
人工智能·小程序
熬耶2 天前
Uniapp之微信小程序自定义底部导航栏形态
微信小程序·小程序·uni-app
IT毕设实战小研2 天前
基于Spring Boot校园二手交易平台系统设计与实现 二手交易系统 交易平台小程序
java·数据库·vue.js·spring boot·后端·小程序·课程设计
weixin_177297220692 天前
剧本杀小程序系统开发:重构推理娱乐生态
小程序·重构·娱乐
IT毕设实战小研2 天前
基于SpringBoot的救援物资管理系统 受灾应急物资管理系统 物资管理小程序
java·开发语言·vue.js·spring boot·小程序·毕业设计·课程设计
程序员陆通4 天前
零基础AI编程开发微信小程序赚流量主广告实战
微信小程序·小程序·ai编程
paopaokaka_luck4 天前
校园快递小程序(腾讯地图API、二维码识别、Echarts图形化分析)
vue.js·spring boot·后端·小程序·uni-app