参考资料:

微信小程序官方文档

uniapp开发微信小程序获取用户手机号

页面增加一个按钮

<button open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">唤起授权</button>

前端解密

安装 crypto-js

npm install crypto-js

下载 WXBizDataCrypt.js 文件

WXBizDataCrypt.js微信官方下载地址

打开Node文件夹,把 WXBizDataCrypt.js 文件放入你的项目中。(比如我是放在我的common文件夹下)
在需要解密的页面引用该文件
import WXBizDataCrypt from "@/common/WXBizDataCrypt.js"; //请以你的实际地址为准

具体代码如下,关键位置请看注释

<script>
//在需要解密的页面引用该文件
import WXBizDataCrypt from "@/common/WXBizDataCrypt.js";
export default {
data() {
return {}
},
methods: {
getPhoneNumber(PhoneNumber) {
let appid = "wxce185cd1da123456" //需替换
let secret = "25d0fe7478355910fc143ce6b1234567" //需替换
//调用 wx.login 接口,获取code
uni.login({
provider: 'weixin',
success: res => {
let url = 'https://api.weixin.qq.com/sns/jscode2session?appid=' + appid + '&secret=' + secret +
'&js_code=' +
res.code + '&grant_type=authorization_code'; //用 code 换取 session 和 openId
uni.request({
url: url, // 请求路径
success: res => { //成功res返回openid,session_key
// console.log(res)
//解密用户信息
let pc = new WXBizDataCrypt(appid, res.data.session_key);
let data = pc.decryptData(PhoneNumber.detail.encryptedData, PhoneNumber.detail.iv);
// //data就是最终解密的用户信息
// countryCode: "86" 区号
// phoneNumber: "15634123456" 用户绑定的手机号(国外手机号会有区号)
// purePhoneNumber: "15634123456" 没有区号的手机号
// watermark:
// appid: "wxce185cd1da123456"
// timestamp: 1607906868
console.log(data)
},
fail: err => {
console.log(err)
}
})
}
})
}
}
}
</script>

uniapp 获取用户手机号的更多相关文章

  1. nodejs+koa+uniapp实现微信小程序登陆获取用户手机号及openId

    nodejs+koa+uniapp实现微信小程序登陆获取用户手机号及openId 前言: 我准备用nodejs+koa+uniapp实现一款餐饮点单小程序,以及nodejs+koa+vue实现后端管理 ...

  2. 微信小程序获取用户手机号详解

    最近在做一款微信小程序,需要获取用户手机号,具体步骤如下: 流程图: 1.首先,客户端调用wx.login,回调数据了包含jscode,用于获取openid(用户唯一标识)和sessionkey(会话 ...

  3. 微信小程序获取用户手机号 记录 (PHP)

    1. 用户登录时需要获取 openid ,同时可以获取 session_key, 二者同时返回, 此时我们要将二者存储在服务端. 2. 小程序端 button 按钮拉起授权, 向api 传递 iv 和 ...

  4. uniapp获取用户OpenId及用户详情

    页面增加一个按钮 <button type="default" open-type="getUserInfo" @click="getUserI ...

  5. 微信小程序获取用户手机号

    获取微信用户绑定的手机号,需先调用wx.login接口. 小程序获取code. 后台得到session_key,openid. 组件触发getPhoneNumber 因为需要用户主动触发才能发起获取手 ...

  6. 微信小程序获取用户手机号,服务器解码demo

    原理:通过微信登陆接口wx.login得到encryptedData . iv  .code.经过接口处理code得到sessionkey.最后官方demo得到解密后的手机号.(接口处理这一步也可以在 ...

  7. Taro -- 获取用户手机号

    1. 安装 Taro 脚手架工具 安装 Taro 开发工具 @tarojs/cli 使用 npm 或者 yarn 全局安装 $ npm install -g @tarojs/cli $ yarn gl ...

  8. 微信小程序开发——点击按钮获取用户授权没反应或反应很慢的解决方法

    异常描述: 点击按钮获取用户手机号码,有的时候会出现点击无反应或很久之后才弹出用户授权获取手机号码的弹窗,这种情况下,也会出现点击穿透的问题(详见:微信小程序开发——连续快速点击按钮调用小程序api返 ...

  9. 小程序登录&授权&获取用户信息

    一 .登录 时序图如下: wx.login() 获取js_code 示例代码: App({   onLaunch: function() {     wx.login({       success: ...

随机推荐

  1. SQL SERVER获取表在哪些存储过程中使用过

    1.获取某张表在哪些存储过程中使用到 select distinct object_name(id) from syscomments where id in (select object_id fr ...

  2. 并发编程——Java线程的6种状态及切换

    前言 本次主要分享一下Java线程的六种状态及其转换. 如果对于线程的创建方式不太了解,推荐观看并发编程--认识java里的线程 线程的状态及其转换 操作系统线程的五种状态 新建(NEW) 就绪(RU ...

  3. Vulhub-Phpmyadmin 4.8.1远程文件包含漏洞

    前言:Phpmyadmin是一个用PHP编写的免费软件工具,旨在处理Web上的MySQL管理. 该漏洞在index.php中,导致文件包含漏洞 漏洞环境框架搭建: cd vulhub-master/p ...

  4. 第1篇-关于JVM运行时,开篇说的简单些

    开讲Java运行时,这一篇讲一些简单的内容.我们写的主类中的main()方法是如何被Java虚拟机调用到的?在Java类中的一些方法会被由C/C++编写的HotSpot虚拟机的C/C++函数调用,不过 ...

  5. 如何让win10开机默认开启小键盘?

    如何让win10开机默认开启小键盘? windows10默认是关闭小键盘的.每次输入开机密码的时候都需要按一下小键盘开启键(numlock),才能按数字键 一.运行注册表编辑器,修改InitialKe ...

  6. git 强制放弃本地修改(新增、删除文件)

    本地修改了一些文件,其中包含修改.新增.删除的. 不需要了,想要丢弃,于是做了git check -- .操作,但是只放弃了修改的文件,新增和删除的仍然没有恢复. 于是百度了下,使用如下命令: git ...

  7. SpringMVC学习08(拦截器)

    8.拦截器 概述 SpringMVC的处理器拦截器类似于Servlet开发中的过滤器Filter,用于对处理器进行预处理和后处理.开发者可以自己定义一些拦截器来实现特定的功能. 过滤器与拦截器的区别: ...

  8. Http协议中的CharacterEncoding、Content-Encoding和Transfer-Encoding

    https://www.cnblogs.com/jinzhiming/p/5765672.html https://www.jianshu.com/p/e918a65b617f https://www ...

  9. Python小白的数学建模课-19.网络流优化问题

    流在生活中十分常见,例如交通系统中的人流.车流.物流,供水管网中的水流,金融系统中的现金流,网络中的信息流.网络流优化问题是基本的网络优化问题,应用非常广泛. 网络流优化问题最重要的指标是边的成本和容 ...

  10. (数据科学学习手札127)在Python中使用icecream实现高效debug

    本文示例代码及文件已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 尽管有那么多花里胡哨的debug工具和方式 ...