vue项目中,axios如何捕捉http状态码为401错误
项目开发中,需要判断一下token是否有效,如果是一个无效的token,那么后台后返给我http状态码为401的错误,注意这里是http状态码,也就说只有是2xx系列的才算是请求成功,所以返回的401,此时浏览器肯定时报错的,如果你正常的逻辑去拿包,肯定是拿不到的。这种情况下,就要用到axios的响应拦截了在main入口文件下写// 响应拦截axios.interceptors.response.
·
项目开发中,需要判断一下token是否有效,如果是一个无效的token,那么后台后返给我http状态码为401的错误,注意这里是http状态码,也就说只有是2xx系列的才算是请求成功,所以返回的401,此时浏览器肯定时报错的,如果你正常的逻辑去拿包,肯定是拿不到的。
这种情况下,就要用到axios的响应拦截了
在main入口文件下写
// 响应拦截
axios.interceptors.response.use(function (response) {
// 这个是处理响应成功的结果,也就是说响应状态码为2XX系列的
NProgress.done() // 这个忽略,只是一个响应的进度条
return response;
},function (error) {
// 这个是处理响应失败的,也就是响应错误的,在这个箭头函数中,才能拿到401状态下的包
NProgress.done()
if (error.response.status === 401) {
// 接口的根地址截取下来,判断
const url = error.response.config.url
const flag = url.substring(0,url.indexOf('/'))
// 判断地址是哪一个页面的,push到相应的错误页面
if(flag == 'roster'){
router.push({
path:'/rosterError',
query:{
info: error.response.data.message
}
})
}
if(flag == 'user'){
router.push({
path:'/AllUserinfoEerror',
query:{
info: error.response.data.message
}
})
}
}
return Promise.reject(error);
});
更多推荐
已为社区贡献9条内容
所有评论(0)