依据昨天的写完,在token过期之后,再次调用接口,会触发后端拦截,扔进全局错误处理中间件
前端说明提示都没有,只有一个这个,现在优化一下,再写一个类似全局后置守卫,当状态码是401的时候,重新登录,可是原生没有相应拦截器,昨天找的路由守卫也只能告诉to,from。翻看官方文档,发现statuscode可以由uni.request成功回调的statuscode获取,意思就是对昨天封装的uni.request加一条statuscode判断以及重定向就行
改了半天还是不会失败自动跳转,我以为响应拦截器写错了,于是升级了一下,可还是失败
import config from "./config.js"
const request = (options) => {
return new Promise((resolve, reject) => {
let token = uni.getStorageSync('token')
uni.request({
url: config.baseUrl + options.url,
method: options.method || 'GET',
header: options.header || {
authorization: token,
},
data: options.data || {},
success: (res) => {
const data = res
if (res.statusCode !== 200) {
console.log(res.statusCode)
handleStatus(res) //处理状态码
return
}
resolve(data)
},
fail: (error) => {
uni.showToast({
icon: 'error',
title: '系统错误'
})
reject(error)
},
complete: (res) => {
}
})
})
}
const handleStatus = (res) => {
switch (res.statusCode) {
// 401: 未登录
// 未登录则跳转登录页面,并携带当前页面的路径
// 在登录成功后返回当前页面,这一步需要在登录页操作。
case 401:
uni.navigateTo({
url: "/pages/login/login",
})
uni.showToast({
icon: 'error',
title: '未登录'
})
return
break;
// 403 token过期
// 登录过期对用户进行提示
// 清除本地token和清空vuex中token对象
// 跳转登录页面
case 403:
uni.navigateTo({
url: "/pages/login/login",
fail:function()
{
console.log('fail')
}
})
uni.showToast({
icon: 'error',
title: '登录过期'
})
uni.removeStorageSync("token")
break;
// 404请求不存在
case 404:
break;
// 其他错误,直接抛出错误提示
default:
}
}
export function get(option) {
return new Promise((resolve, reject) => {
request({
...option,
method:'GET'
}).then(res => {
resolve(res);
}).catch(err => {
reject(err)
})
});
}
export function post(option) {
return new Promise((resolve, reject) => {
request({
...option,
method: 'POST',
})
.then(res => {
resolve(res);
})
.catch(err => {
reject(err)
})
});
}
明明控制台都打印了,可是就是不跳转,页面跳转始终失败
打印错误原因
当前页面正在处于跳转状态,请稍后再进行跳转....
....返回未登录时,需要跳转到登录授权页,此时就会出现以上报错信息,使用微信API就不会报错了
可以说困扰一天了。。。
wx.redirectTo({
url: "/pages/login/login",
})