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 support for this feature? Tell us why.
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)