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 stellt eine Ressourcenanfrage dar.
Sie können mit dem Request()-Konstruktor ein neues Request-Objekt erstellen. Häufiger begegnet Ihnen jedoch ein Request-Objekt als Ergebnis eines anderen API-Vorgangs, beispielsweise über FetchEvent.request eines Service Workers.
Konstruktor
Request()-
Erstellt ein neues
Request-Objekt.
Instanzeigenschaften
Request.bodySchreibgeschützt-
Ein
ReadableStreammit dem Inhalt des Anfragebodys. Request.bodyUsedSchreibgeschützt-
Speichert
trueoderfalse, um anzugeben, ob der Anfragebody bereits verwendet wurde. Request.cacheSchreibgeschützt-
Enthält den Cache-Modus der Anfrage (z. B.
default,reload,no-cache). Request.credentialsSchreibgeschützt-
Enthält einen Wert, der steuert, ob Anmeldedaten in die Anfrage aufgenommen werden (z. B.
omit,same-origin,include). Der Standardwert istsame-origin. Request.destinationSchreibgeschützt-
Eine Zeichenfolge, die den Typ des angeforderten Inhalts beschreibt.
Request.duplexSchreibgeschützt-
Der Duplexmodus der Anfrage. Er bestimmt, ob der Browser die gesamte Anfrage senden muss, bevor er die Antwort verarbeitet.
Request.headersSchreibgeschützt-
Enthält das zugehörige
Headers-Objekt der Anfrage. Request.integritySchreibgeschützt-
Enthält den Subresource-Integrity-Wert der Anfrage (z. B.
sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=). -
Ein boolescher Wert, der angibt, ob die Anfrage eine Navigation über den Browserverlauf ist.
-
Ein boolescher Wert, der angibt, ob die Anfrage ein durch einen Benutzer ausgelöstes Neuladen ist.
Request.keepaliveSchreibgeschützt-
Enthält die
keepalive-Einstellung der Anfrage (trueoderfalse). Sie gibt an, ob der Browser die zugehörige Anfrage aufrechterhält, wenn die Seite, die sie ausgelöst hat, vor Abschluss der Anfrage entladen wird. Request.methodSchreibgeschützt-
Enthält die Methode der Anfrage (
GET,POSTusw.). Request.modeSchreibgeschützt-
Enthält den Modus der Anfrage (z. B.
cors,no-cors,same-origin,navigate). Request.redirectSchreibgeschützt-
Enthält den Modus für die Behandlung von Weiterleitungen. Der Wert kann
follow,errorodermanualsein. Request.referrerSchreibgeschützt-
Enthält den Referrer der Anfrage (z. B.
client). Request.referrerPolicySchreibgeschützt-
Enthält die Referrer-Richtlinie der Anfrage (z. B.
no-referrer). Request.signalSchreibgeschützt-
Gibt das mit der Anfrage verknüpfte
AbortSignalzurück. Request.targetAddressSpaceSchreibgeschützt-
Gibt den Zieladressraum der Anfrage zurück. Dieser gibt an, ob die Anfrage an eine Loopback-, lokale oder öffentliche Adresse gerichtet ist.
Request.urlSchreibgeschützt-
Enthält die URL der Anfrage.
Instanzmethoden
Request.arrayBuffer()-
Gibt ein Promise zurück, das mit einer
ArrayBuffer-Repräsentation des Anfragebodys erfüllt wird. Request.blob()-
Gibt ein Promise zurück, das mit einer
Blob-Repräsentation des Anfragebodys erfüllt wird. Request.bytes()-
Gibt ein Promise zurück, das mit einer
Uint8Array-Repräsentation des Anfragebodys 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 Anfragebodys erfüllt wird. Request.json()-
Gibt ein Promise zurück, das mit dem Ergebnis der Verarbeitung des Anfragebodys als
JSONerfüllt wird. Request.text()-
Gibt ein Promise zurück, das mit einer Textrepräsentation des Anfragebodys erfüllt wird.
Request.textStream()-
Gibt einen
ReadableStreamzurück, mit dem der Inhalt des Anfragebodys in UTF-8-Blöcken gelesen werden kann.
Hinweis: Die Funktionen zum Lesen des Anfragebodys können nur einmal ausgeführt werden. Weitere Aufrufe werden mit einem TypeError zurückgewiesen, der angibt, dass der Body-Stream bereits verwendet wurde.
Beispiele
Im folgenden Codeausschnitt erstellen wir mit dem Request()-Konstruktor eine neue Anfrage für eine Bilddatei im selben Verzeichnis wie das Skript und geben anschließend einige Eigenschaftswerte der Anfrage zurück:
const request = new Request("https://www.mozilla.org/favicon.ico");
const url = request.url;
const method = request.method;
const credentials = request.credentials;
Sie können diese Anfrage dann beispielsweise abrufen, indem Sie das Request-Objekt als Parameter an einen fetch()-Aufruf übergeben:
fetch(request)
.then((response) => response.blob())
.then((blob) => {
image.src = URL.createObjectURL(blob);
});
Im folgenden Codeausschnitt erstellen wir mit dem Request()-Konstruktor eine neue API-Anfrage mit einigen Anfangsdaten und einem Anfragebody, da die Anfrage einen Body-Payload benötigt:
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-, ArrayBuffer-, TypedArray-, DataView-, FormData-, URLSearchParams-, ReadableStream- oder String-Objekt oder ein Zeichenfolgenliteral sein. Um dem Payload ein JSON-Objekt hinzuzufügen, müssen Sie dieses Objekt daher in eine Zeichenfolge umwandeln.
Sie können diese API-Anfrage dann beispielsweise abrufen und die Antwort erhalten, indem Sie das Request-Objekt als Parameter an einen fetch()-Aufruf übergeben:
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 |