Response
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.
Das Response-Interface der Fetch API repräsentiert die Antwort auf eine Anfrage.
Sie können ein neues Response-Objekt mit dem Response()-Konstruktor erstellen, aber es ist wahrscheinlicher, dass Sie auf ein Response-Objekt stoßen, das als Ergebnis einer anderen API-Operation zurückgegeben wird — zum Beispiel ein Service Worker FetchEvent.respondWith oder ein einfacher fetch().
Konstruktor
Response()-
Erstellt ein neues
Response-Objekt.
Instanzeigenschaften
Response.bodySchreibgeschützt-
Ein
ReadableStreamder Inhaltsdaten des Körpers. Response.bodyUsedSchreibgeschützt-
Speichert einen booleschen Wert, der angibt, ob der Körper in einer Antwort bereits verwendet wurde.
Response.headersSchreibgeschützt-
Das
Headers-Objekt, das mit der Antwort verknüpft ist. Response.okSchreibgeschützt-
Ein boolescher Wert, der anzeigt, ob die Antwort erfolgreich war (Status im Bereich
200–299) oder nicht. Response.redirectedSchreibgeschützt-
Gibt an, ob die Antwort das Ergebnis einer Umleitung ist (d.h. ihre URL-Liste mehr als einen Eintrag enthält).
Response.statusSchreibgeschützt-
Der Statuscode der Antwort. (Dies wird
200für einen Erfolg sein). Response.statusTextSchreibgeschützt-
Die Statusmeldung, die dem Statuscode entspricht. (z. B.
OKfür200). Response.typeSchreibgeschützt-
Der Typ der Antwort (z. B.
basic,cors). Response.urlSchreibgeschützt-
Die URL der Antwort.
Statische Methoden
Response.error()-
Gibt ein neues
Response-Objekt zurück, das mit einem Netzwerkfehler verknüpft ist. Response.redirect()-
Gibt eine neue Antwort mit einer anderen URL zurück.
Response.json()-
Gibt ein neues
Response-Objekt zurück, um die bereitgestellten JSON-kodierten Daten zu liefern.
Instanzmethoden
Response.arrayBuffer()-
Gibt ein Promise zurück, das mit einer
ArrayBuffer-Darstellung des Antwortkörpers auflöst. Response.blob()-
Gibt ein Promise zurück, das mit einer
Blob-Darstellung des Antwortkörpers auflöst. Response.bytes()-
Gibt ein Promise zurück, das mit einer
Uint8Array-Darstellung des Antwortkörpers auflöst. Response.clone()-
Erstellt einen Klon eines
Response-Objekts. Response.formData()-
Gibt ein Promise zurück, das mit einer
FormData-Darstellung des Antwortkörpers auflöst. Response.json()-
Gibt ein Promise zurück, das mit dem Ergebnis der Analyse des Antwortkörpers als
JSONauflöst. Response.text()-
Gibt ein Promise zurück, das mit einer Textdarstellung des Antwortkörpers auflöst.
Response.textStream()-
Gibt einen
ReadableStreamzurück, der verwendet werden kann, um die Inhalte des Antwortkörpers in UTF-8-Teilen zu lesen.
Beispiele
>Ein Bild abrufen
In unserem Basis-Fetch-Beispiel (Beispiel live ausführen) verwenden wir einen einfachen fetch()-Aufruf, um ein Bild abzurufen und es in einem <img>-Element anzuzeigen.
Der fetch()-Aufruf gibt ein Promise zurück, das sich zu dem Response-Objekt auflöst, das mit dem Abruf der Ressource verknüpft ist.
Sie werden feststellen, dass wir, da wir ein Bild anfordern, Response.blob ausführen müssen, um der Antwort den korrekten MIME-Typ zu geben.
const image = document.querySelector(".my-image");
fetch("flowers.jpg")
.then((response) => {
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
return response.blob();
})
.then((blob) => {
const objectURL = URL.createObjectURL(blob);
image.src = objectURL;
})
.catch((error) => {
console.error("Error fetching the image:", error);
});
Sie können auch den Response()-Konstruktor verwenden, um Ihr eigenes benutzerdefiniertes Response-Objekt zu erstellen:
const response = new Response();
Ein PHP-Aufruf
Hier rufen wir eine PHP-Programmdatei auf, die einen JSON-String generiert und das Ergebnis als JSON-Wert anzeigt.
// Function to fetch JSON using PHP
const getJSON = async () => {
// Generate the Response object
const response = await fetch("getJSON.php");
if (response.ok) {
// Get JSON value from the response body
return response.json();
}
throw new Error("*** PHP file not found");
};
// Call the function and output value or error message to console
getJSON()
.then((result) => console.log(result))
.catch((error) => console.error(error));
Spezifikationen
| Spezifikation |
|---|
| Fetch> # response-class> |