axios 拦截器

本文主要讲一下 axios 响应拦截器对错误的处理。

先来看一下响应拦截器的格式:

1
2
3
4
5
6
7
8
9
const request = axios.create();

request.interceptors.response.use(res => {
// 2xx 范围内的状态码都会触发该函数
// 对响应数据做点什么
}, error => {
// 超出 2xx 范围的状态码都会触发该函数
// 对响应错误做点什么
})

现在发起一个请求:

1
request.get("/").then(res => {}).catch(err => {})

若响应拦截器不写 error => {} 参数,那么响应的错误信息会被 catch 捕获。

若写了 error => {} 参数,可分为以下两种情况:

(1)返回非 Promise 对象的内容。

这种情况下,error => {} 返回的值被 then 捕获。

(2)返回 Promise 对象。

Promise 对象 resolve 中的参数将被 then 捕获,reject 中的参数将被 catch 捕获。

res => {} 函数的原理与 error => {} 一样。