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

View in English Always switch to English

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.body Schreibgeschützt

Ein ReadableStream der Inhaltsdaten des Körpers.

Response.bodyUsed Schreibgeschützt

Speichert einen booleschen Wert, der angibt, ob der Körper in einer Antwort bereits verwendet wurde.

Response.headers Schreibgeschützt

Das Headers-Objekt, das mit der Antwort verknüpft ist.

Response.ok Schreibgeschützt

Ein boolescher Wert, der anzeigt, ob die Antwort erfolgreich war (Status im Bereich 200299) oder nicht.

Response.redirected Schreibgeschützt

Gibt an, ob die Antwort das Ergebnis einer Umleitung ist (d.h. ihre URL-Liste mehr als einen Eintrag enthält).

Response.status Schreibgeschützt

Der Statuscode der Antwort. (Dies wird 200 für einen Erfolg sein).

Response.statusText Schreibgeschützt

Die Statusmeldung, die dem Statuscode entspricht. (z. B. OK für 200).

Response.type Schreibgeschützt

Der Typ der Antwort (z. B. basic, cors).

Response.url Schreibgeschü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 JSON auflöst.

Response.text()

Gibt ein Promise zurück, das mit einer Textdarstellung des Antwortkörpers auflöst.

Response.textStream()

Gibt einen ReadableStream zurü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.

js
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:

js
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.

js
// 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

Browser-Kompatibilität

Siehe auch