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


Posted in Javascript onSeptember 29, 2017

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

小程序中有很多地方都会用到注册用户信息的地方,用户需要填写手机号等, 有了这个组件可以快速获取微信绑定手机号码,无须用户填写。

1.getPhoneNumber这个组件通过button来实现(别的标签无效)。将button中的open-type=“getPhoneNumber”,并且绑定bindgetphonenumber事件获取回调。

<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">

2.在使用这个组件之前必须先调用login接口,如果没有调用login点击button时会提示先调用login。

App({ 
  onLaunch: function () { 
    wx.login({ 
      success: function (res) { 
        if (res.code) { 
          //发起网络请求 
          console.log(res.code) 
        } else { 
          console.log('获取用户登录态失败!' + res.errMsg) 
        } 
      } 
    }); 
  } 
})

3.通过bindgetphonenumber绑定的事件来获取回调。回调的参数有三个,

  • errMsg:用户点击取消或授权的信息回调。
  • iv:加密算法的初始向量(如果用户没有同意授权则为undefined)。
  • encryptedData: 用户信息的加密数据(如果用户没有同意授权同样返回undefined)

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

getPhoneNumber: function(e) {  
  console.log(e.detail.errMsg)  
  console.log(e.detail.iv)  
  console.log(e.detail.encryptedData)  
  if (e.detail.errMsg == 'getPhoneNumber:fail user deny'){ 
   wx.showModal({ 
     title: '提示', 
     showCancel: false, 
     content: '未授权', 
     success: function (res) { } 
   }) 
  } else { 
   wx.showModal({ 
     title: '提示', 
     showCancel: false, 
     content: '同意授权', 
     success: function (res) { } 
   }) 
  } 
 }

4.最后我们需要根据自己的业务逻辑来进行处理,如果用户不同意授权的话可能我们会有一个让他手动输入的界面,如果不是强制获取手机号的话可以直接跳转页面进行下一步。(用户不同意授权errMsg返回‘getPhoneNumber:fail user deny')

5.用户同意授权,我们可以根据login时获取到的code来通过后台以及微信处理拿到session_key,最后通过app_id,session_key,iv,encryptedData(用户同意授权errMsg返回‘getPhoneNumber:ok')

6.解密的方法可以去微信官方开发文档查看,有很详细说明。

加密数据解密算法(官方文档)

如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
EasyUI中datagrid在ie下reload失败解决方案
Mar 09 Javascript
基于jQuery实现左右图片轮播(原理通用)
Dec 24 Javascript
AngularJS基础 ng-cut 指令介绍及简单示例
Aug 01 Javascript
值得分享的Bootstrap Table使用教程
Nov 23 Javascript
AngularJS指令与指令之间的交互功能示例
Dec 14 Javascript
Node.js创建HTTP文件服务器的使用示例
May 11 Javascript
vue引入js数字小键盘的实现代码
May 14 Javascript
在Bootstrap开发框架中使用dataTable直接录入表格行数据的方法
Oct 25 Javascript
Vue 实现手动刷新组件的方法
Feb 19 Javascript
vue集成kindeditor富文本的实现示例代码
Jun 07 Javascript
vue axios重复点击取消上一次请求封装的方法
Jun 19 Javascript
微信小程序修改数组长度的问题的解决
Dec 17 Javascript
微信小程序中setInterval的使用方法
Sep 29 #Javascript
vue生成随机验证码的示例代码
Sep 29 #Javascript
JS设计模式之单例模式(一)
Sep 29 #Javascript
微信小程序的日期选择器的实例详解
Sep 29 #Javascript
JS设计模式之惰性模式(二)
Sep 29 #Javascript
bootstrap table方法之expandRow-collapseRow展开或关闭当前行数据
Aug 09 #Javascript
详解用Node.js实现Restful风格webservice
Sep 29 #Javascript
You might like
PHP系统命令函数使用分析
2013/07/05 PHP
PHP借助phpmailer发送邮件
2015/05/11 PHP
php实现JWT验证的实例教程
2020/11/26 PHP
Angular用来控制元素的展示与否的原生指令介绍
2015/01/07 Javascript
JS组件Bootstrap按钮组与下拉按钮详解
2016/05/10 Javascript
jQuery可见性过滤选择器用法示例
2016/09/09 Javascript
jQuery+正则+文本框只能输入数字的实现方法
2016/10/07 Javascript
AngularJS使用ng-Cloak阻止初始化闪烁问题的方法
2016/11/03 Javascript
Vue获取DOM元素样式和样式更改示例
2017/03/07 Javascript
ES6中Proxy代理用法实例浅析
2017/04/06 Javascript
JS身份证信息验证正则表达式
2017/06/12 Javascript
JS实现静态页面搜索并高亮显示功能完整示例
2017/09/19 Javascript
jQuery zTree 异步加载添加子节点重复问题
2017/11/29 jQuery
vue.js 2.*项目环境搭建、运行、打包发布的详细步骤
2019/05/01 Javascript
layui使用templet格式化表格数据的方法
2019/09/16 Javascript
vue商城中商品“筛选器”功能的实现代码
2020/07/01 Javascript
javascript自定义加载loading效果
2020/09/15 Javascript
vue中重定向redirect:‘/index‘,不显示问题、跳转出错的完美解决
2020/09/28 Javascript
[05:43]VG.R战队教练Mikasa专访:为目标从未停止战斗
2016/08/02 DOTA
Python转换HTML到Text纯文本的方法
2015/01/15 Python
Python中的默认参数详解
2015/06/24 Python
Python使用面向对象方式创建线程实现12306售票系统
2015/12/24 Python
Python爬虫框架Scrapy基本用法入门教程
2018/07/26 Python
对numpy中向量式三目运算符详解
2018/10/31 Python
pyftplib中文乱码问题解决方案
2020/01/11 Python
Python3压缩和解压缩实现代码
2021/03/01 Python
美国时尚配饰品牌:Dooney & Bourke
2017/11/14 全球购物
荷兰在线体育用品商店:Avantisport.nl
2018/07/04 全球购物
药店主任岗位责任制
2014/02/10 职场文书
公司新人试用期自我评价
2014/09/17 职场文书
财务部会计岗位职责
2015/02/03 职场文书
2015年青年教师工作总结
2015/05/25 职场文书
CocosCreator如何实现划过的位置显示纹理
2021/04/14 Javascript
Python基础之pandas数据合并
2021/04/27 Python
Android Studio实现简易进制转换计算器
2022/05/20 Java/Android
微软发布Windows 11今年最大更新22H2(附 ISO 镜像官方下载)
2022/09/23 数码科技