由于小程序改版之后,用户第一次进入小程序时,小程序并不会主动弹出授权界面。此时我们得需要判断用户是否已经授权。
即,当前app.js的globalData下的userInfo是否能获取到用户的信息。
我们在app.js中可以看到大致如下代码。在此代码的基础上进行修改,下面代码中else部分为用户未授权的情况下执行。若用户未授权,则强制用户跳转到/pages/auth/auth页面,该页面为授权页面。
// 获取用户信息
wx.getSetting({
success: res => {
if (res.authSetting['scope.userInfo']) {
// 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框
wx.getUserInfo({
success: res => {
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo
// 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
}
})
}else{
//未授权,获取用户信息失败,用户拒绝授权
wx.reLaunch({
url: '/pages/auth/auth',
})
}
}
})
},
当用户被强制跳转过此授权页面后。看到页面如下:
此处采用的是colorUI框架。

按钮如下:
<button class='cu-btn bg-green shadow lg block' open-type="getUserInfo" bindgetuserinfo="onGetUserInfo">微信登录</button>
用户点击微信登录后,弹出授权页面。此时,用户有两个选择。1.直接点击授权。2.取消授权。
按钮绑定的事件代码如下:
//用户点击微信授权登录按钮回调函数
onGetUserInfo:function(e){
//第二种。用户点击取消授权的情况
if (e.detail.userInfo == null){//授权失败,取消授权
console.log("授权失败,取消授权");
wx.showModal({
title: '未授权',
content: '为了不影响您的使用,请开启相应的权限哦~',
showCancel: false,
success: res => {
if (res.confirm) {
//点击取消,重新获取授权
wx.openSetting({
success: data => {
console.log(data)
if (data.authSetting["scope.userInfo"] == true){//判断是否授权
//重新获取用户数据
wx.getUserInfo({
success: function (res) {
console.log(res.userInfo);
//授权后将app.js中的userinfo重新赋值。
getApp().globalData.userInfo = res.userInfo;
//页面跳转
wx.reLaunch({
url: "/pages/activitys/activitys"
})
}
})
}
},
fail: function () {
console.info("设置页面失败");
}
});
}
}
});
//第一种。用户点击授权的情况
}else{
console.log(e.detail.userInfo);
//授权后将app.js中的userinfo重新赋值。
getApp().globalData.userInfo = e.detail.userInfo;
//页面跳转
wx.reLaunch({
url:"/pages/activitys/activitys"
})
}
}
,若用户一直不授权,则无法进入小程序,且一直停留在授权页面。直到授权才能正常使用。
标签: 微信小程序
顶一下
(0)
0%
踩一下
(0)
0%