axios拦截器：如何在onFulfill中抛出错误？答案

【问题标题】：Axios interceptors: how to throw errors in the onFulfill?axios拦截器：如何在onFulfill中抛出错误？
【发布时间】：2019-10-22 17:31:39
【问题描述】：

我知道axios拦截器可以处理bot ok和ko

axios.interceptors.response.use(
    // onFullfilled
    function(axios_response) {
       return axios_response;
    },

    // onRejected 
    function(axios_error) {
       console.log(axios_error);
       return Promise.reject(axios_error);
    }
)

我的确切问题是：我怎样才能在onRejected 中抛出一个错误，以便能够在兄弟onRejected 中处理？ p>

我试过了

// onFullfilled
function(axios_response) {

    if (!axios_response.data) return axios_response;

    const { data } = axios_response;

    if (!data.status || !data.message) return axios_response;

    const { status, message } = data;

    console.log("status", status);
    console.log("message", message);

    if (status === "error") {
        return Promise.reject(axios_response);
    }


    return axios_response;
 },

但我认为这是错误的方式，因为我的拒绝没有被拦截器的 onRejected 处理程序捕获。

【问题讨论】：

你不能。要保持代码 DRY，请将 onRejected 处理程序编写为外部函数；按名称附加它作为onRejected 处理程序，并根据需要从onFullfilled 处理程序调用它。
其实，有更好的组织方式——我会发布答案。

标签： promise axios interceptor

【解决方案1】：

你可以为axios.interceptors.response.use()写一个相当简单的补丁，比如axios.interceptors.response.use_()。

在 axios 初始化后将以下内容放在适当的位置：

axios.interceptors.response.use_ = function(onFullfilled, onRejected) {
    axios.interceptors.response.use(
        // onFullfilled
        function(response) {
            try {
                return onFullfilled(response);
            }
            catch(e) {
                return onRejected(e);
            }
        },
        // onRejected
        onRejected,
    )
};

补丁实现了与原始.use() 相同的接口。在使用.use_() 而不是.use() 建立拦截后，如果您的onFullfilled() 抛出（有意或无意），则将调用相同的onRejected 处理程序，就好像拦截了拒绝一样。

这就是它的本质。

如果任一处理程序有可能使用关键字this，则需要使用Function.prototype.call() 指定预期的this：

axios.interceptors.response.use_ = function(onFullfilled, onRejected) {
    axios.interceptors.response.use(
        // onFullfilled
        function(response) {
            try {
                return onFullfilled.call(this, response);
            }
            catch(e) {
                return onRejected.call(this, e);
            }
        },
        // onRejected
        onRejected
    )
};

【讨论】：

【解决方案2】：

确保您返回 Promise.rejct：

this.http.interceptors.response.use(async function (response: AxiosResponse<BaseApiResponse, any>) {
          
          if(response.data.code !== ApiCode.OPERATION_SUCCES) {
              return Promise.reject(response.data);
          }
          
          return response;

      }, function (error) {
          return Promise.reject(error);
});

【讨论】：