项目axios依赖版本更新

2022-10-14 10:16:37 浏览数 (1)

一、更新背景

同一个接口，B请求快于A请求返回，页面展示的内容为A请求内容。于是有了取消请求的需求。

从v0.22.0开始，Axios 支持以 fetch API 方式——AbortController取消请求：

代码语言：javascript复制
const controller = new AbortController();

axios.get('/foo/bar', {
   signal: controller.signal
}).then(function(response) {
   //...
});
// 取消请求
controller.abort()

代码不生效，axios版本为v.0.21.0，最新版本为v1.12.1。

旧版本中断请求的方法已废弃，官方文档不推荐使用。

为更新版本整理了一下重要的迭代更新内容。

二、重要迭代内容

（迭代内容以时间排序）

v0.22.0

  • Fixed cancelToken leakage and added AbortController support (#3305)
代码语言：javascript复制

    if (config.cancelToken || config.signal) {
      // Handle cancellation
      // eslint-disable-next-line func-names
      
        onCanceled = function(cancel) {
          if (req.aborted) return;
          req.abort();
          reject(!cancel || (cancel && cancel.type) ? new Cancel('canceled') : cancel);
          };
          
        config.cancelToken && config.cancelToken.subscribe(onCanceled);
          
        if (config.signal) {
        config.signal.aborted ? onCanceled() : config.signal.addEventListener('abort', onCanceled);
        }
    }

v0.23.0

  • Added testing to TypeScript portion of project (#4140)

v0.27.0

  • (*) Refactored error handling implementing AxiosError as a constructor, this is a large change to error handling on the whole (#3645)
代码语言：javascript复制
'use strict';

var utils = require('../utils');

/**
 * Create an Error with the specified message, config, error code, request and response.
 *
 * @param {string} message The error message.
 * @param {string} [code] The error code (for example, 'ECONNABORTED').
 * @param {Object} [config] The config.
 * @param {Object} [request] The request.
 * @param {Object} [response] The response.
 * @returns {Error} The created error.
 */
function AxiosError(message, code, config, request, response) {
  Error.call(this);
  this.message = message;
  this.name = 'AxiosError';
  code && (this.code = code);
  config && (this.config = config);
  request && (this.request = request);
  response && (this.response = response);
}

utils.inherits(AxiosError, Error, {
  toJSON: function toJSON() {
    return {
      // Standard
      message: this.message,
      name: this.name,
      // Microsoft
      description: this.description,
      number: this.number,
      // Mozilla
      fileName: this.fileName,
      lineNumber: this.lineNumber,
      columnNumber: this.columnNumber,
      stack: this.stack,
      // Axios
      config: this.config,
      code: this.code,
      status: this.response && this.response.status ? this.response.status : null
    };
  }
});

var prototype = AxiosError.prototype;
var descriptors = {};

[
  'ERR_BAD_OPTION_VALUE',
  'ERR_BAD_OPTION',
  'ECONNABORTED',
  'ETIMEDOUT',
  'ERR_NETWORK',
  'ERR_FR_TOO_MANY_REDIRECTS',
  'ERR_DEPRECATED',
  'ERR_BAD_RESPONSE',
  'ERR_BAD_REQUEST',
  'ERR_CANCELED'
// eslint-disable-next-line func-names
].forEach(function(code) {
  descriptors[code] = {value: code};
});

Object.defineProperties(AxiosError, descriptors);
Object.defineProperty(prototype, 'isAxiosError', {value: true});

// eslint-disable-next-line func-names
AxiosError.from = function(error, code, config, request, response, customProps) {
  var axiosError = Object.create(prototype);

  utils.toFlatObject(error, axiosError, function filter(obj) {
    return obj !== Error.prototype;
  });

  AxiosError.call(axiosError, error.message, code, config, request, response);

  axiosError.name = error.name;

  customProps && Object.assign(axiosError, customProps);

  return axiosError;
};

module.exports = AxiosError;

  • New toFormData helper function that allows the implementor to pass an object and allow axios to convert it to FormData (#3757)

使用