微信小程序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 字符编码规则
May 04 Javascript
JavaScript 设计模式学习 Singleton
Jul 27 Javascript
js DataSet数据源处理代码
Mar 29 Javascript
Javascript异步编程的4种方法让你写出更出色的程序
Jan 17 Javascript
JS加jquery简单实现标签元素的显示或隐藏
Sep 23 Javascript
js中判断对象是否为空的三种实现方法
Dec 23 Javascript
js获取光标位置和设置文本框光标位置示例代码
Jan 09 Javascript
jQuery解析json数据实例分析
Nov 24 Javascript
理解javascript闭包
Dec 15 Javascript
React Native AsyncStorage本地存储工具类
Oct 24 Javascript
vue文件运行的方法教学
Feb 12 Javascript
vue backtop组件的实现完整代码
Apr 07 Vue.js
微信小程序中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 定界符 使用技巧
2009/06/14 PHP
PHP积分兑换接口实例
2015/02/09 PHP
PHP实现数据分页显示的简单实例
2016/05/26 PHP
php实现批量上传数据到数据库(.csv格式)的案例
2017/06/18 PHP
js querySelector和getElementById通过id获取元素的区别
2012/04/20 Javascript
JavaScript中变量提升 Hoisting
2012/07/03 Javascript
ExtJS下 Ext.Direct加载和提交过程排错小结
2013/04/02 Javascript
js控制input输入字符解析
2013/12/27 Javascript
Jquery动态替换div内容及动态展示的方法
2015/01/23 Javascript
使用Jquery实现每日签到功能
2015/04/03 Javascript
浅谈JavaScript中的作用域和闭包问题
2015/07/07 Javascript
15个常用的jquery代码片段
2015/12/19 Javascript
JavaScript数据类型转换的注意事项
2016/07/31 Javascript
js实现右键自定义菜单
2016/12/03 Javascript
js将字符串中的每一个单词的首字母变为大写其余均为小写
2017/01/05 Javascript
vue2.0结合DataTable插件实现表格动态刷新的方法详解
2017/03/17 Javascript
详解Angular 自定义结构指令
2017/06/21 Javascript
js实现手机web图片左右滑动效果
2017/12/29 Javascript
axios发送post请求springMVC接收不到参数的解决方法
2018/03/05 Javascript
JS实现导出Excel的五种方法详解【附源码下载】
2018/03/15 Javascript
命令行批量截图Node脚本示例代码
2019/01/25 Javascript
性能优化篇之Webpack构建速度优化的建议
2019/04/03 Javascript
基于JS实现一个随机生成验证码功能
2019/05/29 Javascript
JS实现继承的几种常用方式示例
2019/06/22 Javascript
vue-cli 为项目设置别名的方法
2019/10/15 Javascript
基于javascript实现日历功能原理及代码实例
2020/05/07 Javascript
[01:11]回顾历届DOTA2国际邀请赛中国区预选赛
2017/06/26 DOTA
wxPython之解决闪烁的问题
2018/01/15 Python
Python爬虫框架Scrapy实例代码
2018/03/04 Python
python获取url的返回信息方法
2018/12/17 Python
python实现跨excel sheet复制代码实例
2020/03/03 Python
python音频处理的示例详解
2020/12/23 Python
详解Python爬虫爬取博客园问题列表所有的问题
2021/01/18 Python
林清轩官方网站:山茶花润肤油开创者
2016/10/26 全球购物
关于读书的演讲稿600字
2014/08/27 职场文书
如何设置多台电脑共享打印机?多台电脑共享打印机的方法
2022/04/08 数码科技