全局拦截器

1. axios 全局拦截器

import axios from "axios";//引入axios
import { message } from "antd";//引入message组件

// 1.封装实例再导出
const instance = axios.create({
  baseURL: '',//公共路径可以提取到此处
  timeout: 10000,//过期时间，超过此事件后会出现timeout
  headers: {
    // Authorization:"···" //如果是内嵌页面也可以在这里配置
  }//默认请求头，看后端接口是否要求
});

// 2.直接配置Axios
axios.default={
    baseURL: '',//公共路径可以提取到此处
    timeout: 10000,//过期时间，超过此事件后会出现timeout
    headers: {
        // Authorization:"···" //如果是内嵌页面也可以在这里配置
    }//默认请求头，看后端接口是否要求
}

// 3.拦截器

axios.interceptors.request.use(function (config) {
    // 在发送请求之前做些什么
    const token=Cookies.get('···');
    if(token)config.headers['Authorization']=`bearer ${token}`
    return config;
  }, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);

    }

axios.interceptors.response.use(function (response) {
    // 对响应数据做点什么
    if (response.data.status == 200) {
        //请求成功提示
        message.info({ type: "success", message: response.data.msg });
    }
    return response;
  }, function (error) {
    // 对响应错误做点什么
     if (error && error.response) {//对各种响应码做提示，也可进行其它操作
      switch (error.response.status) {
        case 400:
          message.info( "错误请求" );
          break;
        case 401:
          message.info( "未授权，请重新登录" );
          break;
        case 403:
          message.info( "拒绝访问" );
          break;
        case 404:
          message.info( "未找到该资源" );
          break;
        case 405:
          message.info( "请求方法未允许" );
          break;
        case 408:
          message.info( "请求超时" );
          break;
        case 500:
          message.info( "服务器端出错" );
          break;
        case 501:
          message.info( "网络未实现" );
          break;
        case 502:
          message.info( "网络错误" );
          break;
        case 503:
          message.info( "服务不可用" );
          break;
        case 504:
          message.info( "网络超时" );
          break;
        case 505:
          message.info( "http版本不支持该请求" );
          break;
        default:
          message.info(`'连接错误'${error.response.status}`);
      }
    } else {
      message.info("连接到服务器失败");
    }
    return Promise.reject(error);
  });

2. jquery.ajax 全局拦截器

const token = Cookies.get("···");
if ($) {
  $(document).ajaxSend(function (event, jqxhr, config) {
    jqxhr.setRequestHeader("Authorization", `bearer ${token}`);
  });
}

3. angularjs 1.x $http 全局拦截器

$HTTP API 是基于 $q 服务暴露的 deferred/promise APIs

快捷使用方式：

$http.get/$http.head/$http.post/$http.put

$http.delete/$http.jsonp/$http.patch

angular.module("xxx",[])
  .config(["$httpProvider",function($httpProvider){
    const token='···';
    $httpProvider.defaults.headers.common['Authorization']=`bearer ${token}`
    $httpProvider.defaults.headers.post = {"my-header":"value"}
    $httpProvider.interceptors.push("yourInterceptors");
    $httpProvider.interceptors.push(function($q, dependency1, dependency2) {
        return {
            'request': function(config) {
                //("body").append("<div>这里是个遮罩层</div>");
            },
            'response': function(response) {
                //<div>这里是个遮罩层</div>.remove()
            }
        };
    });
  }])
  .factory("yourInterceptors",["$q","dependency", function($q,dependency){
    return {
      "request":function(config){
        // do something on success
        return config;
      }，
    "requestError":function(rejection){
       // do something on error
       If(canRecover(rejection)){
        return responseOrNewPromise
       }
       return $q.reject(rejection);
      },
    "response":function(response){
       // do something on success
       return response;
      },
    "responseError":function(rejection){
       // do something on error
       If(canRecover(rejection)){
         return responseOrNewPromise
       }
      return $q.reject(rejection);
      }
   };
  }]).controller("testCtrl",["$http","$httpParamSerializerJQLike","$compile",function($http,$httpParamSerializerJQLike,$compile){
      const data = { id: 1, value: "hello" };//
      $http({
          method: "post",
          data: data,//Form Data = {"id":1,"value":"hello"}
          url: "/url",
          headers: { "Content-Type": "application/x-www-form-urlencoded" }
      }).success(function (d) { console.log(d); }).error(function(error){console.log(error);});

      $http({
          method: "post",
          data: $httpParamSerializerJQLike(data),//Form Data 变成 id:1 value:hello url: "/url",
          headers: { "Content-Type": "application/x-www-form-urlencoded" }
      }).success(function(d){ console.log(d);}).error(function(error){ console.log(error);});
  }]);