wx.getUserInfo 接口調整說明。
在 wx.getUserInfo 接口調整之前，用戶首次進入小程序時，會通過調起用戶授權的彈窗方式來建議用戶授權，但是根據微信小程序最近更新的通知解釋，開發工具、體驗版本將不再支持這個授權方式，而是通過button組件讓用戶自主去點擊已完成授權的目的，因此對開發者來說需要做出一定的代碼調整工作。
那我們怎麼以最小的代價，來完成授權邏輯的升級呢？
根據官方文檔給出我的解決方案，可以嘗試設置一個用戶授權登錄的過渡頁面，用戶首次進入小程序時，在首頁js中設置跳轉到登錄授權的過渡頁。
一、index.js中的修改部分
var app = getApp();
Page({
onLoad: function(t) {
var e = this;
app.ready(); //調用app.js中的ready方法
});
});
二、app.js中修改部分
注意： app.js 中的 toIndex() 方法是跳轉到首頁，這裡我使用的跳轉方式是 wx.switchTab()，因為首頁是一個標籤頁，使用 wx.navigateTo({ url : }) 或 wx.redirectTo({ url: }) 等跳轉方式可能會不起作用，所以對標籤頁的跳轉建議使用 wx.switchTab() 方式。
App({
onLaunch: function() {},
onShow: function() {},
……
globalData: {
userInfo: null
},
toIndex: function () {
// 前往首頁界面
wx.switchTab({
url: '/pages/index/index'
});
},
toLogin: function () {
wx.navigateTo({
url: '/pages/login/login'
});
},
ready: function () {
let promise = new Promise((resolve, reject) => {
const userkey = wx.getStorageSync('userkey');
const userId = wx.getStorageSync('userId');
const sessionData = wx.getStorageSync('sessionData');
// 檢查用戶是否具有登錄狀態
if (!userkey || !userId || !sessionData) {
// 如果未登錄就前往登錄界面
this.toLogin();
} else {
// 如果有就只要更改一下Promise，以繼續執行後續操作
resolve();
}
})
return promise;
},
getUserInfo: function (cb, failcb) {
var that = this;
if (this.globalData.userInfo) {
//已有登錄信息
typeof cb == "function" && cb(this.globalData);
console.log('已有登錄信息');
} else {
//無登錄信息，請求獲取用戶信息
wx.getUserInfo({
success: function (res) {
wx.login({
success: function (res1) {
var code = res1.code;
console.log(res1);
that.globalData.userInfo = res.userInfo;
console.log('用戶信息', that.globalData.userInfo);
that.login(code, res, cb);
}
})
}, fail: function (res) {
typeof failcb == "function" && failcb(res);
console.log('未授權', res);
}
})
}
},
login: function(code, res, cb){
if(code && res){
typeof cb == "function" && cb(res);
}
}
});
三、加入一個登錄授權的過渡頁：pages/login
在小程序項目文件的 pages/ 目錄下新建一個 login/ 目錄，login目錄中各部分代碼如下：
login.wxss部分:
.loading_tip{
position: fixed;
height: 100%;
width: 100%;
display:flex;
flex-direction:column;
align-items:center;
justify-content: center;
font-size: 1rem
}
login.wxml部分:
<view>
<view>
<view>
<view>
<view>啟動中/<view>
<view>
<view>
<view>Copyright © 2018/<view>
login.js部分:
var app = getApp();
Page({
data: {
loading: true
},
onLoad: function () {
var that = this;
app.getUserInfo(function () {
app.toIndex(); //加載成功
}, function () {
that.setData({ loading: false }); //加載失敗
});
},
login: function (e) {
app.globalData.userInfo = e.detail.userInfo;
console.log('用戶信息', app.globalData.userInfo);
wx.login({
success: function (res) {
var code = res.code;
app.login(code, e.detail, function () {
app.toIndex();
});
}
})
}
});
四、效果截圖
授權登錄使用一個button按鈕引導用戶自主授權。
跳轉回到首頁。
五、延伸擴展
如果用戶恰好在某個頁面登錄態失效時，統一讓其跳轉到登錄授權過渡頁，點擊授權登錄成功，返回到之前的頁面。
這是一套基於we7框架的同城微圈小程序，如果大家想要這套源碼（含完整的小程序前端+we7框架+後臺管理插件），或者對小程序 getUserInfo 接口調整後，原有項目中做邏輯修改還有什麼問題，可以關注後私信我【同城微圈】關鍵字，將為您解答。
閱讀更多 班馬文章BMWZ 的文章
