Request — Interface · JavaScript-Referenz

Signatur

new Request(input, options)

Beschreibung

Das Request-Interface der Fetch API repräsentiert eine Ressourcen-Anfrage.

Sie können ein neues Request-Objekt mit dem Request()-Konstruktor erstellen, aber häufiger werden Sie einem Request-Objekt begegnen, das als Ergebnis einer anderen API-Operation zurückgegeben wird, wie zum Beispiel einem Service-Worker-FetchEvent.request.

Instanz-Eigenschaften (schreibgeschützt):

Request.body: Ein ReadableStream des Body-Inhalts.
Request.bodyUsed: Speichert true oder false, um anzuzeigen, ob der Body bereits in einer Anfrage verwendet wurde.
Request.cache: Enthält den Cache-Modus der Anfrage (z. B. default, reload, no-cache).
Request.credentials: Enthält einen Wert, der steuert, ob Credentials mit der Anfrage gesendet werden sollen (z. B. omit, same-origin, include). Standard ist same-origin.
Request.destination: Ein String, der den Typ des angeforderten Inhalts beschreibt.
Request.duplex (experimentell): Der Duplex-Modus der Anfrage, der bestimmt, ob der Browser die gesamte Anfrage senden muss, bevor die Antwort verarbeitet wird.
Request.headers: Enthält das zugehörige Headers-Objekt der Anfrage.
Request.integrity: Enthält den Subresource-Integrity-Wert der Anfrage (z. B. sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=).
Request.isHistoryNavigation: Ein boolean, der angibt, ob die Anfrage eine History-Navigation ist.
Request.isReloadNavigation (experimentell): Ein boolean, der angibt, ob die Anfrage ein vom Nutzer ausgelöster Reload ist.
Request.keepalive: 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 auslösende Seite entladen wird, bevor die Anfrage abgeschlossen ist.
Request.method: Enthält die Methode der Anfrage (GET, POST, etc.).
Request.mode: Enthält den Modus der Anfrage (z. B. cors, no-cors, same-origin, navigate).
Request.redirect: Enthält den Modus, wie Redirects behandelt werden. Kann einer von follow, error oder manual sein.
Request.referrer: Enthält den Referrer der Anfrage (z. B. client).
Request.referrerPolicy: Enthält die Referrer-Policy der Anfrage (z. B. no-referrer).
Request.signal: Gibt das mit der Anfrage assoziierte AbortSignal zurück.
Request.targetAddressSpace (experimentell): Gibt den Ziel-Adressraum der Anfrage zurück, der angibt, ob es sich um eine Loopback-, lokale oder öffentliche Anfrage handelt.
Request.url: Enthält die URL der Anfrage.

Instanz-Methoden:

Request.arrayBuffer(): Gibt ein Promise zurück, das mit einer ArrayBuffer-Repräsentation des Anfrage-Bodys aufgelöst wird.
Request.blob(): Gibt ein Promise zurück, das mit einer Blob-Repräsentation des Anfrage-Bodys aufgelöst wird.
Request.bytes(): Gibt ein Promise zurück, das mit einer Uint8Array-Repräsentation des Anfrage-Bodys aufgelöst wird.
Request.clone(): Erstellt eine Kopie des aktuellen Request-Objekts.
Request.formData(): Gibt ein Promise zurück, das mit einer FormData-Repräsentation des Anfrage-Bodys aufgelöst wird.
Request.json(): Gibt ein Promise zurück, das mit dem Ergebnis des Parsens des Anfrage-Bodys als JSON aufgelöst wird.
Request.text(): Gibt ein Promise zurück, das mit einer Text-Repräsentation des Anfrage-Bodys aufgelöst wird.
Request.textStream() (experimentell): Gibt einen ReadableStream zurück, mit dem der Inhalt des Anfrage-Bodys in UTF-8-Chunks gelesen werden kann.

Beispiele

Request erstellen und Eigenschaften auslesen

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

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

Request mit fetch() abrufen

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

POST-Request mit Body-Payload

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;

API-Request abrufen und Antwort verarbeiten

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);
  });

// Wichtig · Fallstricke

Die Body-Funktionen der Anfrage können nur einmal ausgeführt werden; nachfolgende Aufrufe werden mit einem TypeError abgelehnt, der anzeigt, dass der Body-Stream bereits verwendet wurde. Der Body kann nur ein Blob, ein ArrayBuffer, ein TypedArray, ein DataView, ein FormData, ein URLSearchParams, ein ReadableStream oder ein String-Objekt sein, ebenso wie ein String-Literal. Um ein JSON-Objekt als Payload hinzuzufügen, muss dieses Objekt daher stringifiziert werden.

Siehe auch

Request() fetch() Response Headers FetchEvent