非同期 XHR のネットワークエラーが例外の代わりに error イベントを発生させるようになり、getAllResponseHeaders() は空文字列を返します

公開日: | カテゴリー: DOM

概要

従来 Firefox は、非同期 XMLHttpRequest のネットワークエラーを検出した際に NetworkError 例外を投げていました。Firefox 50 以降では、Firefox 45 以降 クロスオリジンの Worker 読み込みが error イベントを発生させている のと同様に、ブラウザーは error イベントを非同期で発生させるようになります。以下のように onerror ハンドラーを try-catch 宣言と組み合わせて使うことで、両方の場合に適切に対処できます。

var xhr = new XMLHttpRequest();
xhr.addEventListener('load', function (event) {
  // ...
});
xhr.addEventListener('error', function (event) {
  // 新しいブラウザー向けにネットワークエラーを処理
});
xhr.open('GET', url, true);
try {
  xhr.send(null);
} catch (ex) {
  // 古いブラウザー向けにネットワークエラーを処理
}

なお、同期 XMLHttpRequest は引き続き例外を投げます。

これと関連し、XMLHttpRequest.getAllResponseHeaders メソッドは、ネットワークエラーが発生した場合に空文字列を返すようになりました。

参考資料