AbortController：signal 属性

基线广泛可用

此功能已得到充分建立，并且可以在许多设备和浏览器版本中使用。它从 2019 年 3 月.

报告反馈

注意： 此功能在 Web 工作线程中可用。

值

AbortController 接口的 signal 只读属性返回一个 AbortSignal 对象实例，该实例可用于与异步操作进行通信或根据需要中止异步操作。

示例

一个 AbortSignal 对象实例。

在以下代码段中，我们旨在使用 Fetch API 下载视频。

我们首先使用 AbortController() 构造函数创建一个控制器，然后使用 AbortController.signal 属性获取其关联的 AbortSignal 对象的引用。

当 fetch 请求启动时，我们在请求的选项对象（下面的 {signal}）中将 AbortSignal 作为选项传入。这将信号和控制器与 fetch 请求关联起来，并允许我们通过调用 AbortController.abort() 来中止它，如下面的第二个事件监听器中所示。

const controller = new AbortController();
const signal = controller.signal;

const url = "video.mp4";
const downloadBtn = document.querySelector(".download");
const abortBtn = document.querySelector(".abort");

downloadBtn.addEventListener("click", fetchVideo);

abortBtn.addEventListener("click", () => {
  controller.abort();
  console.log("Download aborted");
});

function fetchVideo() {
  fetch(url, { signal })
    .then((response) => {
      console.log("Download complete", response);
    })
    .catch((err) => {
      console.error(`Download error: ${err.message}`);
    });
}

注意： 当调用 abort() 时，fetch() Promise 会因 AbortError 而拒绝。

规范

您可以在 GitHub 上找到完整的运行示例；您也可以查看实时运行的示例。
规范 # DOM 标准

浏览器兼容性

ref-for-dom-abortcontroller-signal②

另请参阅

启用 JavaScript 以查看数据。