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

View in English Always switch to English

Anfrage

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨März 2017⁩.

* Some parts of this feature may have varying levels of support.

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

Das Request Interface der Fetch API repräsentiert eine Ressourcenanfrage.

Sie können ein neues Request Objekt mit dem Request() Konstruktor erstellen. Häufiger werden Sie jedoch ein Request Objekt als Ergebnis einer anderen API-Operation antreffen, zum Beispiel bei einem Service-Worker FetchEvent.request.

Konstruktor

Request()

Erstellt ein neues Request Objekt.

Instanz-Eigenschaften

Request.body Schreibgeschützt

Ein ReadableStream der Inhaltsdaten des Anfragetextes.

Request.bodyUsed Schreibgeschützt

Speichert true oder false, um anzuzeigen, ob der Anfragetext bereits 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 Anmeldeinformationen mit der Anfrage gesendet werden sollen (z.B. omit, same-origin, include). Der Standardwert ist same-origin.

Request.destination Schreibgeschützt

Ein String, der den Typ der angeforderten Inhalte beschreibt.

Request.duplex Schreibgeschützt Experimentell

Der Duplexmodus der Anfrage, der bestimmt, ob der Browser die gesamte Anfrage senden muss, bevor die Antwort verarbeitet wird.

Request.headers Schreibgeschützt

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

Request.integrity Schreibgeschützt

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

Request.isHistoryNavigation Schreibgeschützt

Ein boolescher Wert, der anzeigt, ob die Anfrage eine Verlaufsnavigation ist.

Request.keepalive Schreibgeschützt

Enthält die keepalive Einstellung der Anfrage (true oder false), die angibt, ob der Browser die zugehörige Anfrage am Leben 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, etc.)

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, wie Weiterleitungen behandelt werden sollen. Es 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-Richtlinie der Anfrage (z.B. no-referrer).

Request.signal Schreibgeschützt

Gibt das AbortSignal zurück, das mit der Anfrage verbunden ist.

Request.url Schreibgeschützt

Enthält die URL der Anfrage.

Instanz-Methoden

Request.arrayBuffer()

Gibt ein Promise zurück, das mit einer ArrayBuffer Repräsentation des Anfragetextes erfüllt wird.

Request.blob()

Gibt ein Promise zurück, das mit einer Blob Repräsentation des Anfragetextes erfüllt wird.

Request.bytes()

Gibt ein Promise zurück, das mit einer Uint8Array Repräsentation des Anfragetextes erfüllt wird.

Request.clone()

Erstellt eine Kopie des aktuellen Request Objekts.

Request.formData()

Gibt ein Promise zurück, das mit einer FormData Repräsentation des Anfragetextes erfüllt wird.

Request.json()

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

Request.text()

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

Hinweis: Die Anfragetextfunktionen können nur einmal ausgeführt werden; nachfolgende Aufrufe werden mit TypeError abgelehnt, der zeigt, dass der Textstream bereits verwendet wurde.

Beispiele

Im folgenden Beispiel erstellen wir eine neue Anfrage mit dem Request() Konstruktor (für eine Bilddatei im gleichen Verzeichnis wie das Skript) und rufen dann einige Eigenschaftswerte der Anfrage ab:

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 ausführen, indem Sie das Request Objekt als Parameter an einen fetch() Aufruf übergeben, zum Beispiel:

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

Im folgenden Beispiel erstellen wir eine neue Anfrage mit dem Request() Konstruktor mit einigen Anfangsdaten und Textinhalt für eine API-Anfrage, die eine Nutzlast 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 Text kann nur ein Blob, ein ArrayBuffer, ein TypedArray, ein DataView, ein FormData, ein URLSearchParams, ein ReadableStream, oder ein String Objekt sowie ein Stringliteral sein. Wenn Sie ein JSON-Objekt zur Nutzlast hinzufügen möchten, müssen Sie dieses Objekt in einen String umwandeln.

Sie könnten diese API-Anfrage dann ausführen, indem Sie das Request Objekt als Parameter an einen fetch() Aufruf übergeben, um so die Antwort zu 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

Specification
Fetch
# request-class

Browser-Kompatibilität

Siehe auch