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


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 相关文章推荐
建议大家看下JavaScript重要知识更新
Jul 08 Javascript
js 效率组装字符串 StringBuffer
Dec 23 Javascript
我的Node.js学习之路(四)--单元测试
Jul 06 Javascript
Javascript中的高阶函数介绍
Mar 15 Javascript
javascript实现图片跟随鼠标移动效果的方法
May 13 Javascript
基于javascript数组实现图片轮播
May 02 Javascript
JS解决iframe之间通信和自适应高度的问题
Aug 24 Javascript
Bootstrap CSS组件之大屏幕展播
Dec 17 Javascript
node.js学习之断言assert的使用示例
Sep 28 Javascript
修改npm全局安装模式的路径方法
May 15 Javascript
Vue和React组件之间的传值方式详解
Jan 31 Javascript
用JS写一个发布订阅模式
Nov 07 Javascript
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
PHP批量采集下载美女图片的实现代码
2013/06/03 PHP
Codeigniter注册登录代码示例
2014/06/12 PHP
php json_encode()函数返回json数据实例代码
2014/10/10 PHP
PHP生成不重复标识符的方法
2014/11/21 PHP
smarty内置函数section的用法
2015/01/22 PHP
php数组键值用法实例分析
2015/02/27 PHP
php实现无限级分类查询(递归、非递归)
2016/03/10 PHP
php使用GD2绘制几何图形示例
2017/02/15 PHP
页面版文本框智能提示JS代码
2009/11/20 Javascript
Jquery网页出现的乱码问题的三种解决方法
2013/06/30 Javascript
5个书写JavaScript代码的坏习惯,看看你中枪了没?
2014/11/06 Javascript
html的DOM中document对象anchors集合用法实例
2015/01/21 Javascript
JavaScript常用脚本汇总(二)
2015/03/04 Javascript
javascript动态设置样式style实例分析
2015/05/13 Javascript
深入浅析JS的数组遍历方法(推荐)
2016/06/15 Javascript
Web打印解决方案之证件套打的实现思路
2016/08/29 Javascript
Ztree新增角色和编辑角色回显问题的解决
2016/10/25 Javascript
vue生成随机验证码的示例代码
2017/09/29 Javascript
原生JavaScript实现todolist功能
2018/03/02 Javascript
详解vue项目中使用token的身份验证的简单实践
2019/03/08 Javascript
ES6入门教程之let、const的使用方法
2019/04/13 Javascript
Vue之beforeEach非登录不能访问的实现(代码亲测)
2019/07/18 Javascript
微信小程序视频弹幕发送功能的实现
2020/12/28 Javascript
python用BeautifulSoup库简单爬虫实例分析
2018/07/30 Python
Python实现购物评论文本情感分析操作【基于中文文本挖掘库snownlp】
2018/08/07 Python
详解django使用include无法跳转的解决方法
2020/03/19 Python
html5指南-3.如何实现html元素拖拽功能
2013/01/07 HTML / CSS
Luxplus荷兰:以会员价购买美容产品等,独家优惠
2019/08/30 全球购物
铅球加油稿100字
2014/09/26 职场文书
婚礼伴郎致辞
2015/07/28 职场文书
2016年秋季运动会广播稿
2015/12/21 职场文书
2016猴年开门红标语口号
2015/12/26 职场文书
浅谈golang 中time.After释放的问题
2021/05/05 Golang
MySQL5.7并行复制原理及实现
2021/06/03 MySQL
简单总结SpringMVC拦截器的使用方法
2021/06/28 Java/Android
CentOS7安装MySQL8的超级详细教程(无坑!)
2022/06/10 Servers