RequestInit

Instanz-Eigenschaften

attributionReporting Optional Veraltet

Gibt an, dass Sie möchten, dass die Antwort der Anfrage in der Lage ist, eine JavaScript-basierte Attributionsquelle oder einen Attributionstrigger zu registrieren. attributionReporting ist ein Objekt, das die folgenden Eigenschaften enthält:

eventSourceEligible

Ein boolescher Wert. Wenn auf true gesetzt, ist die Antwort der Anfrage berechtigt, eine Attributionsquelle zu registrieren. Wenn auf false gesetzt, ist dies nicht der Fall.

triggerEligible

Ein boolescher Wert. Wenn auf true gesetzt, ist die Antwort der Anfrage berechtigt, einen Attributionstrigger zu registrieren. Wenn auf false gesetzt, ist dies nicht der Fall.

Siehe die Attribution Reporting API für weitere Details.

body Optional

Der Anfrage-Body enthält Inhalte, die an den Server gesendet werden sollen, zum Beispiel in einer POST oder PUT Anfrage. Er wird als Instanz eines der folgenden Typen angegeben:

• ein String
• ArrayBuffer
• Blob
• DataView
• File
• FormData
• TypedArray
• URLSearchParams
• ReadableStream

Siehe Setting a body für weitere Details.

browsingTopics Optional Veraltet

Ein boolescher Wert, der angibt, dass die ausgewählten Themen des aktuellen Benutzers in einem Sec-Browsing-Topics Header mit der zugehörigen Anfrage gesendet werden sollen.

Siehe Using the Topics API für weitere Details.

cache Optional

Der Cache-Modus, den Sie für die Anfrage verwenden möchten. Dies kann einer der folgenden Werte sein:

default

Der Browser sucht im HTTP-Cache nach einer Antwort, die zur Anfrage passt.

• Wenn es eine Übereinstimmung gibt und sie frisch ist, wird sie aus dem Cache zurückgegeben.
• Wenn es eine Übereinstimmung gibt, diese jedoch abgelaufen ist, stellt der Browser eine bedingte Anfrage an den entfernten Server. Wenn der Server anzeigt, dass die Ressource nicht geändert wurde, wird sie aus dem Cache zurückgegeben. Andernfalls wird die Ressource vom Server heruntergeladen und der Cache wird aktualisiert.
• Wenn es keine Übereinstimmung gibt, stellt der Browser eine normale Anfrage und aktualisiert den Cache mit der heruntergeladenen Ressource.

no-store

Der Browser ruft die Ressource vom entfernten Server ab, ohne zuerst im Cache nachzusehen, und wird den Cache nicht mit der heruntergeladenen Ressource aktualisieren.

reload

Der Browser ruft die Ressource vom entfernten Server ab, ohne zuerst im Cache nachzusehen, aber wird dann den Cache mit der heruntergeladenen Ressource aktualisieren.

no-cache

Der Browser sucht im HTTP-Cache nach einer Antwort, die zur Anfrage passt.

• Wenn es eine Übereinstimmung gibt, frisch oder abgelaufen, stellt der Browser eine bedingte Anfrage an den entfernten Server. Wenn der Server anzeigt, dass die Ressource nicht geändert wurde, wird sie aus dem Cache zurückgegeben. Andernfalls wird die Ressource vom Server heruntergeladen und der Cache wird aktualisiert.
• Wenn es keine Übereinstimmung gibt, stellt der Browser eine normale Anfrage und aktualisiert den Cache mit der heruntergeladenen Ressource.

force-cache

Der Browser sucht im HTTP-Cache nach einer Antwort, die zur Anfrage passt.

• Wenn es eine Übereinstimmung gibt, frisch oder abgelaufen, wird sie aus dem Cache zurückgegeben.
• Wenn es keine Übereinstimmung gibt, stellt der Browser eine normale Anfrage und aktualisiert den Cache mit der heruntergeladenen Ressource.

only-if-cached

Der Browser sucht im HTTP-Cache nach einer Antwort, die zur Anfrage passt. Experimentell

• Wenn es eine Übereinstimmung gibt, frisch oder abgelaufen, wird sie aus dem Cache zurückgegeben.
• Wenn es keine Übereinstimmung gibt, wird ein Netzwerkfehler zurückgegeben.

Der "only-if-cached" Modus kann nur verwendet werden, wenn der mode der Anfrage "same-origin" ist. Zwischengespeicherte Weiterleitungen werden gefolgt, wenn die redirect Eigenschaft der Anfrage "follow" ist und die Weiterleitungen den "same-origin" Modus nicht verletzen.

credentials Optional

Kontrolliert, ob der Browser Anmeldedaten mit der Anfrage sendet oder nicht und ob Set-Cookie Antwortheader respektiert werden. Anmeldedaten sind Cookies, TLS Client-Zertifikate oder Authentifizierungsheader, die einen Benutzernamen und ein Passwort enthalten. Diese Option kann einer der folgenden Werte sein:

