微信小程序获取手机号授权用户登录功能


Posted in Javascript onNovember 09, 2017

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

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

<span style="font-size:14px;"><button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"></button></span>

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: 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')

总结

以上所述是小编给大家介绍的微信小程序获取手机号授权用户登录功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Jquery Ajax学习实例6 向WebService发出请求,返回DataSet(XML) 异步调用
Mar 18 Javascript
JS验证日期的格式YYYY-mm-dd 具体实现
Jun 29 Javascript
关于JavaScript的变量的数据类型的判断方法
Aug 14 Javascript
详解JavaScript的AngularJS框架中的表达式与指令
Mar 05 Javascript
js实现可键盘控制的简单抽奖程序
Jul 13 Javascript
JavaScript的数据类型转换原则(干货)
Mar 15 Javascript
DatePickerDialog 自定义样式及使用全解
Jul 09 Javascript
解决layui laydate 时间控件一闪而过的问题
Sep 28 Javascript
Vuex,iView UI面包屑导航使用扩展详解
Nov 04 Javascript
如何配置vue.config.js 处理static文件夹下的静态文件
Jun 19 Javascript
javascript实现前端成语点击验证优化
Jun 24 Javascript
vue实现省市区联动 element-china-area-data插件
Apr 22 Vue.js
jQuery.Sumoselect插件实现下拉复选框效果
Nov 09 #jQuery
webpack中CommonsChunkPlugin详细教程(小结)
Nov 09 #Javascript
详解用webpack的CommonsChunkPlugin提取公共代码的3种方式
Nov 09 #Javascript
Angularjs渲染的 using 指令的星级评分系统示例
Nov 09 #Javascript
jQuery实现动态添加节点与遍历节点功能示例
Nov 09 #jQuery
简单实现jquery隔行变色
Nov 09 #jQuery
基于Datatables跳转到指定页的简单实例
Nov 09 #Javascript
You might like
Cappuccino 卡布其诺咖啡之制作
2021/03/03 冲泡冲煮
上传多个文件的PHP脚本
2006/11/26 PHP
php Notice: Undefined index 错误提示解决方法
2010/08/29 PHP
php curl模拟post请求和提交多维数组的示例代码
2015/11/19 PHP
使用PHP开发留言板功能
2019/11/19 PHP
javascript 面向对象继承
2009/11/26 Javascript
浅谈javascript的调试
2015/01/28 Javascript
简介JavaScript中的push()方法的使用
2015/06/09 Javascript
js+HTML5基于过滤器从摄像头中捕获视频的方法
2015/06/16 Javascript
JS for循环中i++ 和 ++i的区别介绍
2016/07/20 Javascript
Javascript 实现简单计算器实例代码
2016/10/23 Javascript
JavaScript数据结构之二叉树的删除算法示例
2017/04/13 Javascript
bootstrap confirmation按钮提示组件使用详解
2017/08/22 Javascript
详解微信小程序之scroll-view的flex布局问题
2019/01/16 Javascript
JS+canvas画布实现炫酷的旋转星空效果示例
2019/02/13 Javascript
vue.js多页面开发环境搭建过程
2019/04/24 Javascript
微信小程序跳转到其他网页(外部链接)的实现方法
2019/09/20 Javascript
nuxt 路由、过渡特效、中间件的实现代码
2020/11/06 Javascript
[45:44]完美世界DOTA2联赛PWL S2 FTD vs PXG 第一场 11.27
2020/12/01 DOTA
python操作xml文件详细介绍
2014/06/09 Python
Python实现拼接多张图片的方法
2014/12/01 Python
Python贪吃蛇游戏编写代码
2020/10/26 Python
Tensorflow实现AlexNet卷积神经网络及运算时间评测
2018/05/24 Python
Python3之字节串bytes与字节数组bytearray的使用详解
2019/08/27 Python
keras 读取多标签图像数据方式
2020/06/12 Python
python中pyplot基础图标函数整理
2020/11/10 Python
Django自带的用户验证系统实现
2020/12/18 Python
HTML5中的Web Notification桌面通知功能的实现方法
2019/07/29 HTML / CSS
化妆品店促销方案
2014/02/24 职场文书
吃空饷专项治理工作实施方案
2014/03/04 职场文书
国际贸易毕业生自荐书
2014/06/22 职场文书
第28个世界无烟日活动总结
2015/02/10 职场文书
python基于scrapy爬取京东笔记本电脑数据并进行简单处理和分析
2021/04/14 Python
分位数回归模型quantile regeression应用详解及示例教程
2021/11/02 Python
win11无法登录onedrive错误代码0x8004def7怎么办 ?
2022/04/05 数码科技
MySQL数据库查询进阶之多表查询详解
2022/04/08 MySQL