axios拦截器
axios拦截器
axios提供过了拦截器功能,用于我们在发送每次请求或者得到响应后,进行对应的处理
拦截器种类
拦截器分为四种:
请求成功
请求失败
响应成功
响应失败
拦截的意义
网络请求模块先将请求的数据拦截下来, 对请求数据进行一些语法验证,并且天机上一些必要的信息,然后再将请求发送出去
需要拦截的情况
1. 比如有时候网络请求模块接收到发送请求的数据config,需要先验证一下这个config是否合规,或者添加上一些默认的配置
2. 比如每次发请求后,希望在界面上侠士请求等待的小图标
3. 某些网络请求(比如登录(token)),必须携带一些特殊的信息
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
import axios from "axios"; // 发送成功与发送失败拦截 export function instance1(config){ // 1. 创建axios实例 const instance = axios.create({ baseURL: 'http://123.207.32.32:8000', timeout: 5000, }); // 2. axios拦截器(axios实例中有拦截器功能) // 2.1 发送时拦截 instance.interceptors.request.use(aaa => { console.log(aaa); return aaa },err => { console.log(err); return res }) // 2.2 响应时拦截 instance.interceptors.response.use(res => { console.log(res); return res.data; }, err => { console.log(err); return err; }) // 3. 发送真正的网络请求 return instance(config); }