微信小程序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 相关文章推荐
发布一个高效的JavaScript分析、压缩工具 JavaScript Analyser
Nov 30 Javascript
让 JavaScript 轻松支持函数重载 (Part 2 - 实现)
Aug 04 Javascript
Jquery chosen动态设置值实例介绍
Aug 08 Javascript
JS 屏蔽按键效果与改变按键效果的示例代码
Dec 24 Javascript
JS判断移动端访问设备并加载对应CSS样式
Jun 13 Javascript
Bootstrap按钮功能之查询按钮和重置按钮
Oct 26 Javascript
js实现随机抽选效果、随机抽选红色球效果
Jan 13 Javascript
JS实现动态给标签控件添加事件的方法示例
May 13 Javascript
BootStrap Validator 根据条件在JS中添加或移除校验操作
Oct 12 Javascript
ES6 系列之 WeakMap的使用示例
Aug 06 Javascript
详解Angular cli配置过程记录
Nov 07 Javascript
vue中keep-alive、activated的探讨和使用详解
Jul 26 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
PHP5.2中PDO的简单使用方法
2016/03/25 PHP
PHP7+Nginx的配置与安装教程详解
2016/05/10 PHP
PHP实现防盗链的方法分析
2017/07/25 PHP
实例讲解PHP页面静态化
2018/02/05 PHP
PHP正则表达式处理函数(PCRE 函数)实例小结
2019/05/09 PHP
javascript 建设银行登陆键盘
2008/06/10 Javascript
面向对象的编程思想在javascript中的运用上部
2009/11/20 Javascript
javascript sudoku 数独智力游戏生成代码
2010/03/27 Javascript
js或jquery实现页面打印可局部打印
2014/03/27 Javascript
Bootstrap网格系统详解
2016/04/26 Javascript
AngularJs 国际化(I18n/L10n)详解
2016/09/01 Javascript
JQuery实现DIV其他动画效果的简单实例
2016/09/18 Javascript
vue-cli 脚手架基于Nightwatch的端到端测试环境的过程
2018/09/30 Javascript
Vue列表渲染的示例代码
2018/11/01 Javascript
浅析vue中的MVVM实现原理
2019/03/04 Javascript
Vue中的nextTick作用和几个简单的使用场景
2021/01/25 Vue.js
总结Python中逻辑运算符的使用
2015/05/13 Python
python 简单的绘图工具turtle使用详解
2017/06/21 Python
python3利用ctypes传入一个字符串类型的列表方法
2019/02/12 Python
解决pip install psycopg2出错问题
2020/07/09 Python
Python 如何反方向迭代一个序列
2020/07/28 Python
Anaconda使用IDLE的实现示例
2020/09/23 Python
浅谈html5增强的页面元素
2016/06/14 HTML / CSS
英国最大的在线快递公司之一:ParcelHero
2019/11/04 全球购物
法学专业应届生求职信
2013/10/16 职场文书
企业消防安全制度
2014/02/02 职场文书
小学领导班子对照材料
2014/08/23 职场文书
个人反四风对照检查材料思想汇报
2014/09/23 职场文书
运动会闭幕词
2015/01/28 职场文书
计划生育目标责任书
2015/05/09 职场文书
优秀共产党员事迹材料2016
2016/02/29 职场文书
小学四年级作文之人物作文
2019/11/06 职场文书
解决Goland 同一个package中函数互相调用的问题
2021/05/06 Golang
Nginx反向代理、重定向
2022/04/13 Servers
WINDOWS下安装mysql 8.x 的方法图文教程
2022/04/19 MySQL
Linux安装Docker详细教程
2022/07/07 Servers