Response: type プロパティ

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017.

typeResponse インターフェイスの読み取り専用プロパティで、このレスポンスの種類を保持します。 以下のうちの何れかになります。

  • basic: 通常の、同一ドメインのレスポンスで、 "Set-Cookie" 以外のすべてのヘッダーが公開されます。
  • cors: レスポンスは有効なオリジン間リクエストで受信しました。特定のヘッダーと本体にアクセスできます。
  • error: ネットワークエラーです。 エラーを記述した有益な情報は使用できません。 このレスポンスの status は 0 で、headers は空で不変です。 これは Response.error() から得られる種類のレスポンスです。
  • opaque: 別オリジンのリソースへの "no-cors" リクエストに対するレスポンス。 厳しく制限されています
  • opaqueredirect: フェッチリクエストが redirect: "manual" で行われました。 このレスポンスの status は 0、headers は空、body は null、トレーラーは空です。

メモ: "error" レスポンスは実際にスクリプトに公開されることはありません。 fetch() に対するそのようなレスポンスは、プロミスを拒否します。

レスポンスの種類を示す ResponseType 文字列。

Fetch Response の例Fetch Response のライブ版 を参照)では、新しい Request オブジェクトを、 Request() コンストラクターを使用して作成し、 JPG のパスを渡します。次に fetch() を使用してこのリクエストをフェッチし、 Response.blob を使用してリクエストから blob を抽出し、 URL.createObjectURL() を使用してオブジェクト URL を作成し、これを <img> に表示します。

なお、 fetch() ブロックの先頭で、レスポンスの type 値をコンソールにログ出力していることに注意してください。

js
const myImage = document.querySelector("img");

const myRequest = new Request("flowers.jpg");

fetch(myRequest)
  .then((response) => {
    console.log("response.type =", response.type); // response.type = 'basic'
    return response.blob();
  })
  .then((myBlob) => {
    const objectURL = URL.createObjectURL(myBlob);
    myImage.src = objectURL;
  });

仕様書

Specification
Fetch Standard
# ref-for-dom-response-type①

ブラウザーの互換性

BCD tables only load in the browser

関連情報