【Axios】关于Axios里的拦截器
1. 简介Axios 是一个基于 Promise 的 HTTP 客户端，用于欣赏器和 Node.js
情况，它提供了强盛的拦截器（interceptors）功能，允许你对哀求或响应在它们被应用到 then 或 catch 之前进行拦截和处理。
关于拦截器的使用，可查看官方文档：拦截器
// 添加请求拦截器
axios.interceptors.request.use(function (config) {
// 在发送请求之前做些什么
return config;
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error);
});
// 添加响应拦截器
axios.interceptors.response.use(function (response) {
// 2xx 范围内的状态码都会触发该函数。
// 对响应数据做点什么
return response;
}, function (error) {
// 超出 2xx 范围的状态码都会触发该函数。
// 对响应错误做点什么
return Promise.reject(error);
});
接下来根据代码解读哀求拦截器和响应拦截器。
2.哀求拦截器
哀求拦截器用于在哀求发送到服务器之前对哀求进行处理。哀求拦截器用于在哀求发送到服务器之前对哀求进行处理。在 Axios 中，可以使用axios.interceptors.request.use
方法来添加哀求拦截器。
2.1 参数表明
[*]config: 这是一个对象，包罗了 Axios 哀求的设置信息，具体包括：
[*]url: 哀求的 URL 地址。
[*]method: 哀求的 HTTP 方法（如 ‘get’, ‘post’, ‘put’, ‘delete’ 等）。
[*]data: 发送的数据，通常用于 ‘post’, ‘put’, ‘patch’ 等哀求方法。
[*]params: URL 参数对象，用于 get 或 delete 哀求中拼接查询字符串。
[*]headers: 哀求头，可以在这里设置如 Content-Type, Authorization 等。
[*]timeout: 哀求超时时间，单位为毫秒。
[*]withCredentials: 是否携带凭证（如 Cookies 或 Authorization headers），跨域哀求时使用。
2.2 拦截器作用
[*]修改或添加哀求头，例如添加一个通用的认证令牌。
[*]根据需要修改哀求的 URL、方法或数据。
[*]设置哀求超时时间。
[*]取消哀求或在某些条件下不发送哀求。
3. 响应拦截器
响应拦截器通过 axios.interceptors.response.use 方法添加，它可以在处理响应之前对响应对象 response
进行处理。
3.1 参数表明
[*]response: 这是一个对象，包罗了从服务器返回的响应信息，具体包括：
[*]data: 服务器返回的数据。
[*]status: HTTP 状态码。
[*]statusText: HTTP 状态信息，例如 ‘OK’, ‘Not Found’ 等。
[*]headers: 响应头。
[*]config: 发起哀求时的设置对象。
3.2 拦截器作用
[*]对响应数据进行预处理或转换，比如将 JSON 字符串转换为 JavaScript 对象。
[*]处理非 2xx 状态码的错误响应，例如重试哀求或抛堕落误。 记录日志、监控 API 性能。
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]