微信小程序不经过后端就能获取到用户手机号方法

情形描述:

微信小程序官方文档中给出的获取微信用户绑定的手机号方法:
链接: https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html
此方法是通过调用wx.login()接口,将code,iv,encryptedData传入后端进行解密处理,这种方法适用于有后端专用解密地址,但是如果没有的话就行不通了,不过别慌,下面我将介绍不通过后端解密就能获取到手机号的方法↓↓↓↓↓
--------------------------------------------分割线------------------------------------------------------------------

使用云函数即可实现

云开发开通方式这里就不说了,百度一大堆

实现步骤:

第一步:创建云函数login

在这里插入图片描述
找到新建云函数中的index.js文件,将其中的代码替换为下方代码(悄悄说一下,虽然代码是百度的,但是功能完全ok)

// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
// 云函数入口函数
exports.main = async (event, context) => {
  switch (event.action) {
    case 'getcellphone': {
      return getCellphone(event);
    }
    default: {
      return
    }
  }
}

async function getCellphone(event) {
  const res = await cloud.getOpenData({
    list: [event.id], 
  })
  return {
    res,
    event
  };
}
第二步:在app.js中添加调用云函数方法
wx.cloud.init({
  env: '你的环境ID',
  traceUser: true,
})

环境ID查看方式:在这里插入图片描述

第三步:wxml中添加button组件,添加相应的bind方法js代码
<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">获取手机号码</button>
getPhoneNumber(e) {    
    wx.cloud.callFunction({
      name: 'login',
      data: {
        action: 'getcellphone',
        id: e.detail.cloudID
      },
      success: res => {
        console.log(res)       
      }     
    })
}
最后一步最重要的!!!上传并部署

在这里插入图片描述
到这一步就结束了,编译一下看看效果,console出来phoneNumber的值就是我们所需要的手机号码。
在这里插入图片描述
总结一下,这个方法对于没有后端提供解密地址的人员来说很方便,但是会有个弊端,对于没有绑定手机号码的微信号来说,就获取不到想要的东西,这种情况我没有遇到过,如有遇到的朋友欢迎和我交流。

不说了,工头喊我搬砖去了。。。。。。

  • 5
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值