微信小程序登錄驗證和獲取授權信息
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了
