Ajax-axios拦截器

拦截器作用

主要是在axios请求和响应之间拦截请求

拦截器有两种：

1.请求拦截器：

一般会统一在请求中添加token

2.相应拦截器：

一般会处理错误信息，和401时处理token(一般跳转到登录页面重新获取token)

拦截器常用处理流程图如下：

示例代码如下：

// 添加请求拦截器
axios.interceptors.request.use(function (config) {// 在发送请求之前做些什么// debuggerif (localStorage.getItem('token')) {config.headers.Authorization = localStorage.getItem('token')}return config;// config 请求报文 请求地址 请求方法 请求头 请求体
}, function (error) {// 对请求错误做些什么// debuggerreturn Promise.reject(error);
});// 添加响应拦截器
axios.interceptors.response.use(function (response) {// 对响应数据做点什么// debuggerreturn response;// response响应报文 
}, function (error) {// 对响应错误做点什么// debuggerToast.fail(error.response.data.message)if (error.response.status === 401) {location.href = './login.html'}return Promise.reject(error);
});

1.请求拦截器且执行成功时，

如果收到token值，把token追加到请求头的里

(这个参数是接口文档里要求的参数名)

2.相应拦截器且执行失败后，

1.2利用.js文件中自带的Toast.fail()方法把报错文字打印在弹出框中

可以查找报错的提示文字存储位置

2.没有获取到/过期时，即401

可以查找状态码存储在error的具体位置

如果401，则通过跳转到登陆页面的方式重新获取用户的token