谈一谈axios的拦截器有哪些?你的项目里设置了什么?
时间: 2023-09-03 07:26:48 浏览: 60
### 回答1:
axios拦截器主要有以下几种:
1. 请求拦截器(request interceptor):在请求被发送出去之前,对请求进行拦截和处理,例如在请求头中添加token等。
2. 响应拦截器(response interceptor):在接收到响应后,对响应进行拦截和处理,例如对错误码进行统一处理等。
3. 请求错误拦截器(request error interceptor):在请求出错时进行拦截和处理,例如请求超时时进行重试等。
4. 响应错误拦截器(response error interceptor):在响应出错时进行拦截和处理,例如请求被拒绝时进行重试等。
我在项目中一般会设置请求拦截器和响应拦截器,用于在请求头中添加token,以及对响应中的错误码进行统一处理。代码示例如下:
```javascript
import axios from 'axios';
// 创建axios实例
const service = axios.create({
baseURL: process.env.BASE_API, // api的base_url
timeout: 5000, // 请求超时时间
});
// 请求拦截器
service.interceptors.request.use(
config => {
// 在请求头中添加token
if (localStorage.token) {
config.headers.Authorization = 'Bearer ' + localStorage.token;
}
return config;
},
error => {
console.log(error); // for debug
Promise.reject(error);
}
);
// 响应拦截器
service.interceptors.response.use(
response => {
const res = response.data;
if (res.code !== 200) {
// 对错误码进行统一处理
console.log(res.msg);
} else {
return res;
}
},
error => {
console.log('err' + error); // for debug
return Promise.reject(error);
}
);
export default service;
```
### 回答2:
Axios拦截器是用于在请求和响应期间进行拦截和处理的中间件。拦截器可以用于在发送请求或获取响应时进行统一的处理和转换。
Axios提供了两种类型的拦截器:请求拦截器和响应拦截器。
请求拦截器用于在请求发送之前进行处理。可以用于添加请求头、验证用户登录状态、添加loading状态等。通过`axios.interceptors.request.use()`方法可以添加请求拦截器。
响应拦截器用于在请求响应后进行处理。可以用于统一处理错误、根据响应状态码进行特定操作、从响应中获取数据等。通过`axios.interceptors.response.use()`方法可以添加响应拦截器。
在我的项目中,我设置了一个请求拦截器和一个响应拦截器。在请求拦截器中,我在每个请求中添加了一个认证头,用于验证用户身份和权限。在响应拦截器中,我对响应进行了统一的错误处理,例如显示错误消息,重定向到错误页面等。我还在响应拦截器中对响应数据进行一些处理,例如解析数据结构、提取需要的数据等。
通过使用Axios的拦截器,我能够在整个项目中实现统一的请求和响应处理,提高了代码的可维护性和可扩展性。
### 回答3:
axios的拦截器是一种用来在请求和响应过程中执行额外操作的机制,允许我们拦截请求和响应,修改它们的行为或者添加新的功能。其中,axios提供了两种类型的拦截器:请求拦截器和响应拦截器。
请求拦截器允许我们在发送请求之前对请求进行修改或添加一些额外的处理操作。一些常见的用法包括:
1.在请求头中添加token或者其他认证信息。
2.请求发送之前在页面上展示loading图标。
3.根据实际需求进行请求参数的一些处理,如将对象序列化为json字符串、添加时间戳等。
响应拦截器允许我们在接收到响应之后对其进行修改或添加一些额外的处理操作。一些常见的用法包括:
1.对请求成功的响应进行一些统一的处理,如根据状态码进行弹窗提示或者页面跳转。
2.对响应失败的错误进行统一处理,如输出错误日志或者进行错误页面的展示。
3.对响应数据进行一些格式化操作,如将数据解析为json对象、提取关键字段等。
在我的项目中,我设置了请求拦截器和响应拦截器。请求拦截器中,我在每个请求的请求头中添加了token信息,以实现认证授权功能。响应拦截器中,我对请求成功的响应进行了统一的处理,根据返回的状态码进行相应的提示或者跳转到对应的页面。同时,我也对响应失败的错误进行了统一的处理,输出错误日志并展示错误页面,以便用户能够清晰地了解发生了什么错误。此外,我还对响应数据进行了一些格式化操作,以满足项目需求。通过拦截器的设置,我能够更好地控制请求和响应过程,提高了项目的可维护性和可扩展性。