Window: unhandledrejection イベント

unhandledrejection イベントは、 JavaScript の拒否ハンドラーを持たない Promise が拒否されたときにスクリプトのグローバルスコープに送られます。 通常、これは window ですが、 Worker であることもあります。 これはデバッグや、予期しない場面でのエラーハンドリングのエラーの代替手段を提供するために利用することができます。

バブリング なし
キャンセル可能 はい
インターフェイス PromiseRejectionEvent
イベントハンドラープロパティ onunhandledrejection

使用上のメモ

unhandledrejection イベントにバブリングを許すと、結局はコンソールにエラーメッセージを出力することになります。 これは PromiseRejectionEventpreventDefault() を呼び出すことで防ぐことができます。 例は以下の Preventing default handling を参照してください。

ここで unhandledrejection イベントの使い方が分かる例をいくつか見てみましょう。 イベントには2つの有用な情報があります。

promise
拒否を扱うために利用できるハンドラーがなく拒否された実際の Promise です。
reason
拒否ハンドラーに渡されるはずだった理由です。 詳しくは catch() を参照してください。

基本的なエラーのログ

この例では、処理されなかった Promise の拒否についての情報を単純にコンソールにログ出力します。

window.addEventListener("unhandledrejection", event => {
  console.warn(`UNHANDLED PROMISE REJECTION: ${event.reason}`);
});

イベントハンドラープロパティを使用して、イベントリスナーを設定することもできます。

window.onunhandledrejection = event => {
  console.warn(`UNHANDLED PROMISE REJECTION: ${event.reason}`);
};

既定のハンドリングの防止

(Node.js など) 多くの環境では、既定では処理されなかった Promise の拒否はコンソールに報告されます。 unhandledrejection イベントのハンドラー — と、さらに実行したいその他のタスク — を追加して、 preventDefault() を呼び出すことでイベントをキャンセルし、実行時のログ出力コードが扱われるまでバブリングすることを防ぐことができます。 これは unhandledrejection がキャンセル可能であるためです。

window.addEventListener('unhandledrejection', function (event) {
  // ...your code here to handle the unhandled rejection...

  // Prevent the default handling (such as outputting the
  // error to the console

  event.preventDefault();
});

仕様書

仕様書 状態 備考
HTML Living Standard
unhandledrejection の定義
現行の標準 初回定義

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
unhandledrejection eventChrome 完全対応 49Edge 完全対応 ありFirefox 完全対応 69
完全対応 69
完全対応 68
無効
無効 From version 68: this feature is behind the dom.promise_rejection_events.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE 未対応 なしOpera 未対応 なしSafari 未対応 なしWebView Android 未対応 なしChrome Android 未対応 なしFirefox Android 完全対応 68
無効
完全対応 68
無効
無効 From version 68: this feature is behind the dom.promise_rejection_events.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android 未対応 なしSafari iOS 未対応 なしSamsung Internet Android 未対応 なし

凡例

完全対応  
完全対応
未対応  
未対応
ユーザーが明示的にこの機能を有効にしなければなりません。
ユーザーが明示的にこの機能を有効にしなければなりません。

関連情報

[1] 対応するイベントハンドラープロパティは、WindowEventHandlers ミックスインで定義されます。 これは、Window インターフェイスとすべての種類の Worker インターフェイスの両方で使用できます。