Axios 源码解读 —— 网络请求篇

上一章我们介绍了 Axios 源码解读 —— request 篇，这一章我们来介绍 Axios 实际发起网络请求的部分吧，也就是 dispatchRequest 方法。

dispatchRequest

这个方法定义也比较简单（如下图）

第 29 行 —— 取消请求

我们来逐行解析每一行代码所做的事情吧，首先是第 29 行的取消请求。（如下）

throwIfCancellationRequested(config);

这个动作不仅仅在发起正式请求前做了一次，而且在请求成功和请求失败时都做了一次。

只要是被 cancel 的请求，都是不会进入到成功或失败回调处理中的。（如下图）

而 throwIfCancellationRequested 函数所做的事情，就是检测该请求是否被取消，如果被取消则抛出一个错误，并阻止代码继续向下执行。（如下）

function throwIfCancellationRequested(config) {
   
  if (config.cancelToken) {
   
    // 检测请求是否被取消，然后决定是否抛出错误
    config.cancelToken.throwIfRequested();
  }

  if (config.signal && config.signal.aborted) {
   
    // 抛出错误
    throw new Cancel('canceled');
  }
}

当然，整套 CancelToken 的实现还是有一些复杂的（复杂在回调处理），如果有人感兴趣的话，可以单独讲讲这一部分的处理，这里就先不做展开了。

第 35 ~ 40 行 —— 处理请求 data

config.data = transformData.call(
  config,
  config.data,
  config.headers,
  config.transformRequest
);