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.

Vollständige Kompatibilität anzeigen
Mehr erfahren

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Die Schnittstelle Response der Fetch API repräsentiert die Antwort auf eine Anfrage.

Sie können mit dem Konstruktor Response() ein neues Response-Objekt erstellen. Wahrscheinlicher werden Sie jedoch auf ein Response-Objekt stoßen, das als Ergebnis einer anderen API-Operation zurückgegeben wird – beispielsweise durch FetchEvent.respondWith eines Service Workers oder durch einen einfachen Aufruf von fetch().

Konstruktor

Response(): Erstellt ein neues Response-Objekt.

Instanzeigenschaften

Response.body Schreibgeschützt: Ein ReadableStream mit dem Inhalt des Body.
Response.bodyUsed Schreibgeschützt: Speichert einen booleschen Wert, der angibt, ob der Body in einer Response bereits verwendet wurde.
Response.headers Schreibgeschützt: Das der Response zugeordnete Headers-Objekt.
Response.ok Schreibgeschützt: Ein boolescher Wert, der angibt, ob die Response erfolgreich war (Status im Bereich 200 – 299) oder nicht.
Response.redirected Schreibgeschützt: Gibt an, ob die Response das Ergebnis einer Weiterleitung ist oder nicht (d.h. ihre URL-Liste enthält mehr als einen Eintrag).
Response.status Schreibgeschützt: Der Statuscode der Response. (Bei Erfolg ist dies 200.)
Response.statusText Schreibgeschützt: Die dem Statuscode entsprechende Statusmeldung (z. B. OK für 200).
Response.type Schreibgeschützt: Der Typ der Response (z. B. basic, cors).
Response.url Schreibgeschützt: Die URL der Response.

Statische Methoden

Response.error(): Gibt ein neues Response-Objekt zurück, das mit einem Netzwerkfehler verknüpft ist.
Response.redirect(): Gibt eine neue Response mit einer anderen URL zurück.
Response.json(): Gibt ein neues Response-Objekt zurück, um die bereitgestellten JSON-kodierten Daten zurückzugeben.

Instanzmethoden

Response.arrayBuffer(): Gibt ein Promise zurück, das mit einer ArrayBuffer-Darstellung des Response-Body erfüllt wird.
Response.blob(): Gibt ein Promise zurück, das mit einer Blob-Darstellung des Response-Body erfüllt wird.
Response.bytes(): Gibt ein Promise zurück, das mit einer Uint8Array-Darstellung des Response-Body erfüllt wird.
Response.clone(): Erstellt eine Kopie eines Response-Objekts.
Response.formData(): Gibt ein Promise zurück, das mit einer FormData-Darstellung des Response-Body erfüllt wird.
Response.json(): Gibt ein Promise zurück, das mit dem Ergebnis des Parsens des Response-Body-Texts als JSON erfüllt wird.
Response.text(): Gibt ein Promise zurück, das mit einer Textdarstellung des Response-Body erfüllt wird.
Response.textStream(): Gibt einen ReadableStream zurück, der verwendet werden kann, um den Inhalt des Response-Body in UTF-8-Chunks zu lesen.

Beispiele

Abrufen eines Bildes

In unserem einfachen Fetch-Beispiel (Beispiel live ausführen) verwenden wir einen einfachen Aufruf von fetch(), um ein Bild abzurufen und es in einem <img>-Element anzuzeigen. Der Aufruf von fetch() gibt ein Promise zurück, das mit dem Response-Objekt erfüllt wird, das mit dem Abrufvorgang der Ressource verknüpft ist.

Sie werden feststellen, dass wir, da wir ein Bild anfordern, Response.blob ausführen müssen, um der Response den korrekten MIME-Typ zuzuweisen.

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 den Konstruktor Response() auch 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 erzeugt, und zeigen das Ergebnis als JSON-Wert an.

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

Help improve MDN

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden