小程序异步请求token解决办法
小程序一般需要用token,去识别用户身份,每次获取到token之后,再进行下一步操作。再获取到token之后,将token同步缓存
app.js:
login: function () {
var that = this;
return new Promise(function (resolve, reject) {
if (wx.getStorageSync('token')) {
resolve(wx.getStorageSync('token'))
} else {
wx.login({
success: function (res) {
if (res.code) {
wx.request({
url: that.baseUrl + 'tt/wx/' + res.code,
header: {
'content-type': 'application/json',
'cld.stats.page_entry': that.globalData.scene,
'version': that.globalData.version
},
method: 'GET',
success: function (e) {
if (e.statusCode == 200) {
that.globalData.token = e.data.token;
wx.setStorageSync('token', e.data.token);
resolve(e.data.token)
}
},
fail: () => {
}
})
} else {
console.log('登录失败!' + res.errMsg)
}
}
});
}
})
},
在调用login方法的时候先判断本地有没有缓存的token,如果有直接返回,没有的话再从后台通过接口获取,获取之后token之后同步缓存。
在首页index.js,页面onload的时候需要加载新闻列表,因为小程序所有请求都是异步加载,直接从缓存取token,有可能取不到,这样可以再index.js里面这样写,具体的封装请求方法,在我的另一篇博客里面有方法,这里不多做叙述。
app.login().then(() => {
api.request(api.Url.newsList, 'POST', {
type: 1,
page:1
}).then(res => {
console.log('success:', res)
}).catch(res => {
console.log("fail:", res)
}).finallly(()=>{
console.log("finallly:", 结束)
})
});
这样的话就会避免取不到token的情况,之所以在login方法先判断是否存在token缓存,一是避免不必要的请求,二是避免重复请求