このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

Response: error() 静的メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2017年10月⁩.

error()Response インターフェイスのメソッドで、ネットワークエラーに関連付けられた新しい Response オブジェクトを返します。

これは主にサービスワーカーを書くときに便利です。サービスワーカーが fetch イベントハンドラーからレスポンスを送信することで、メインアプリコードの fetch() 呼び出しにおけるプロミスを拒否させることができます。

エラーレスポンスでは、typeerror に設定されています。

構文

js
Response.error()

引数

なし。

返値

Response オブジェクト。

サービスワーカーからネットワークエラーを返す

あるウェブアプリにサービスワーカーがあり、そのサービスワーカーには次のような fetch イベントハンドラーが格納されているとします。

js
// service-worker.js

self.addEventListener("fetch", (event) => {
  const url = new URL(event.request.url);
  if (url.pathname === "/salamander.jpg") {
    event.respondWith(Response.error());
  }
});

このサービスワーカーを使うと、アプリからのフェッチリクエストはすべてサービスワーカーを通過してネットワークに渡ります。これは、次のメインスレッドのコードでエラーが発生し、catch ハンドラーが実行されるということです。

js
// main.js

const image = document.querySelector("#image");

try {
  const response = await fetch("salamander.jpg");
  const blob = await response.blob();
  const objectURL = URL.createObjectURL(blob);
  image.src = objectURL;
} catch (e) {
  console.error(e);
}

仕様書

Specification
Fetch
# ref-for-dom-response-error①

ブラウザーの互換性

関連情報