好久没写博客了,今天吐槽一下前端拦截问题。。。
问题复现:账号密码登录又跳到登录页面
首先前后端代码都没改动,前几天还可以正常登录,电脑重启了之后就登录不上去了。
然后后端也是正常返回数据的,就是前端自动跳转登录问题,当时只是怀疑是前端拦截问题。后端也确实看到了信息。我就纳闷了。然后开始打断点一句一句的看返回内容。果然在前端拦截配置代码哪里走不下去了。
然后感觉是后端响应拦截的时候给我返回了100或者1007,其实女生的感觉还真准哈哈哈哈,打印看了一下果然给我返回了1007拦截跳到了登录页面。之后换了火狐浏览器登录却登录成功,原因是本地的谷歌浏览器设置了cookie拦截。
害,找了半天问题原来也不是代码层面问题。吃一堑长一智把!
// axios配置
const service = axios.create({
baseURL,
withCredentials: true,
headers: {
timeZone: tool.getTimezone()
}
});
// 添加请求拦截器
service.interceptors.request.use(config => {
// console.log(config);
return config;
}, error => {
return Promise.reject(error);
})// 添加响应拦截器
service.interceptors.response.use(response => {
// console.log(response);
const res = response.data;
if (res.code !== 0) {
if (res.code === 100 || res.code === 1007) {
window.location.href = 'https://www.it610.com/login.html';
} else if (res.code === 100002 || res.code === 100005 || res.code === 100008) { // 100002=用户名密码错误,100008=绑定医生的邀请码无效
return res;
} else {
message.error(res.msg, 2.5);
}
return Promise.reject(res.msg);
} else {
return res;
}
}, error => {
message.error(error, 2.5);
return Promise.reject(error);
})
【前端拦截登录不成功问题】
文章图片
推荐阅读
- 前端|面试官(谈谈Vue和React的区别())
- react|高德地图的使用及自定义图标
- React|【React Native开发】React Native控件之RefreshControl组件详解(21)
- React|React Native开源项目-嘎嘎商城客户端(持续更新中)
- 工作与生活|2016总结,真正新的里程碑和新起点
- React|【React Native开发】React Native应用设备运行(Running)以及调试(Debugging)(3)
- React|【React Native开发】React Native控件之ListView组件讲解以及最齐全实例(19)
- React|React Native控件之PullToRefreshViewAndroid下拉刷新组件讲解(20)
- React|【React Native开发】React Native控件之Text组件讲解(9)
- react学习之旅|react+antd-mobile之项目构建+基础配置