TNBLOG
首页
博客
视频
资源
问答
猿趣
手机
关于
搜索
收藏
便签
笔记
消息
创作
登录
剑轩
应无所住,而生其心
博主信息
排名
6
文章
6
粉丝
16
评论
8
文章类别
CSS
16篇
微服务
41篇
Git
15篇
.NET
104篇
移动开发
33篇
软件架构
23篇
.NET Core
119篇
.NET MVC
11篇
英语
3篇
随笔
90篇
Bootstrap
3篇
Redis
21篇
编辑器
10篇
Js相关
15篇
虚拟化
8篇
更多
Oracle
7篇
Python
14篇
数据库
26篇
EF
17篇
微信
3篇
前端
160篇
消息队列
6篇
docker
41篇
多线程
1篇
Java
4篇
软件基础
2篇
C++
2篇
WCF
7篇
Linux
7篇
nginx
5篇
K8S
9篇
ABP
2篇
最新文章
最新评价
{{item.articleTitle}}
{{item.blogName}}
:
{{item.content}}
关于我们
ICP备案 :
渝ICP备18016597号-1
网站信息:
2018-2024
TNBLOG.NET
技术交流:
群号656732739
联系我们:
contact@tnblog.net
欢迎加群
欢迎加群交流技术
原
uni-app开发微信小程序实现手机号码一键登录,小程序获取手机号码
1232
人阅读
2023/10/7 16:26
总访问:
4428745
评论:
0
收藏:
0
手机
分类:
移动开发
[TOC] ### 前提 tn2>要获取手机号的前提就是,首先你的appid是企业注册的,并且需要认证,而且要让管理微信公众平台appid的管理员把你的微信号添加到项目成员。 ### 第一步:先获取access_token 这个是微信公众号,微信小程序开发的基础,就一个get请求看官方文档就知道了很简单 #### 请求的接口 ``` https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=你的appid&secret=你的secret ``` tn4>拿到appid和secret直接在浏览器输入就可以看到结果了,appid和secret在微信小程序管理员账户登录后的开发管理-->开发设置可以看到。 **或者直接把请求的地址复制到postman中去请求也可以** ![](https://img.tnblog.net/arcimg/aojiancc2/a7e6726adc464c23b32727b532c79e13.png) 以前写的用.net代码获取access_token的 https://www.tnblog.net/aojiancc2/article/details/2470 ### 第二步:获取动态令牌 https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html ##### 需要通过按钮来触发用户获取手机号码的授权 在uni-app上是这么写(编译成小程序的代码后应该就会变成官方文档上面的那种写法,貌似就是绑定的事件有一点小区别) ``` <button class="login-btn" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">手机号码一键登录</button> ``` 使用一个事件来处理授权后的代码: ``` const onGetPhoneNumber = (e: any) => { if (e.detail.errMsg == "getPhoneNumber:fail user deny") { //用户决绝授权 //拒绝授权后弹出一些提示 } else { //允许授权 console.log(e); } } ``` 用户点击后弹出一个授权框 <img src="https://img.tnblog.net/arcimg/aojiancc2/be85a4b8c0ad4891b0321f8a5265a613.jpg" style="width:399px;height:auto;"> ##### 当用户点击允许按钮后就可以拿到动态令牌token了 ![](https://img.tnblog.net/arcimg/aojiancc2/f7a15deb36334ae69094e4e3b9a49ee9.png) 这里不需要去手动调用接口,直接使用按钮去触发即可,用户点击允许后就可以拿到code,然后通过第一步拿到的access_token就可以去调用接口拿到手机号了。 ### 第三步:通过拿到的access_token与动态令牌去获取用户的手机号 官方文档:https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/user-info/phone-number/getPhoneNumber.html #### 请求的接口 ``` https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=你的access_token ``` 使用post请求的方式,还需要在body中传递code,使用postman测试一下: ![](https://img.tnblog.net/arcimg/aojiancc2/bfd3376c60a54bcd8268074696da1f95.jpg) 没有问题,手机号能够正确的获取! ### 代码封装
欢迎加群讨论技术,1群:677373950(满了,可以加,但通过不了),2群:656732739
👈{{preArticle.title}}
👉{{nextArticle.title}}
评价
{{titleitem}}
{{titleitem}}
{{item.content}}
{{titleitem}}
{{titleitem}}
{{item.content}}