Axios响应拦截器异常：会话超时后控制台重复打印问题排查

封装了如下包含Axios响应拦截器的fetch函数，部分API调用前需要身份验证。当会话超时后，通过链接进入调用这些API的页面时，控制台中第175行（拦截器内的console.log(error)）会被调用三次；但按F5刷新页面时，该现象消失。现询问此问题产生的原因。

封装的fetch函数代码 #

let fetch = async (data, method, url, responseType, header) => {
  axios.interceptors.response.use(
    function (response) {
      // Do something with response data
      return response;
    },
    function (error) {
      let errorObj;
      console.log(error);
      switch (true) {
        case error.response !== undefined:
          switch (error.response.status) {
            case 401:
              errorObj = {
                status: 401,
                message: error.response.data,
              };
              break;
            case 404:
              errorObj = {
                status: 404,
                message: error.message,
              };
              break;
            default:
              errorObj = {
                status: error.response.status,
                message: error.response.statusText,
              };
              break;
          }
          break;
        case error.request !== undefined:
          errorObj = error.request;
          break;
        default:
          errorObj = { message: error.message };
          break;
      }
      return Promise.reject(errorObj);
    }
  );
  let theRealURL = process.env["REACT_APP_SOCKET_URL"] + url;
  let requestObj = { method: method, url: theRealURL };
  if (method.toLowerCase() === "get") {
    requestObj.params = data;
  } else {
    requestObj.data = data;
  }
  if (responseType) {
    requestObj["responseType"] = responseType;
  }
  if (header) {
    requestObj["headers"] = header;
  }
  try {
    let response = await axios(requestObj);
    if (response.request.responseType === "blob") {
      let fileName = response.headers["content-disposition"];
      fileName = fileName.substring(fileName.indexOf("filename=") + 9);
      const newBlob = new Blob([response.data], {
        type: response.headers.get("content-type"),
      });
      const objUrl = window.URL.createObjectURL(newBlob);
      let link = document.createElement("a");
      link.href = objUrl;
      link.download = fileName;
      link.click();
    }
    return response.data;
  } catch (error) {
    throw error;
  }
};

控制台输出情况 #

会话超时后通过链接进入页面时的输出 #

第175行代码截图 #

刷新页面后控制台正常输出 #

内容的提问来源于stack exchange，提问作者The KNVB