app登陆状态判断可能会是token检测的方式,所以用uni.setStorageSync的api将后端传来的token赋值在浏览器缓存里,电脑端查看方式:F12->Application->Local Storage
新建一个文件,命名为xxx.js
// 公共的请求
import HttpRequest from './HttpRequest.js' //这是自己封装的ajax函数
const request = function(options) {
try {
const token = uni.getStorageSync('token');//获取缓存里的token
const refreshToken = uni.getStorageSync('refreshtoken');//获取缓存里的refreshtoken
const time = uni.getStorageSync('time');//获取赋值token时的时间
if(token){//有token,则判断token是否过期,如果无token,则直接去登陆。
if (check(time)=='overdue') {//触发check()函数,判断token是否过期————过期,token重新刷新
var SendData={
access_token: token,
refresh_token : refreshToken
}//发送的函数
HttpRequest.PostDataByUni(SendData, 'api/login/refresh', {})//可以使用uni.request(options)api
.then((res) => {//如果请求成功,触发,res是请求后的返回的参数
if (res.data.code == 200) {//每一个if都是根据后端返回值来判断的,这个时候已经可以作为ajax成功了。
uni.setStorage({
key: 'token',
data: res.data.data.access_token
})
uni.setStorage({
key: 'refreshtoken',
data: res.data.data.refresh_token
})
if(res.header.Date){//这一级的if是后端老哥返回的Date可能是大写又可能是小写的。
uni.setStorage({
key: 'time',
data: res.header.Date
})
}
else if(res.header.date){
uni.setStorage({
key: 'time',
data: res.header.date
})
}
uni.reLaunch({
url: '../main/main',
});
return ;
} else if (res.data.code == 500) {//如果是500的话说明是后端的问题
uni.showToast({
icon:'none',
title: res.data.msg,
duration: 2000
})
uni.reLaunch({
url: '/pages/login/login',
});
return ;
}
}).catch((res) => {
console.log(res)
});
return ;
}else{//判断token未过期,直接结束
return ;
}
}else{//没token,直接去登陆
uni.navigateTo({
url: '/pages/login/login'
});
return;
}
} catch (err) {
console.log(err)
console.log("request出错")
return;
}
//解决toolbars不能转换的问题 这个必须加,不然会报错.
if (options.url=="/pages/main/main"||options.url=="/pages/locate/locate"||options.url=="/pages/user/user")
return uni.switchTab(options)
return uni.redirectTo(options);
}
function check(time) {//判断时间是否过期的函数。
var time1 = new Date(time)
var date2=new Date();
console.log(time)
return date2.getTime()-time1.getTime()-(1000*60*60)<0?'unoverdue':'overdue';
}
export default request;
使用方法:
在每个需要用到token刷新的页面,引用xxx.js。在周期函数onReady中加如下代码
onReady:function(){
request({
url:"record",//url是本页面的名字,比如本页面如果叫record.vue
method:'get',//固定为get
success: function (res) { }//这个可忽略
})
},
参数url:如果这个封装函数用在toolbars的页面的话,就把url参数写成绝对路径。如果不是只写去掉后缀的文件名就可以。