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


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实现画板的代码
Sep 05 Javascript
项目实践之javascript技巧
Dec 06 Javascript
IE JS无提示关闭窗口不提示的方法
Apr 29 Javascript
ExtJS4 表格的嵌套 rowExpander应用
May 02 Javascript
Javascript基础教程之函数对象和属性
Jan 18 Javascript
jQuery背景插件backstretch使用指南
Apr 21 Javascript
jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享
Aug 20 Javascript
详解Vue中使用v-for语句抛出错误的解决方案
May 04 Javascript
JS写XSS cookie stealer来窃取密码的步骤详解
Nov 20 Javascript
Vuex 入门教程
Jan 10 Javascript
laravel5.3 vue 实现收藏夹功能实例详解
Jan 21 Javascript
vue 使用post/get 下载导出文件操作
Aug 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递归法读取目录及文件的方法
2015/01/30 PHP
php导入模块文件分享
2015/03/17 PHP
php成功操作redis cluster集群的实例教程
2019/01/13 PHP
jQuery.validate 常用方法及需要注意的问题
2013/03/20 Javascript
判断滚动条到底部的JS代码
2013/11/04 Javascript
js正则表达exec与match的区别说明
2014/01/29 Javascript
jQuery点缩略图弹出层显示大图片
2015/02/13 Javascript
jQuery控制cookie过期时间的方法
2015/04/07 Javascript
jQuery绑定事件的几种实现方式
2016/05/09 Javascript
jquery实现界面无刷新加载登陆注册
2016/07/30 Javascript
把多个JavaScript函数绑定到onload事件处理函数上的方法
2016/09/04 Javascript
js转html实体的方法
2016/09/27 Javascript
使用bootstrap插件实现模态框效果
2017/05/10 Javascript
JavaScript使用atan2来绘制箭头和曲线的实例
2017/09/14 Javascript
JS判断数组那点事
2017/10/10 Javascript
JS typeof fn === 'function' &amp;&amp; fn()详解
2020/08/22 Javascript
创建与框架无关的JavaScript插件
2020/12/01 Javascript
vue+elementUI动态增加表单项并添加验证的代码详解
2020/12/17 Vue.js
[02:23]1个至宝=115个英雄特效 最“绿”至宝拉比克“魔导师密钥”登场
2018/12/29 DOTA
python使用arcpy.mapping模块批量出图
2017/03/06 Python
mac下给python3安装requests库和scrapy库的实例
2018/06/13 Python
python实现图片筛选程序
2018/10/24 Python
python3.7简单的爬虫实例详解
2019/07/08 Python
Python中输入和输出(打印)数据实例方法
2019/10/13 Python
Python IDE环境之 新版Pycharm安装详细教程
2020/03/05 Python
Python3爬虫关于识别检验滑动验证码的实例
2020/07/30 Python
python 简单的调用有道翻译
2020/11/25 Python
瑞典在互联网上最大的宠物商店:Animail
2020/10/31 全球购物
机械工程师求职自我评价
2013/09/23 职场文书
护士自我鉴定怎么写
2014/02/07 职场文书
建筑工地门卫岗位职责
2014/04/30 职场文书
项目申报专员岗位职责
2014/07/09 职场文书
销售经理岗位职责
2015/01/31 职场文书
详细聊聊浏览器是如何看闭包的
2021/11/11 Javascript
基于Python实现流星雨效果的绘制
2022/03/18 Python
Python中文分词库jieba(结巴分词)详细使用介绍
2022/04/07 Python