AbortSignal

これは実験的な機能です。本番で使用する前にブラウザー実装状況をチェックしてください。

AbortSignal インターフェイスは DOM 要求 (Fetch など) と通信し、必要に応じて AbortController オブジェクトを介して中断することを可能にするシグナルオブジェクトを表します。

プロパティ

AbortSignal インターフェイスはまた、親のインターフェースである、 EventTarget からプロパティを継承しています。

AbortSignal.aborted 読取専用
シグナルが通信しているリクエスト(複数回も)が中断しているかを示す Boolean で、(true) が中断している 、(false) は中断していないを表します。

イベント

addEventListener() を使うかこのインターフェースの oneventname プロパティにイベントリスナーを割り当てることでこのイベントへのアクセスに待機します。

abort
シグナルが通信している DOM リクエスト (複数回も) の中断を呼び出す。
また onabort プロパティを介して利用可能です。

メソッド

AbortSignal インターフェースは親インタフェースである、EventTarget からメソッドを継承します。

この後の短いコードで、Fetch API を使用してビデオをダウンロードします。

まず AbortController() コンストラクターを使ってコントローラーを生成し、AbortController.signal プロパティを使用して関連する AbortSignal オブジェクトへの参照を取得します。

読み込みリクエスト が初期化すると、リクエストのオプションオブジェクト (下記 {signal} を参照) の内部のオプションとして AbortSignal を渡します。これによりシグナルと読み込みリクエストのコントローラーは関連付き、AbortController.abort() を呼び出すことで下記の 2 つ目のイベントリスナーに見られるように中断が許可されます。

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

var downloadBtn = document.querySelector('.download');
var abortBtn = document.querySelector('.abort');

downloadBtn.addEventListener('click', fetchVideo);

abortBtn.addEventListener('click', function() {
  controller.abort();
  console.log('Download aborted');
});

function fetchVideo() {
  ...
  fetch(url, {signal}).then(function(response) {
    ...
  }).catch(function(e) {
    reports.textContent = 'Download error: ' + e.message;
  })
}

注記: abort() が呼ばれると、fetch() promise は AbortError で失敗します。

現在のバージョンの Firefox は、DOMException で失敗します。

GitHub で完全に動作する例を見ることができます — abort-api (または 実際に動作する様子 を参照) を参照してください。

仕様

仕様書 ステータス コメント
DOM
AbortSignal の定義
現行の標準 初回定義

ブラウザの実装状況

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
AbortSignal
実験的
Chrome 完全対応 66Edge 完全対応 16Firefox 完全対応 57IE 未対応 なしOpera 完全対応 53Safari 完全対応 11.1WebView Android 完全対応 66Chrome Android 完全対応 66Firefox Android 完全対応 57Opera Android 完全対応 47Safari iOS 完全対応 11.3Samsung Internet Android 完全対応 9.0
abort event
実験的
Chrome 完全対応 66Edge 完全対応 16Firefox 完全対応 57IE 未対応 なしOpera 完全対応 53Safari 完全対応 11.1WebView Android 完全対応 66Chrome Android 完全対応 66Firefox Android 完全対応 57Opera Android 完全対応 47Safari iOS 完全対応 11.3Samsung Internet Android 完全対応 9.0
aborted
実験的
Chrome 完全対応 66Edge 完全対応 16Firefox 完全対応 57IE 未対応 なしOpera 完全対応 53Safari 完全対応 11.1WebView Android 完全対応 66Chrome Android 完全対応 66Firefox Android 完全対応 57Opera Android 完全対応 47Safari iOS 完全対応 11.3Samsung Internet Android 完全対応 9.0
onabort
実験的
Chrome 完全対応 66Edge 完全対応 16Firefox 完全対応 57IE 未対応 なしOpera 完全対応 53Safari 完全対応 11.1WebView Android 完全対応 66Chrome Android 完全対応 66Firefox Android 完全対応 57Opera Android 完全対応 47Safari iOS 完全対応 11.3Samsung Internet Android 完全対応 9.0

凡例

完全対応  
完全対応
未対応  
未対応
実験的。動作が変更される可能性があります。
実験的。動作が変更される可能性があります。

関連情報