AbortController and AbortSignal | Frontend Practical Guide

Widely available すべての主要ブラウザで対応済み。安心して使用可能。

対応ブラウザ

機能	デスクトップ				モバイル
機能	Chrome	Edge	Firefox	Safari	Chrome Android	Safari iOS
`AbortController`	66	16	57	12.1	66	12.2
`abort` abort() は AbortController インターフェイスのメソッドで、非同期操作を完了前に中止します。これはフェッチリクエスト、あらゆるレスポンス本体の消費、ストリームを中止することができます。	66	16	57	12.1	66	12.2
`abort (reason parameter)` `reason` パラメータ	98	98	97	15.4	98	15.4
`AbortController` AbortController() は、新しい AbortController オブジェクトインスタンスを生成します。	66	16	57	12.1	66	12.2
`signal` signal は AbortController インターフェイスの読み取り専用プロパティで、求めに応じて非同期操作とやりとりしたり中止したりするために使用される AbortSignal オブジェクトインスタンスを返します。	66	16	57	12.1	66	12.2
`AbortSignal` AbortSignal インターフェイスは非同期操作（フェッチリクエストなど）とやりとりし、必要に応じて AbortController オブジェクトを介して中止することを可能にするシグナルオブジェクトを表します。	66	16	57	11.1	66	11.3
`abort_event` abort は AbortSignal のイベントで、関連するリクエストが中止されたとき、つまり AbortController.abort() を使用して中止されたときに発行されます。	66	16	57	11.1	66	11.3
`abort_static` AbortSignal.abort() は静的メソッドで、既に中止と設定されている（かつ AbortSignal/abort_event イベントが発生していない） AbortSignal を返します。	93	93	88	15	93	15
`abort_static (reason parameter)` `reason` パラメータ	98	98	97	15.4	98	15.4
`aborted` aborted は読み取り専用プロパティで、そのシグナルがやりとりしている非同期操作が中止されているか (true)、されていないか (false) を示す値を返します。	66	16	57	11.1	66	11.3
`reason` reason は読み取り専用プロパティで、中止の理由を示す JavaScript の値を返します。	98	98	97	15.4	98	15.4
`throwIfAborted` throwIfAborted() メソッドは、シグナルが中止された場合、シグナルの中止理由 (AbortSignal.reason) の例外を発生させ、それ以外の場合は何もしません。	100	100	97	15.4	100	15.4

1+対応 (バージョン) 未対応 ※注釈ありサブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

実務での使いどころ

AbortController and AbortSignal の活用

AbortController インターフェイスは 1 つ以上のウェブリクエストをいつでも中断することを可能にするコントローラーオブジェクトを表します。

注意点

古いブラウザでは対応していない場合がある。

実装メモ

一部の API はセキュアコンテキスト (HTTPS) やユーザー操作起点を必要とする。利用前に要件を確認すること。

参考リンク