1、安装
npm i axios
2、引入
import axios from 'axios';
3、interceptors代码
//headers加参数
axios.interceptors.request.use(config => {
config.headers.common["Authorization"] = token
return config;
});
//响应拦截器即异常处理
axios.interceptors.response.use((response, config) => {
//请求成功
if (response && response.data.code == 10000 || response.data.code == 1) {
return response
} else {
Message.warning({ message: response.data.message });
return Promise.reject(response);
}
//请求失败
}, err => {
if (err && err.response) {
switch (err.response.status) {
case 401:
Message({
type: "error",
message: err.response.data.Message
});
window.location.href = '/login'
break;
default:
Message({
type: "error",
message: err.response.data.Message
});
}
} else {
Message({
type: "error",
message: '服务器出错,请联系管理员!'
});
}
return Promise.resolve(err.response)
});
以上是编程学习网小编为您介绍的“vue-axios interceptors(拦截器)方法介绍”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vue-axios interceptors(拦截器)方法介绍


猜你喜欢
- 详解angular中通过$location获取路径(参数)的写法 2024-01-16
- safari,opera嵌入iframe页面cookie读取问题解决方法 2024-02-29
- npm install -g @vue/cli报错 2023-10-08
- Lodop打印控件如何去掉试用版字样 2024-12-14
- vue项目接收二进制流展示表格 2023-10-08
- js如何判断不同系统的浏览器类型 2023-12-25
- uni-app设置是否保持常亮状态,离开小程序后设置失效 2023-08-29
- Ajax验证用户名实例代码 2022-12-28
- js刷新框架子页面的七种方法代码 2024-01-17
- vue如何实现移入(mouseenter)移出(mouseleave)效果 2025-01-16