使用AbortController无法取消axios.get请求的问题求助

安全阿岳

2026-7-31

问题分析与解决方案

你的问题出在调用abort()的时机太早——axios发起请求时需要完成内部初始化流程（比如创建请求实例、绑定AbortSignal），你在调用axios.get()后立刻执行c.abort()，此时请求还没完成信号绑定，取消指令自然无法生效，最终只能等到超时。

修正后的代码示例

方式1：延迟触发取消

给请求留一点初始化时间，再执行取消操作：

const c = new AbortController();

// 发起请求并捕获错误
const request = axios.get("https://www.google.com:81", { signal: c.signal })
  .catch(err => {
    if (err.name === 'CanceledError') {
      console.log('请求已成功取消');
    } else {
      console.log('请求超时或其他异常');
    }
  });

// 延迟触发取消，确保请求已完成信号绑定
setTimeout(() => {
  c.abort();
}, 100);

方式2：异步等待初始化完成

通过短暂的异步等待，确保请求完成信号绑定后再取消：

async function testRequestCancel() {
  const c = new AbortController();
  const requestPromise = axios.get("https://www.google.com:81", { signal: c.signal });

  // 等待10ms，给请求初始化留足时间
  await new Promise(resolve => setTimeout(resolve, 10));
  
  c.abort();

  try {
    await requestPromise;
  } catch (err) {
    console.log(err.name); // 会输出 CanceledError，说明取消生效
  }
}

testRequestCancel();