YanTianFeng的知识库

Want Coding

Want Reading

文章 89

访问 18443

评论 2

头像

YanTianFeng

发私信

文章 89
访问 18443
评论 2
Technology and Code
返回顶部

Knowledge  axios 请求超时重发

标签   超时重发  

  ( 36 )       ( 0 )


axios 请求超时重发代码实现

在全局包装一层 axios ,方便之后的调用、权限、异常等处理 utils / http.js

const axios = require('axios');

const http = function() {
  // 全局的请求次数,请求的间隙,超时时间
  axios.defaults.retry = 1;
  axios.defaults.retryDelay = 100;
  axios.defaults.timeout = 1000 * 36;

  // 包装request
  axios.interceptors.request.use(
    function(config) {
      // Do something before request is sent
      return config;
    },
    function(error) {
      // Do something with request error
      return Promise.reject(error);
    },
  );

  // 包装response
  axios.interceptors.response.use(
    function(response) {
      return response.data;
    },
    function(error) {
      // error.response 是接口返回等结构体
      // 如果为undefined,就视为没有返回,体现为超时
      if (error.response) {
        // 对特殊错误码进行处理
        if (error.response.status === 401) {
          window.location.href = '/login?callback=' + window.location.href;
        }
        return Promise.reject(error);
      } else {
        var config = error.config;
        // 如果配置不存在或未设置重试选项,就拒绝
        if (!config || !config.retry) return Promise.reject(error);
        // 设置用于跟踪重试计数的变量
        config.__retryCount = config.__retryCount || 0;
        // 检查我们是否已达到最大重试次数
        if (config.__retryCount >= config.retry) {
          // 以错误拒绝
          return Promise.reject(err);
        }
        // 增加重试次数
        config.__retryCount += 1;
        // 创建新承诺以处理指数退避
        var backoff = new Promise(function(resolve) {
          setTimeout(function() {
            resolve();
          }, config.retryDelay || 1);
        });
        // 返回撤回axios重试请求的承诺
        return backoff.then(function() {
          return axios(config);
        });
      }
    },
  );
  return axios;
}

Vue.prototype.$http = http();