Sec-Fetch-Mode header
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit März 2023 browserübergreifend verfügbar.
Want more browser support for this feature? Tell us why.
Der HTTP-Fetch-Metadata-Request-Header Sec-Fetch-Mode gibt den Modus der Anfrage an.
Damit kann ein Server grundsätzlich zwischen Anfragen unterscheiden, die durch die Navigation eines Benutzers zwischen HTML-Seiten entstehen, und Anfragen zum Laden von Bildern oder anderen Ressourcen. Bei einer Navigationsanfrage auf oberster Ebene enthält dieser Header beispielsweise navigate, beim Laden eines Bildes dagegen no-cors.
Der Header wird nur bei Anfragen an potenziell vertrauenswürdige URLs übermittelt.
| Header-Typ | Fetch-Metadata-Request-Header |
|---|---|
| Verbotener Request-Header | Ja (Präfix Sec-) |
| CORS-safelisted Request-Header | Nein |
Syntax
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 von Request.mode.
cors-
Die Anfrage ist eine Anfrage nach dem CORS-Protokoll.
-
Die Anfrage wird durch die Navigation zwischen HTML-Dokumenten ausgelöst.
no-cors-
Die Anfrage ist eine no-cors-Anfrage (siehe
Request.mode). same-origin-
Die Anfrage stammt vom selben Ursprung wie die angeforderte Ressource.
websocket-
Die Anfrage dient dem Aufbau einer WebSocket-Verbindung.
Beispiele
Sec-Fetch-Mode verwenden
Wenn ein Benutzer auf einen Link zu einer anderen Seite desselben Ursprungs klickt, enthält die daraus resultierende Anfrage die folgenden Header (beachten Sie, dass der Modus navigate ist):
Sec-Fetch-Dest: document
Sec-Fetch-Mode: navigate
Sec-Fetch-Site: same-origin
Sec-Fetch-User: ?1
Eine ursprungsübergreifende Anfrage, die durch ein <img>-Element erzeugt wird, enthält die folgenden HTTP-Request-Header (beachten Sie, dass der Modus no-cors ist):
Sec-Fetch-Dest: image
Sec-Fetch-Mode: no-cors
Sec-Fetch-Site: cross-site
Spezifikationen
| Spezifikation |
|---|
| Fetch Metadata Request Headers # sec-fetch-mode-header |
Browser-Kompatibilität
Siehe auch
- Die Fetch-Metadata-Request-Header
Sec-Fetch-Dest,Sec-Fetch-SiteundSec-Fetch-User - Schützen Sie Ihre Ressourcen mit Fetch Metadata vor Webangriffen (web.dev)
- Testumgebung für Fetch-Metadata-Request-Header (secmetadata.appspot.com)