微信小程序登录验证和获取授权信息
1.在app,js中设置
官方链接
授权 ：
https://developers.weixin.qq.com/miniprogram/dev/api/authorize.html
获取用户信息 ：https://developers.weixin.qq.com/miniprogram/dev/api/open.html#wxgetuserinfoobject
App({
onLaunch() {
// 登录
wx.login({
success: res => {
console.log(res);
// 发送 res.code 到后台换取 openId, sessionKey, unionId
}
})
// 获取用户信息
wx.getSetting({
success: res => {
//判断是否授权，如果授权成功
if (res.authSetting['scope.userInfo']) {
//获取用户信息
wx.getUserInfo({
success: res => {
console.log(res);
this.globalData.userInfo = res.userInfo
//网络延迟，回调函数
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
}
})
} else {
var that = this;
//如果授权不成功,进行授权
wx.authorize({
scope: 'scope.userInfo',
success(res) {
//获取用户信息
wx.getUserInfo({
success: res => {
console.log(res);
that.globalData.userInfo = res.userInfo
if (that.userInfoReadyCallback) {
that.userInfoReadyCallback(res)
}
}
})
}
})
}
}
})
},
globalData: {
userInfo: null
}
})
2.在pages里面的页面。pages.js中设置
data: {
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
if (app.globalData.userInfo) {
this.setData({
updateUserImgUrl: app.globalData.userInfo.avatarUrl,
updateUserName: app.globalData.userInfo.nickName
})
} else if (this.data.canIUse) {
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {
this.setData({
updateUserImgUrl: app.globalData.userInfo.avatarUrl,
updateUserName: app.globalData.userInfo.nickName
})
}
} else {
// 在没有 open-type=getUserInfo 版本的兼容处理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
updateUserImgUrl: app.globalData.userInfo.avatarUrl,
updateUserName: app.globalData.userInfo.nickName
})
}
})
}
3.最后在页面里面渲染就OK了
网友评论