axios解决跨域 axios.interceptors的使用(一是请求拦截，二是返回拦截)

axios.create({

  timeout: 15000,

  // headers: {'Content-Type': 'application/x-www-form-urlencoded'},

  headers: { // 前端解决跨域

    "Content-Type": "application/octet-stream",

    "Access-Control-Allow-Origin": "*",

  },

  validateStatus(status) {

    switch (status) {

      case 400:

        break

      case 401:

        break

      case 403:

        break

      case 404:

        break

      case 500:

        break

    }

    return status >= 200 && status <= 300

  }

})

 

axios.interceptors的使用

    axios.interceptors有两种，一是请求拦截，二是返回拦截。

一、请求拦截
使用场景

1.在请求时在请求参数上统一添加参数，

axios.interceptors.request.use(config=>{
if(config.method=='post'){
config.data = {
...config.data,
"paramsName": params,
}
}else if(config.method=='get'){
config.params = {
"paramsName":params,
...config.params
}
}
return config;
},err=>{
return Promise.reject(err);
});
这样就可以将你的参数添加在请求当中了。

二、结果拦截
使用场景，验证token是否过期

axios.interceptors.response.use(response=>{
},error => {
if(error.response.status === 401){
//对应的token过期的操作
}
return Promise.resolve(error.response)
});
这里要注意的是，看你前后端阅读401的返回，一般是报错，所以你的response是空的，你需要在error的回调里面去进行相关的处理。

原文链接：https://blog.csdn.net/weixin_43078608/java/article/details/98875497