Response: Statische Methode json()

Syntax

Response.json(data)
Response.json(data, options)

Parameter

data

Die JSON-Daten, die als Body der Antwort verwendet werden.

options Optional

Ein Optionsobjekt mit Einstellungen für die Antwort, einschließlich Statuscode, Statustext und Headern. Es entspricht dem Optionsparameter des Konstruktors Response().

status

Der Statuscode der Antwort, beispielsweise 200.

statusText

Der zum Statuscode gehörende Statustext. Bei einem Status von 200 könnte dies OK sein.

headers

Zusätzliche Header für die Antwort, angegeben als Headers-Objekt oder als Objektliteral mit String-Schlüssel-Wert-Paaren (siehe HTTP-Header als Referenz).

Rückgabewert

Ein Response-Objekt.

Ausnahmen

TypeError

Wird ausgelöst, wenn data nicht in einen JSON-String umgewandelt werden kann. Dies kann beispielsweise passieren, wenn die Daten ein JavaScript-Objekt mit einer Methode oder einem zirkulären Verweis sind oder wenn das übergebene Objekt undefined ist.

Beispiele

Antwort mit JSON-Daten

Dieses interaktive Beispiel zeigt, wie Sie ein JSON-Antwortobjekt erstellen. Das neu erstellte Objekt wird zur Überprüfung protokolliert (der dafür zuständige Code ist ausgeblendet, da er hier nicht relevant ist).

<pre id="log"></pre>

const logElement = document.getElementById("log");
function log(text) {
  logElement.innerText += `${text}\n`;
}

async function logResponse(response) {
  const responseText = await response.text();
  log(`body: ${responseText}`);
  response.headers.forEach((header) => log(`header: ${header}`));
  log(`status: ${response.status}`);
  log(`statusText: ${response.statusText}`);
  log(`type: ${response.type}`);
  log(`url: ${response.url}`);
  log(`ok: ${response.ok}`);
  log(`redirected: ${response.redirected}`);
  log(`bodyUsed: ${response.bodyUsed}`);
}

Der folgende Code erstellt ein Response-Objekt mit dem JSON-Body { my: "data" } und einem auf application/json gesetzten Header.

const jsonResponse = Response.json({ my: "data" });
logResponse(jsonResponse);

Das Objekt hat die folgenden Eigenschaften. Beachten Sie, dass Body und Header wie erwartet gesetzt sind und der Standardstatus 200 ist.

Antwort mit JSON-Daten und Optionen

Dieses Beispiel zeigt, wie Sie ein JSON-Antwortobjekt mit den Optionen status und statusText erstellen.

<pre id="log"></pre>

const logElement = document.getElementById("log");
function log(text) {
  logElement.innerText += `${text}\n`;
}

async function logResponse(response) {
  const responseText = await response.text();
  log(`body: ${responseText}`);
  response.headers.forEach((header) => log(`header: ${header}`));
  log(`status: ${response.status}`);
  log(`statusText: ${response.statusText}`);
  log(`type: ${response.type}`);
  log(`url: ${response.url}`);
  log(`ok: ${response.ok}`);
  log(`redirected: ${response.redirected}`);
  log(`bodyUsed: ${response.bodyUsed}`);
}

Der folgende Code erstellt ein Response-Objekt mit dem JSON-Body { some: "data", more: "information" } und einem auf application/json gesetzten Header. Außerdem setzt er den Status auf 307 und den zugehörigen Statustext („Temporary Redirect“).

const jsonResponse = Response.json(
  { some: "data", more: "information" },
  { status: 307, statusText: "Temporary Redirect" },
);
logResponse(jsonResponse);

Das Objekt hat die folgenden Eigenschaften, die wie erwartet gesetzt sind. Beachten Sie, dass die Eigenschaft ok der Antwort auf false gesetzt ist, da der Statuswert nicht im Bereich von 200 bis 299 liegt.

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Service Worker API