axios是如何做到取消请求的

业务具体场景需求

1. 请求接口获取数据
2. 显示 loading 遮罩防止用户后续请求
3. loading 遮罩上要有一个取消按钮，防止接口时间过长影响用户体验
4. 收到接口数据，关闭 loading 遮罩，跳转到下一个界面

axios 的逻辑实现（取消请求部分）

const CancelToken = axios.CancelToken;
const source = CancelToken.source();

axios.get('/user/12345', {
  cancelToken: source.token
})
source.cancel();

axios 实现原理

关键字

1. Promise
2. XMLHttpRequest.abort()

具体原理概括及源码

axios.CancelToken.source() 发生了什么

1. 创建了一个 CancelToken 实例给 token, CancelToken 的参数是一个函数，将函数参数再赋值给 cancel
2. 将 { token: token,cancel: cancel } 作为新对象返回

CancelToken.source = function source() {
   
    var cancel;
    var token = new CancelToken(function executor(c