Response

Die Response Schnittstelle der Fetch API stellt die Antwort auf eine Anfrage dar.

Sie können ein neues Response-Objekt mithilfe des Konstruktors Response.Response() erstellen. Es ist jedoch wahrscheinlicher, dass Sie ein Response-Objekt als Rückgabewert einer API Operation erhalten, z. B. durch einen Service Worker Fetchevent.respondWith oder ein simples GlobalFetch.fetch().

Konstruktor

Response()

Erstell ein neues Response Objekt.

Eigenschaften

Response.headers Schreibgeschützt

Enthält das Headers Objekt der Antwort.

Response.ok Schreibgeschützt

Enthält einen boolschen Wert, ob die anfrage Erfolgreich war (Status im Bereich von 200-299) oder nicht.

Response.redirected Schreibgeschützt

Gibt an, ob die Antwort das Ergebnis einer Weiterleitung ist, d. h. die URL-Liste enthält mehrere Einträge.

Response.status Schreibgeschützt

Enthält den Status-Code der Antwort (z. B. 200 bei Erfolg).

Response.statusText Schreibgeschützt

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

Response.type Schreibgeschützt

Enthält den Typ der Antwort (z. B. basic, cors).

Response.url Schreibgeschützt

Enthält die URL der Antwort.

Response.useFinalURL

Enthält einen booleschen Wert, der angibt, ob dies die endgültige URL der Antwort ist.

Response implementiert Body, daher stehen darüber hinaus auch folgende Eigenschaften zur Verfügung:

Body.body Schreibgeschützt

Ein einfacher Getter, der verwendet wird, um einen ReadableStream des Body-Inhalts verfügbar zu machen.

Body.bodyUsed Schreibgeschützt

Speichert einen Boolean, der angibt, ob der Body bereits in einer Antwort verwendet wurde.

Methoden

Response.clone()

Klont Response Objekt.

Response.error()

Gibt ein neues Response Objekt zurück, das einem Netzwerkfehler zugeordnet ist.

Response.redirect()

Erstellt eine neue Antwort mit einer anderen URL.

Response implementiert Body, daher stehen darüber hinaus auch folgende Methoden zur Verfügung:

Body.arrayBuffer()

Nimmt einen Response Stream und liest ihn bis zum Ende. Gibt ein Promise zurück, welches in einen ArrayBuffer aufgelöst wird.

Body.blob()

Nimmt einen Response Stream und liest ihn bis zum Ende. Gibt ein Promise zurück, welches in einen Blob aufgelöst wird.

Body.formData()

Nimmt einen Response Stream und liest ihn bis zum Ende. Gibt ein Promise zurück, welches in einen FormData Objekt aufgelöst wird.

Body.json()

Nimmt einen Response Stream und liest ihn bis zum Ende. Gibt ein Promise zurück, welches den Inhalt des Body als JSON einliest.

Body.text()

Nimmt einen Response Stream und liest ihn bis zum Ende. Gibt ein Promise zurück, welches in einen USVString (Text) aufgelöst wird.

Beispiele

In unserem grundlegenden Beispiel zu Fetch (Beispiel live ausführen) verwenden wir einen einfachen Aufruf von fetch(), um ein Bild abzurufen und es in einem <img> Tag anzuzeigen. Der Aufruf von fetch() gibt ein Promise zurück, das zu einem Response Objekt aufgelöst wird, welches mit der Anforderung der Ressource verknüpft ist. Da wir ein Bild anfordern, werden Sie feststellen, dass wir Body.blob ausführen müssen (Response implementiert Body), um der Antwort den richtigen MIME-Type zuzuordnen.

const image = document.querySelector('.my-image');
fetch('flowers.jpg').then(function(response) {
  return response.blob();
}).then(function(blob) {
  const objectURL = URL.createObjectURL(blob);
  image.src = objectURL;
});

Sie können auch den Response.Response() Konstruktor verwenden, um Ihr eigenes benutzerdefiniertes Response Objekt zu erstellen:

const response = new Response();

Spezifikationen

Browserkompatibilität

Siehe auch

• ServiceWorker API
• HTTP access control (CORS)
• HTTP