omit

Niemals Anmeldedaten in der Anfrage senden oder in der Antwort einschließen.

same-origin

Anmeldedaten nur für Anfragen gleicher Herkunft senden und einschließen.

include

Anmeldedaten immer einschließen, auch für Anfragen unterschiedlicher Herkunft.

Das Einschließen von Anmeldedaten in Anfragen unterschiedlicher Herkunft kann eine Seite anfällig für CSRF Angriffe machen, weshalb der Server, selbst wenn credentials auf include gesetzt ist, auch ihrer Einbeziehung zustimmen muss, indem es den Access-Control-Allow-Credentials Header in seiner Antwort einfügt. Zusätzlich muss in diesem Fall der Server explizit den Ursprung des Clients im Access-Control-Allow-Origin Antwortheader angeben (das heißt, * ist nicht erlaubt).

Siehe Including credentials für weitere Details.

Standardmäßig same-origin.

duplex Optional Experimentell

Steuerung des Duplex-Verhaltens der Anfrage. Wenn dies vorhanden ist, muss es den Wert half haben, was bedeutet, dass der Browser die gesamte Anfrage senden muss, bevor er die Antwort verarbeitet.

Diese Option muss vorhanden sein, wenn body ein ReadableStream ist.

headers Optional

Alle Header, die Sie der Anfrage hinzufügen möchten, enthalten innerhalb eines Headers Objekts oder eines Objektliterals, dessen Schlüssel die Header-Namen und dessen Werte die Header-Werte sind.

Viele Header werden automatisch vom Browser gesetzt und können nicht durch ein Skript gesetzt werden: Diese werden als verbotene Anfrage-Header bezeichnet.

Wenn die mode Option auf no-cors gesetzt ist, können Sie nur CORS-safe-list Request-Header setzen.

Siehe Setting headers für weitere Details.

integrity Optional

Enthält den Subresource-Integrität Wert der Anfrage.

Dies wird überprüft, wenn die Ressource abgerufen wird, genauso wie es der Fall wäre, wenn das integrity Attribut auf einem <script> Element gesetzt ist. Der Browser berechnet den Hash der abgerufenen Ressource mit dem angegebenen Algorithmus, und wenn das Ergebnis nicht dem angegebenen Wert entspricht, weist der Browser die Fetch-Anfrage mit einem Netzwerkfehler zurück.

Das Format dieser Option ist <hash-algo>-<hash-source> wobei:

• <hash-algo> einer der folgenden Werte ist: sha256, sha384 oder sha512
• <hash-source> ist die Base64-Kodierung des Ergebnisses der Hash-Berechnung der Ressource mit dem angegebenen Hash-Algorithmus.

Standardmäßig ein leerer String.

keepalive Optional

Ein boolescher Wert. Wenn auf true gesetzt, wird der Browser die zugehörige Anfrage nicht abbrechen, wenn die Seite, die sie initiiert hat, entladen wird, bevor die Anfrage abgeschlossen ist. Dies ermöglicht eine fetch() Anfrage, Analytik am Ende einer Sitzung zu senden, selbst wenn der Benutzer die Seite verlässt oder schließt.

Dies hat einige Vorteile gegenüber der Verwendung von Navigator.sendBeacon() für denselben Zweck. Zum Beispiel können Sie andere HTTP-Methoden als POST verwenden, Anfrageeigenschaften anpassen und auf die Serverantwort über die Erfüllung des Fetch Promise zugreifen. Es steht auch in Service Workern zur Verfügung.

Die Körpergröße für keepalive Anfragen ist auf 64 Kibibyte begrenzt.

Standardmäßig false.

method Optional

Die Anfragemethode.

Standardmäßig GET.

mode Optional

Legt das Cross-Origin-Verhalten für die Anfrage fest. Einer der folgenden Werte:

same-origin

Verhindert Cross-Origin-Anfragen. Wenn eine same-origin Anfrage an einen anderen Ursprung gesendet wird, ist das Ergebnis ein Netzwerkfehler.

cors

Wenn die Anfrage eine Cross-Origin-Anfrage ist, verwendet sie den Cross-Origin Resource Sharing (CORS) Mechanismus. Nur CORS-safelisted response headers werden in der Antwort angezeigt.

no-cors

Deaktiviert CORS für Cross-Origin-Anfragen. Diese Option hat folgende Einschränkungen:

• Die Methode darf nur eine der folgenden sein: HEAD, GET oder POST.
• Die Header dürfen nur CORS-safe-list Request-Header sein, mit der zusätzlichen Einschränkung, dass der Range Header ebenfalls nicht zulässig ist. Dies gilt auch für alle von Service Workern hinzugefügten Header.
• Die Antwort ist opak, das bedeutet, dass ihre Header und ihr Body für JavaScript nicht verfügbar sind und ihr Statuscode immer 0 ist.

