Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

Request

Baseline
Weitgehend verfügbar
*

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit März 2017 browserübergreifend verfügbar.

* Einige Teile dieser Funktion werden möglicherweise unterschiedlich gut unterstützt.

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Die Request-Schnittstelle der Fetch API repräsentiert eine Ressourcenanfrage.

Sie können mit dem Konstruktor Request() ein neues Request-Objekt erstellen, werden aber eher einem Request-Objekt begegnen, das als Ergebnis einer anderen API-Operation zurückgegeben wird, etwa FetchEvent.request eines Service Workers.

Konstruktor

Request()

Erstellt ein neues Request-Objekt.

Instanzeigenschaften

Request.body Schreibgeschützt

Ein ReadableStream mit dem Inhalt des Body.

Request.bodyUsed Schreibgeschützt

Speichert true oder false, um anzugeben, ob der Body bereits in einer Anfrage verwendet wurde.

Request.cache Schreibgeschützt

Enthält den Cache-Modus der Anfrage (z. B. default, reload, no-cache).

Request.credentials Schreibgeschützt

Enthält einen Wert, der steuert, ob Credentials in die Anfrage eingeschlossen werden sollen (z. B. omit, same-origin, include). Der Standardwert ist same-origin.

Request.destination Schreibgeschützt

Ein String, der den Typ des angeforderten Inhalts beschreibt.

Request.duplex Schreibgeschützt

Der Duplex-Modus der Anfrage, der bestimmt, ob der Browser die gesamte Anfrage senden muss, bevor er die Antwort verarbeitet.

Request.headers Schreibgeschützt

Enthält das zugehörige Headers-Objekt der Anfrage.

Request.integrity Schreibgeschützt

Enthält den Wert für Subresource Integrity der Anfrage (z. B. sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=).

Request.isHistoryNavigation Schreibgeschützt

Ein boolescher Wert, der angibt, ob die Anfrage eine Verlauf-Navigation ist.

Request.isReloadNavigation Schreibgeschützt

Ein boolescher Wert, der angibt, ob die Anfrage ein vom Benutzer ausgelöstes Neuladen ist.

Request.keepalive Schreibgeschützt

Enthält die keepalive-Einstellung der Anfrage (true oder false), die angibt, ob der Browser die zugehörige Anfrage aktiv hält, wenn die Seite, die sie initiiert hat, entladen wird, bevor die Anfrage abgeschlossen ist.

Request.method Schreibgeschützt

Enthält die Methode der Anfrage (GET, POST usw.).

Request.mode Schreibgeschützt

Enthält den Modus der Anfrage (z. B. cors, no-cors, same-origin, navigate).

Request.redirect Schreibgeschützt

Enthält den Modus für die Behandlung von Weiterleitungen. Er kann follow, error oder manual sein.

Request.referrer Schreibgeschützt

Enthält den Referrer der Anfrage (z. B. client).

Request.referrerPolicy Schreibgeschützt

Enthält die Referrer-Policy der Anfrage (z. B. no-referrer).

Request.signal Schreibgeschützt

Gibt das mit der Anfrage verknüpfte AbortSignal zurück.

Request.targetAddressSpace Schreibgeschützt

Gibt den Zieladressraum der Anfrage zurück, der angibt, ob es sich um eine Loopback-, lokale oder öffentliche Anfrage handelt.

Request.url Schreibgeschützt

Enthält die URL der Anfrage.

Instanzmethoden

Request.arrayBuffer()

Gibt ein Promise zurück, das mit einer ArrayBuffer-Darstellung des Anfrage-Body erfüllt wird.

Request.blob()

Gibt ein Promise zurück, das mit einer Blob-Darstellung des Anfrage-Body erfüllt wird.

Request.bytes()

Gibt ein Promise zurück, das mit einer Uint8Array-Darstellung des Anfrage-Body erfüllt wird.

Request.clone()

Erstellt eine Kopie des aktuellen Request-Objekts.

Request.formData()

Gibt ein Promise zurück, das mit einer FormData-Darstellung des Anfrage-Body erfüllt wird.

Request.json()

Gibt ein Promise zurück, das mit dem Ergebnis des Parsens des Anfrage-Body als JSON erfüllt wird.

Request.text()

Gibt ein Promise zurück, das mit einer Textdarstellung des Anfrage-Body erfüllt wird.

Request.textStream()

Gibt einen ReadableStream zurück, der verwendet werden kann, um den Inhalt des Anfrage-Body in UTF-8-Blöcken zu lesen.

Hinweis: Die Funktionen für den Anfrage-Body können nur einmal ausgeführt werden; nachfolgende Aufrufe werden mit einem TypeError abgelehnt, der anzeigt, dass der Body-Stream bereits verwendet wurde.

Beispiele

Im folgenden Snippet erstellen wir mit dem Konstruktor Request() eine neue Anfrage (für eine Bilddatei im selben Verzeichnis wie das Skript) und geben dann einige Eigenschaftswerte der Anfrage zurück:

js
const request = new Request("https://www.mozilla.org/favicon.ico");

const url = request.url;
const method = request.method;
const credentials = request.credentials;

Sie könnten diese Anfrage dann abrufen, indem Sie das Request-Objekt als Parameter an einen Aufruf von fetch() übergeben, zum Beispiel:

js
fetch(request)
  .then((response) => response.blob())
  .then((blob) => {
    image.src = URL.createObjectURL(blob);
  });

Im folgenden Snippet erstellen wir mit dem Konstruktor Request() eine neue Anfrage mit einigen Anfangsdaten und Body-Inhalten für eine API-Anfrage, die eine Body-Payload benötigt:

js
const request = new Request("https://example.com", {
  method: "POST",
  body: '{"foo": "bar"}',
});

const url = request.url;
const method = request.method;
const credentials = request.credentials;
const bodyUsed = request.bodyUsed;

Hinweis: Der Body kann nur ein Blob, ein ArrayBuffer, ein TypedArray, ein DataView, ein FormData, ein URLSearchParams, ein ReadableStream oder ein String-Objekt sowie ein String-Literal sein. Um ein JSON-Objekt zur Payload hinzuzufügen, müssen Sie dieses Objekt daher in einen String umwandeln.

Sie könnten diese API-Anfrage dann abrufen, indem Sie das Request-Objekt als Parameter an einen Aufruf von fetch() übergeben, und beispielsweise die Antwort erhalten:

js
fetch(request)
  .then((response) => {
    if (response.status !== 200) {
      throw new Error("Something went wrong on API server!");
    }
    return response.json();
  })
  .then((response) => {
    console.debug(response);
    // …
  })
  .catch((error) => {
    console.error(error);
  });

Spezifikationen

Spezifikation
Fetch
# request-class

Browser-Kompatibilität

Siehe auch