微信小程序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 相关文章推荐
如何用js控制css中的float的代码
Aug 16 Javascript
jQuery.position()方法获取不到值的安全替换方法
Mar 13 Javascript
jQuery实现form表单元素序列化为json对象的方法
Dec 09 Javascript
全面理解闭包机制
Jul 11 Javascript
js中scrollTop()方法和scroll()方法用法示例
Oct 03 Javascript
微信小程序实战之运维小项目
Jan 17 Javascript
简单实现js上传文件功能
Aug 21 Javascript
JavaScript引用类型RegExp基本用法详解
Aug 09 Javascript
使用vscode快速建立vue模板过程详解
Oct 10 Javascript
解决vue v-for src 图片路径问题 404
Nov 12 Javascript
uniapp实现可滑动选项卡
Oct 21 Javascript
用vite搭建vue3应用的实现方法
Feb 22 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文件包含目录配置open_basedir的使用与性能详解
2017/04/03 PHP
用 JSON 处理缓存
2007/04/27 Javascript
JQuery 学习笔记 选择器之三
2009/07/23 Javascript
js parsefloat parseint 转换函数
2010/01/21 Javascript
JavaScript Event学习第六章 事件的访问
2010/02/07 Javascript
基于jquery的下拉框改变动态添加和删除表格实现代码
2020/09/12 Javascript
tangram框架响应式加载图片方法
2013/11/21 Javascript
jquery制作弹窗提示窗口代码分享
2014/03/02 Javascript
js跨域请求数据的3种常用的方法
2015/12/01 Javascript
阿里云ecs服务器中安装部署node.js的步骤
2016/10/08 Javascript
详解在vue-cli项目中使用mockjs(请求数据删除数据)
2017/10/23 Javascript
node.js基于fs模块对系统文件及目录进行读写操作的方法详解
2017/11/10 Javascript
[02:44]2014DOTA2 国际邀请赛中国区预选赛 大神红毯秀
2014/05/25 DOTA
[05:16]《大圣!大圣》——DOTA2新英雄齐天大圣配音李世宏老师专访
2016/12/13 DOTA
利用python编写一个图片主色转换的脚本
2017/12/07 Python
Python如何实现转换URL详解
2019/07/02 Python
python正则表达式匹配不包含某几个字符的字符串方法
2019/07/23 Python
python 消除 futureWarning问题的解决
2019/12/25 Python
python requests包的request()函数中的参数-params和data的区别介绍
2020/05/05 Python
解决tensorflow 释放图,删除变量问题
2020/06/23 Python
CSS3教程(6):创建网站多列
2009/04/02 HTML / CSS
使用css3背景渐变中的透明度来设置不同颜色的背景渐变
2014/03/31 HTML / CSS
使用html5 canvas绘制圆环动效
2019/06/03 HTML / CSS
iPhoneX安全区域(Safe Area)底部小黑条在微信小程序和H5的屏幕适配
2020/04/08 HTML / CSS
Pam & Gela官网:美国性感前卫女装品牌
2018/07/19 全球购物
如何写一封打动人心的求职信
2014/02/17 职场文书
家长建议怎么写
2014/05/15 职场文书
教师求职自荐书
2014/06/14 职场文书
学雷锋标语
2014/06/25 职场文书
2015年医院工作总结范文
2015/04/09 职场文书
指导老师鉴定意见
2015/06/05 职场文书
消防安全主题班会
2015/08/12 职场文书
文艺部部长竞选稿
2015/11/21 职场文书
2016大学生优秀志愿者事迹材料
2016/02/25 职场文书
2016年优秀共产党员先进事迹材料
2016/02/29 职场文书
MySQL系列之六 用户与授权
2021/07/02 MySQL