Die Hauptanwendung für no-cors ist für einen Service Worker: Auch wenn die Antwort auf eine no-cors Anfrage nicht von JavaScript gelesen werden kann, kann sie von einem Service Worker zwischengespeichert und dann als Antwort auf eine abgefangene Fetch-Anfrage verwendet werden. Beachten Sie, dass Sie in dieser Situation nicht wissen, ob die Anfrage erfolgreich war oder nicht, so dass Sie eine Caching-Strategie verwenden sollten, die es ermöglicht, die zwischengespeicherte Antwort aus dem Netzwerk zu aktualisieren (wie Cache first with cache refresh).

navigate

Wird nur für HTML-Navigationen verwendet. Eine navigate Anfrage wird nur beim Navigieren zwischen Dokumenten erstellt.

Siehe Making cross-origin requests für weitere Details.

Standardmäßig cors.

priority Optional

Gibt die Priorität der Fetch-Anfrage relativ zu anderen Anfragen des gleichen Typs an. Muss einer der folgenden sein:

high

Eine Fetch-Anfrage mit hoher Priorität relativ zu anderen Anfragen des gleichen Typs.

low

Eine Fetch-Anfrage mit niedriger Priorität relativ zu anderen Anfragen des gleichen Typs.

auto

Keine Benutzerpräferenz für die Fetch-Priorität. Wird verwendet, wenn kein Wert gesetzt oder ein ungültiger Wert gesetzt ist.

Standardmäßig auto.

redirect Optional

Bestimmt das Verhalten des Browsers, falls der Server mit einem Umleitungsstatus antwortet. Einer der folgenden Werte:

follow

Umleitungen automatisch folgen.

error

Das Promise mit einem Netzwerkfehler zurückweisen, wenn ein Umleitungsstatus zurückgegeben wird.

manual

Eine Antwort zurückgeben, bei der fast alle Felder herausgefiltert sind, um einem Service Worker zu ermöglichen, die Antwort zu speichern und später erneut abzuspielen.

Standardmäßig follow.

referrer Optional

Ein String, der den Wert angibt, der für den Referer Header der Anfrage verwendet werden soll. Einer der folgenden:

Eine relative oder absolute URL gleicher Herkunft

Den Referer Header auf den angegebenen Wert setzen. Relative URLs werden relativ zu der URL der Seite aufgelöst, die die Anfrage gestellt hat.

Ein leerer String

Den Referer Header weglassen.

about:client

Den Referer Header auf den Standardwert für den Kontext der Anfrage setzen (zum Beispiel die URL der Seite, die die Anfrage gestellt hat).

Standardmäßig about:client.

referrerPolicy Optional

Ein String, der eine Richtlinie für den Referer Header festlegt. Die Syntax und Semantik dieser Option sind genau die gleichen wie für den Referrer-Policy Header.

signal Optional

Ein AbortSignal. Wenn diese Option gesetzt ist, kann die Anfrage durch Aufruf von abort() auf dem entsprechenden AbortController abgebrochen werden.

Beispiele

Optionen in fetch() übergeben

In diesem Beispiel übergeben wir die Optionen method, body und headers direkt in den fetch() Methodenaufruf:

async function post() {
  const response = await fetch("https://example.org/post", {
    method: "POST",
    body: JSON.stringify({ username: "example" }),
    headers: {
      "Content-Type": "application/json",
    },
  });

  console.log(response.status);
}

Optionen in den Request() Konstruktor übergeben

In diesem Beispiel erstellen wir eine Request, wobei wir denselben Satz von Optionen in ihren Konstruktor übergeben und dann die Anfrage an fetch() übergeben:

async function post() {
  const request = new Request("https://example.org/post", {
    method: "POST",
    body: JSON.stringify({ username: "example" }),
    headers: {
      "Content-Type": "application/json",
    },
  });

  const response = await fetch(request);

  console.log(response.status);
}

Optionen sowohl in Request() als auch fetch() übergeben

In diesem Beispiel erstellen wir eine Request, wobei wir die Optionen method, headers und body in ihren Konstruktor übergeben. Anschließend übergeben wir die Anfrage in fetch() zusammen mit den Optionen body und referrer:

async function post() {
  const request = new Request("https://example.org/post", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify({ username: "example1" }),
  });

  const response = await fetch(request, {
    body: JSON.stringify({ username: "example2" }),
    referrer: "",
  });

  console.log(response.status);
}

In diesem Fall wird die Anfrage mit den folgenden Optionen gesendet:

• method: "POST"
• headers: {"Content-Type": "application/json"}
• body: '{"username":"example2"}'
• referrer: ""

Spezifikationen

Siehe auch

• Using Fetch
• ServiceWorker API
• HTTP access control (CORS)
• HTTP