Sec-Fetch-Mode

Baseline 2023

Newly available

Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Der HTTP Sec-Fetch-Mode fetch metadata request header gibt den Modus der Anfrage an.

Im Großen und Ganzen ermöglicht dies einem Server, zwischen Anfragen zu unterscheiden, die von einem Nutzer stammen, der zwischen HTML-Seiten navigiert, und Anfragen zum Laden von Bildern und anderen Ressourcen. Zum Beispiel würde dieser Header navigate für Navigationsanfragen auf oberster Ebene enthalten, während no-cors für das Laden eines Bildes verwendet wird.

Header-Typ	Fetch Metadata Request Header
Verbotener Anforderungsheader	Ja (`Sec-` Präfix)
CORS-erlaubte Anforderungsheader	Nein

Syntax

http

Sec-Fetch-Mode: cors
Sec-Fetch-Mode: navigate
Sec-Fetch-Mode: no-cors
Sec-Fetch-Mode: same-origin
Sec-Fetch-Mode: websocket

Server sollten diesen Header ignorieren, wenn er einen anderen Wert enthält.

Direktiven

Hinweis: Diese Direktiven entsprechen den Werten in Request.mode.

cors: Die Anfrage ist eine CORS-Protokoll Anfrage.
navigate: Die Anfrage wird durch die Navigation zwischen HTML-Dokumenten initiiert.
no-cors: Die Anfrage ist eine no-cors-Anfrage (siehe Request.mode).
same-origin: Die Anfrage wird vom gleichen Ursprung wie die angeforderte Ressource gestellt.
websocket: Die Anfrage dient der Herstellung einer WebSocket Verbindung.

Beispiele

Verwendung von Sec-Fetch-Mode

Wenn ein Nutzer auf einen Seitenlink zu einer anderen Seite im gleichen Ursprung klickt, hätte die resultierende Anfrage die folgenden Header (beachten Sie, dass der Modus navigate ist):

http

Sec-Fetch-Dest: document
Sec-Fetch-Mode: navigate
Sec-Fetch-Site: same-origin
Sec-Fetch-User: ?1

Eine cross-site Anfrage, die durch ein <img> Element generiert wird, würde zu einer Anfrage mit den folgenden HTTP-Anforderungs-Headern führen (beachten Sie, dass der Modus no-cors ist):

http

Sec-Fetch-Dest: image
Sec-Fetch-Mode: no-cors
Sec-Fetch-Site: cross-site

Spezifikationen

Specification
Fetch Metadata Request Headers # sec-fetch-mode-header

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch

Sec-Fetch-Dest, Sec-Fetch-Site, Sec-Fetch-User fetch metadata request headers
Protect your resources from web attacks with Fetch Metadata (web.dev)
Fetch Metadata Request Headers playground (secmetadata.appspot.com)