谈如何授权登录小程序，获取信息和手机号(如何授权登录微信小程序)

本文将与您分享微信小程序实现授权登录并获取用户信息和手机号码的方法。

相关学习推荐:小程序开发教程

综上所述，增加了获取用户手机号码的功能，该功能使用了获取用户信息和用户手机号码的功能。当我第一次写它时，我发现我在一个登录页面上写了两个按钮。获取手机号的逻辑是用户点击授权时跳转到首页，用户点击拒绝时弹出提示，我最后发现可能是微信的限制。模拟器调试拒绝有提示，真机也能跳。没有办法写一套关于用户进入某个详情页判断手机号授权的问题。！！

1.全球判断

app（{ on launch:function（））{//调用API从本地缓存获取数据//显示本地存储容量var logs = wx . getstoragesync（&；#39;日志& amp#39;）| |【】logs . un shift（date . now（））wx . setstoragesync（& amp；#39;日志& amp#39;日志）that = this//获取用户是否首次在本地输入新版本。Varversions = wx。getStorageSync（&；#39;版本和名称。#39;);console . log（amp；#39;版本:& amp#39;+版本）；//判断是否if（versions = = &；#39;1 & amp#39;）{//已授权，可以直接调用getUserInfo获取头像昵称。无法播放box wx . get userinfo（{ success:function（RES））{ that . global data . userinfo = RES . userinfo console . log（that . global data . userinfo）}，fail:function（）{ wx . redirectto（{ URL:& amp；#39;../吴锐大厦/pages/log in/index & amp；#39;，}）}）}否则{//未授权，跳转到登录页面wx . redirecto（{ URL:&；#39;../吴锐大厦/pages/log in/index & amp；#39;，}）} }，on show:function（）{//console . log（getCurrentPages（））}，on hide:function（）{//console . log（getCurrentPages（））}，on error:function（msg）{//console . log（msg）}，util:require（& amp#39;we7/resource/js/util . js & amp；#39;），tabBar:{ & quot；颜色& quot:& quot# 123 & quot，& quot选定的颜色& quot:& quot# 1ba9ba & quot，& quot边框样式& quot:& quot# 1ba9ba & quot，& quot背景色& quot:& quot# fff & quot，& quot列表& quot:【】}，getLocationInfo:function（CB）{ var that = this；if（this . global data . location info）{ CB（this . global data . location info）} else { wx . get location（{ type:& amp；#39;gcj02 & amp#39;，//默认情况下，wgs84返回gps坐标，gcj02返回可用于wx.openLocation success的坐标:function（RES）{ that . global data . location info = RES；CB（that . global data . location info）}，fail:function（）{//fail }，complete:function（）{//complete } }），globalData: { userInfo: null，appid:& quot；"app secret:& quot；"，}，siteInfo:require（& amp；#39;siteinfo.js & amp#39;)});2 .登录登录页面判断

index.wxml

& ltview wx:if = & quot；{ { isHide } } & quot& gt& ltview wx:if = & quot；{ { canIUse } } & quot& gt& lt视图& gt& ltimage src = & amp#39;../../../we7/resource/images/log in . png & amp；#39;& gt& lt/image & gt；& lt/view & gt；& lt视图& gt& lt文本& gt请依次允许访问您的公共信息和手机号码

。页眉{ margin:90 rpx 0 90 rpx 50 rpx；边框-底部:1px实心# ccctext-align:居中；宽度:650rpx高度:300rpxline -高度:450rpx}.标题图像{ width:200 rpx；高度:200rpx}.内容{ margin -left:50 rpx；margin -bottom:90 rpx；}.内容文本{ display:block；颜色:# 9d9d9dmargin -top:40 rpx；} /* .operBtn { border -radius:80 rpx；边距:70rpx 50rpxfont -大小:35rpx}.operBtns{ background: #eef0ed！重要；边框-半径:80rpx边距:70rpx 50rpxfont -大小:35rpx颜色:#000300！重要；} */.隐藏{ border -radius:80 rpx；边距:70rpx 50rpxfont -大小:35rpx显示:无；}.show { display:block；/*背景:#eef0ed！重要；*/border -radius:80 rpx；边距:70rpx 50rpxfont -大小:35rpx/* color: #000300！重要；*/}（3）index . js

const app = getApp（）；page（{ data:{//判断是否有API、回调、参数、组件等。小程序的当前版本可用。cani use:wx . cani use（& amp；#39;button . open -type . get userinfo & amp；#39;），isHide: false，authorized log in:& amp；#39;授权登录&；#39;，用户电话:#39;手机号码授权&；#39;，李:"，flag: true }，onLoad:function（）{ var that = this；//检查是否授权//获取用户是否第一次进入新版本。var versions = wx . getstoragesync（&；#39;版本和名称。#39;);if（versions = = & amp；#39;1 & amp#39;）{ wx . get setting（{ success:function（RES）{ if（RES . auth setting【& amp；#39;scope.userInfo&amp#39;】）{//调用常用登录方法app . util . get userinfo（function（userinfo）{ that . setdata（{ userinfo:userinfo }）}）；} else {//用户无权//更改isHide的值，并显示授权页面that . setdata（{ isHide:true }）；} } });} else {//用户无权//更改isHide的值，并显示授权页面that . setdata（{ isHide:true }）；}}，bindingetuserinfo:function（e）{ if（e . detail . userinfo）{//用户按下了允许授权按钮var that = thislet user = e . detail . userinfo；//获取用户信息，在控制台上打印并查看console . log（& quot；用户的信息如下:“）；console.log（用户）；//授权成功后，通过更改isHide的值显示实现页面，隐藏授权页面。#39;& amp#39;）{ wx . show toast（{ icon:& quot；无& quot，标题:& amp#39;请继续点击获取手机号码&；#39;，}）、that . setdata（{ isHide:true，flag:（！that.data.flag）、lee:true }）that . wxlogin（）；} else if(！that . data . lee）{ wx . switch tab（{ URL:& quot；/吴锐房子/pages/index/index & quot；}）} } else {//用户按下了拒绝按钮wx . show modal（{ title:&；#39;警告&；#39;，内容:& amp#39;如果单击“拒绝授权”，您将无法进入小程序。请授权后再进入！！！& amp#39;，showCancel: false，confirm text:& amp；#39;退货授权&；#39;，success:function（RES）{//用户未授权成功，无需更改is hide { console . log（&；#39;用户单击了“返回授权”&；#39;);} } });} }，wxlogin:function（）{//获取用户的openID var that = this//调用常用登录方法app . util . get userinfo（function（userinfo）{ that . setdata（{ userinfo:userinfo }）}）；}，获取电话号码:函数（e）{//单击获取电话号码按钮var that = thisthat . data . lee if（that . data . lee = = & amp；#39;& amp#39;）{ wx . show toast（{ icon:& quot；无& quot，标题:& amp#39;请先点击获取用户信息&；#39;，}）return } else { wx . check session（{ success:function（RES）{ console . log（e . detail . errmsg）console . log（e . detail . iv）console . log（e . detail . encrypted data）var ency = e . detail . encrypted data；var iv = e . detail . iv；var session k = that . data . session key；if（e . detail . errmsg = = & amp；#39;用户拒绝失败。#39;）{ wx . show modal（{ title:& amp；#39;警告&；#39;，内容:& amp#39;您点击了拒绝授权，部分功能无法使用！！！& amp#39;，showCancel: false，confirm text:& amp；#39;退货授权&；#39;，success:function（RES）{//用户未授权成功，无需更改isHide的值if（RES . confirm）{ wx . setstoragesync（&；#39;enws & amp#39;，& amp#39;1 & amp#39;);wx . switch tab（{ URL:& quot；/吴锐房子/pages/index/index & quot；}）console . log（& amp；#39;用户单击了“返回授权”&；#39;);};} }）、that . setdata（{ modal status:true，}）；} else { that . setdata（{ lee:false，}）；wx . switch tab（{ URL:& quot；/吴锐房子/pages/index/index & quot；}）//同意授权VaruserInfo = wx。getStorageSync（&；#39;userInfo & amp#39;);app . util . request（{ & amp；#39;url & amp#39;:& amp#39;entry/wxapp/saveusermobile&amp。#39;，data:{ session id:userinfo . session id，uid: userinfo.memberInfo.uid，iv: iv，encrypted data:encrypted }，success:function（RES）{ if（RES . data . data . error = = 0）{ console . log（& amp；#39;成功& amp#39;+RES . data . data）；//用户输入了新版本，可以更新本地数据wx . setstoragesync（&；#39;版本和名称。#39;，& amp#39;1 & amp#39;);wx . setstoragesync（& amp；#39;enws & amp#39;，& amp#39;2 & amp#39;);} else {//用户保存手机号码失败，将继续授权手机号码wx . setstoragesync（&；#39;enws & amp#39;，& amp#39;1 & amp#39;);console . log（amp；#39;失败与失败。#39;+RES . data . data）；} }，fail:function（RES）{ console . log（& amp；#39;失败与失败。#39;+RES）；} });} }，fail:function（）{ console . log（& quot；Session_key已过期，需要重新执行登录过程”）；that . wxlogin（）；//再次登录} }）；} }})2.详情页上手机号码的授权判断。

所使用的掩模层写入方法

①index.html

& lt代码& gt& lt！--授权框提醒--》；& lt视图class = & quot容器&quot& gt& lt视图class = & quot浮动& quot隐藏= & amp#39;{ { viewShowed } } & amp#39;& gt& lt查看class = & amp#39;浮动内容和。#39;& gt& lt文本& gt允许授权获取手机号码

/*手机号码授权*/。浮动{高度:100%；宽度:100%；位置:固定；background -color:rgba（0，0，0，0.5）；z-指数:2；top:0；左:0；}.float content {/* padding:20 rpx 0；*/宽度:80%；背景:# fff利润率:40%自动；边框-半径:20rpx显示器:flexflex -方向:列；justify -内容:space -环绕；align -项目:居中；位置:相对；高度:255rpx}.float content text { color:# 000；font -大小:40rpx显示:块；边距:0自动；位置:绝对；顶部:50rpx/* text -align:center；*//* line -高度:60rpx*/border -radius:30 rpx；}.float text { width:100%；高度:100rpx显示器:flexjustify -内容:flex -启动；位置:绝对；底部:0；}。BTN -cancell { line -height:100 rpx；flex:1；边距:0；填充:0；边框-半径:无；}（3）index . js

Data: {view displayed: true，//控制是否可以显示许可证}，Cancle:function（）{ wx . setstoragesync（&；#39;enws & amp#39;，& amp#39;2 & amp#39;);this . setdata（{ view showed:true }）}，/* *生命周期函数--监控页面显示*/on show:Function（）{ Varenws = wx . getstoragesync（&；#39;enws & amp#39;);console . log（& quot；enws:，+enws）；var that = this如果（enws！= & amp#39;2 & amp#39;）{//判断。setdata（{ view displayed:false，}）console。log（&；#39;判断是否授权&；#39;);} else {}，获取手机号码:function（e）{//单击获取手机号码按钮var that = thiswx . check session（{ success:function（RES）{ console . log（e . detail . errmsg）console . log（e . detail . iv）console . log（e . detail . encrypted data）var ency = e . detail . encrypted data；var iv = e . detail . iv；var session k = that . data . session key；that . setdata（{ view showed:true，}）wx . setstoragesync（& amp；#39;enws & amp#39;，& amp#39;2 & amp#39;);if（e . detail . errmsg = = & amp；#39;用户拒绝失败。#39;）{} else {//同意授权var userinfo = wx . getstoragesync（&；#39;userInfo & amp#39;);app . util . request（{ & amp；#39;url & amp#39;:& amp#39;entry/wxapp/saveusermobile&amp。#39;，data:{ session id:userinfo . session id，uid: userinfo.memberInfo.uid，iv: iv，encrypted data:encrypted }，success:function（RES）{ console . log（& amp；#39;成功& amp#39;+RES）；if（RES . data . data . error = = 0）{ console . log（& amp；#39;成功& amp#39;+RES . data . data）；//用户输入了新版本，可以更新本地数据wx . setstoragesync（&；#39;版本和名称。#39;，& amp#39;1 & amp#39;);} else {//用户保存手机号码失败，下次将继续授权手机号码}}，fail:function（RES）{ console . log（&；#39;失败与失败。#39;+RES）；} });} } });}，更多编程相关知识请访问:编程入门！！

这几篇文章你可能也喜欢：

• 如何授权小程序登录获取信息和手机号(小程序获取手机号授权登录合法吗)

本文由主机参考刊发，转载请注明：谈如何授权登录小程序，获取信息和手机号(如何授权登录微信小程序) https://zhujicankao.com/112999.html