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.
Der HTTP-Header Sec-Fetch-Mode Fetch-Metadaten-Anfrage-Header zeigt den Modus der Anfrage an.
Im Allgemeinen ermöglicht dies einem Server, zwischen Anfragen zu unterscheiden, die von einem Benutzer stammen, der zwischen HTML-Seiten navigiert, und Anfragen zum Laden von Bildern und anderen Ressourcen. Beispielsweise würde dieser Header navigate für Anfragen auf oberster Navigationsebene enthalten, während no-cors zum Laden eines Bildes verwendet wird.
| Header-Typ | Fetch-Metadaten-Anfrage-Header |
|---|---|
| Verbotener Anfrage-Header | Ja (Sec- Präfix) |
| CORS-gesicherter Anfrage-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 in Request.mode.
cors-
Die Anfrage ist eine CORS-Protokoll Anfrage.
-
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 stammt aus derselben Quelle wie die Ressource, die angefordert wird.
websocket-
Die Anfrage erfolgt, um eine WebSocket-Verbindung herzustellen.
Beispiele
Verwendung von Sec-Fetch-Mode
Wenn ein Benutzer 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):
Sec-Fetch-Dest: document
Sec-Fetch-Mode: navigate
Sec-Fetch-Site: same-origin
Sec-Fetch-User: ?1
Eine anfrageübergreifende Anfrage, die durch ein <img>-Element erzeugt wird, würde zu einer Anfrage mit den folgenden HTTP-Anfrage-Headern führen (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
Sec-Fetch-Dest,Sec-Fetch-Site,Sec-Fetch-UserFetch-Metadaten-Anfrage-Header- Schützen Sie Ihre Ressourcen vor Webangriffen mit Fetch Metadata (web.dev)
- Fetch Metadata Request Headers playground (secmetadata.appspot.com)