vue axios拦截器介绍

发布时间:2019-05-28 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了vue axios拦截器介绍脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

axios的拦截器是一个作用非常大,非常好用的东西。分为请求拦截器和响应拦截器两种。
我一般把拦截器写在main.js里。

1. 请求拦截器

请求拦截器的作用是在请求发送前进行一些操作,例如在每个请求体里加上token,统一做了处理如果以后要改也非常容易。

axios.interceptors.request.use(function (config) {
    // 在发送请求之前做些什么,例如加入token
    .......
    return config;
  }, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);
  });

2. 响应拦截器

响应拦截器的作用是在接收到响应后进行一些操作,例如在服务器返回登录状态失效,需要重新登录的时候,跳转到登录页。

axios.interceptors.response.use(function (response) {
    // 在接收响应做些什么,例如跳转到登录页
    ......
    return response;
  }, function (error) {
    // 对响应错误做点什么
    return PRomise.reject(error);
  });

3. 移除拦截器

VAR myInterceptor = axios.interceptors.request.use(function () {/*...*/});
axios.interceptors.request.eject(myInterceptor);

4. 为axios实例添加拦截器

var instance = axios.create();
instance.interceptors.request.use(function () {/*...*/});

拦截器真的非常重要非常好用~

脚本宝典总结

以上是脚本宝典为你收集整理的vue axios拦截器介绍全部内容,希望文章能够帮你解决vue axios拦截器介绍所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。