微信小程序授权登录

目录

 

 

自定义授权页面

 

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

 

<!--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( '用户点击了“返回授权”');

}

}

});

}

},

转载于:https://www.cnblogs.com/lingXie/p/10518375.html