Response: redirected プロパティ

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.

redirectedResponse インターフェイスの読み取り専用プロパティで、このレスポンスがリダイレクトされたリクエストの結果であるかどうかを示します。

メモ: redirected に頼ってリダイレクトをフィルタリングしていると、偽造されたリダイレクトによって、コンテンツが期待通りに動作しなくなることが簡単に起こります。 その代わり、 fetch() を呼び出すときにフィルタリングを行うべきです。 これを行う例を示したリダイレクトの禁止を参照してください。

論理値で、レスポンスがリクエストがリダイレクトされたことを示す場合は true となります。

リダイレクトの検出

レスポンスがリダイレクトされたものであるかどうかを調べるには、 Response オブジェクトのこのフラグをチェックするだけです。 下記のコードでは、取得処理中にリダイレクトが発生した場合、要素にテキストメッセージが挿入されます。 ただし、下記のリダイレクトの禁止で記述しているように、予想外のリダイレクトが発生した場合に完全に拒否するほど安全ではないことに注意してください。

url プロパティは、リダイレクト後の最終的な URL を返します。

js
fetch("awesome-picture.jpg")
  .then((response) => {
    const elem = document.getElementById("warning-message-box");
    elem.textContent = response.redirected ? "予期しないリダイレクト" : "";
    // リダイレクト後の最終 URL
    console.log(response.url);
    return response.blob();
  })
  .then((imageBlob) => {
    const imgObjectURL = URL.createObjectURL(imageBlob);
    document.getElementById("img-element-id").src = imgObjectURL;
  });

リダイレクトの禁止

redirected を使用して手動でリダイレクトをフィルタリングすると、リダイレクトの偽造が可能になるため、代わりに fetch() を呼び出す際に init 引数でリダイレクトモードを "error" に設定する必要があります、例えば次のようにします。

js
fetch("awesome-picture.jpg", { redirect: "error" })
  .then((response) => response.blob())
  .then((imageBlob) => {
    const imgObjectURL = URL.createObjectURL(imageBlob);
    document.getElementById("img-element-id").src = imgObjectURL;
  });

仕様書

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

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
redirected

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

関連情報