微信小程序授权登录

目录

自定义授权页面

点击授权登录后出现微信自带的授权登录弹窗

<!--index.wxml-->

<!-- 授权界面 -->

<cover-view class='auth_wrap' wx:if="{{hasUserInfo && canIUse}}">

<cover-view class='con'>

<cover-image class='logo' mode="widthFix" src='../../assets/mrys_logo.png'>

</cover-image>

<cover-view class='txt'>XXXXXX小程序申请一下权限：</cover-view>

<cover-view class='txt'>获取你的公开信息（头像和昵称等）</cover-view>

<button class='btn' type='primary' open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 授权登录 </button>

</cover-view>

</cover-view>

//app.js

App({

onLaunch: function () {

},

globalData: {

'hasUserInfo':false,

'code': null,

'userInfo': null

}

})

//index.js

const app = getApp();

Page({

data: {

userInfo: {},

hasUserInfo: false,//未授权不显示

canIUse: wx.canIUse('button.open-type.getUserInfo')//判断小程序的API，回调，参数，组件等是否在当前版本可用。

},

onLoad: function () {

var self=this;

// 获取用户信息

wx.getSetting({

success: res => {

if (res.authSetting['scope.userInfo']) {

wx.getUserInfo({

success: res => {

// 可以将 res 发送给后台解码出 unionId

app.globalData.userInfo = res.userInfo

// console.log(app.globalData.userInfo);

// 登录

wx.login({

success: res => {

// 发送 res.code 到后台换取 openId, sessionKey, unionId

getApp().globalData.code = res.code;

console.log(getApp().globalData.code);

wx.request({

url: 'https:xxxxxxxxxxxxxxxxxxxxxx',

data: {

'code': getApp().globalData.code,

},

method: 'POST',

success: function (res) {

console.log(res);

getApp().globalData.uid = res.data.data.uid;

console.log('uid====',getApp().globalData.uid);

}

})

 

}

})

}

})

} else {

// 用户没有授权

// 改变 hasUserInfo 的值，显示授权页面

self.setData({

hasUserInfo:true

});

}

}

})

},

getUserInfo: function (e) {

if (e.detail.userInfo) {

console.log(e.detail.userInfo);

//用户按了允许授权按钮

var self = this;

//授权成功后,通过改变 hasUserInfo 的值，让实现页面显示出来，把授权页面隐藏起来

self.setData({

userInfo: e.detail.userInfo,

hasUserInfo: false

});

 

} else {

//用户按了拒绝按钮

wx.showModal({

title: '警告',

content: '您点击了拒绝授权，将无法进入小程序，请授权之后再进入!!!',

showCancel: false,

confirmText: '返回授权',

success: function (res) {

// 用户没有授权成功，不需要改变 isHide 的值

if (res.confirm) {

console.log('用户点击了“返回授权”');

}

}

});

}

},