请求被取消时，fetch 返回被拒绝的 Promise，其错误为 name 为 "AbortError" 的 DOMException；应通过 catch 捕获并判断 err.name === 'AbortError' 来识别取消，也可用 signal.aborted 提前规避，或封装 isAbortError 工具函数统一处理。
在 JavaScript 中，请求被取消时不会抛出传统异常，而是通过 AbortSignal 触发 abort 事件，并使对应的 fetch（或其他支持 AbortController 的 API）返回一个被拒绝的 Promise，其 rejection 原因是一个 DOMException，且 name 属性为 "AbortError"。
检查 rejection 原因是否为 AbortError
这是最直接、标准的方式。使用 catch 捕获 fetch 失败，然后判断错误类型：
<!-- 示例代码 -->
const controller = new AbortController();
const signal = controller.signal;
<p>fetch('/api/data', { signal })
.then(res => res.json())
.catch(err => {
if (err.name === 'AbortError') {
console.log('请求已被用户或程序主动取消');
// ✅ 这里可做取消后的清理、UI 还原等
return null;
}
// 其他网络错误（如 404、断网、超时等）
console.error('请求失败：', err);
});</p><p>// 取消请求（例如用户点击取消按钮）
controller.abort();
利用 signal.aborted 状态提前规避
在请求发起前或中间逻辑中，可通过 signal.aborted 属性判断控制器是否已终止，避免无谓操作：
立即学习“Java免费学习笔记（深入）”；
- 适用于需在 fetch 前做预处理（如打点、状态标记）的场景
- 不能替代 catch 判断，因为 fetch 内部可能在 signal 已 abort 后才真正执行并 reject
- 示例：
if (signal.aborted) {
console.log('请求尚未发出即被取消');
return;
}
fetch('/api/data', { signal })
// ...
封装统一的取消错误识别工具函数
便于多处复用，增强可读性和一致性：
function isAbortError(err) {
return err instanceof DOMException && err.name === 'AbortError';
}
<p>// 使用
fetch('/api/data', { signal })
.catch(err => {
if (isAbortError(err)) {
// 处理取消
} else {
// 处理其他错误
}
});
注意 Axios 等库的差异处理
Axios 不直接使用原生 AbortController（v1.3+ 虽支持 signal，但默认仍用自身取消机制），其取消错误是 Cancel 类型实例：
- 老版本 Axios：用
Axios.isCancel(err)判断 - 新版本（启用 signal）：同样可检查
err.name === 'AbortError' - 推荐统一用
err.name === 'AbortError'或err.code === 'ERR_CANCELED'（Axios 特有）
