参考资料:

微信小程序官方文档

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. 题解CF757B

    题目 题意:在 \(s\) 数组中找出尽可能多的数使得他们的最大公约数 \(>1\) 既然最大公约数 \(>1\),\(s\) 数组的值域是 \(1 \le s_i \le 10^5\), ...

  2. CentOS Linux Cockpit 管理工具使用

    1.安装 # yum install  cockpit 2.启动服务 # systemctl start cockpit.socket 3.设置开机启动 # systemctl enable  coc ...

  3. 4.10 Python3 进阶 - 迭代器 & 生成器

    >>返回主目录 源码 from typing import Iterable, Iterator # 可迭代对象:字符串.列表.元组.字典.集合.range().enumerate()等 ...

  4. 【Lua篇】静态代码扫描分析(二)词法分析

    一.词法分析 词法分析(英语:lexical analysis)是计算机科学中将字符序列转换为单词(Token)序列的过程.进行词法分析的程序或者函数叫作词法分析器(Lexical analyzer, ...

  5. Docker入门第五章

    常用其他命令 后台启动容器 #命令 docker run -d 镜像名! [root@lvshihao /]# docker run -d centos 757173133e8e73985f024dc ...

  6. MySQL-04-SQL简单介绍

    SQL介绍 SQL 结构化查询语言 5.7 以后符合SQL92严格模式 通过sql_mode参数来控制 常用SQL分类 DDL:数据定义语言 DCL:数据控制语言 DML:数据操作语言 DQL:数据的 ...

  7. 《手把手教你》系列技巧篇(十九)-java+ selenium自动化测试-元素定位大法之By css下卷(详细教程)

    1.简介 按计划今天宏哥继续讲解css的定位元素的方法.但是今天最后一种宏哥介绍给大家,了解就可以了,因为实际中很少用. 2.常用定位方法(8种) (1)id(2)name(3)class name( ...

  8. Do you want to continue? [Y/n] Abort.

    当出现这个后命令终止,无法选择 y这时候 ,在输入命令时候提前加入 -y udo apt install sysv-rc-conf -y

  9. SQL 练习18

    按各科成绩进行排序,并显示排名, Score 重复时保留名次空缺 SELECT t.cid,t.sid,t.score ,COUNT(t1.score)+1 as 排名 from sc as t LE ...

  10. Docker小白到实战之容器数据卷,整理的明明白白

    前言 上一篇把常用命令演示了一遍,其中也提到容器的隔离性,默认情况下,容器内应用产生的数据都是由容器本身独有,如果容器被删除,对应的数据文件就会跟着消失.从隔离性的角度来看,数据就应该和容器共存亡:但 ...