Baseline Widely available
Note: This feature is available in Web Workers.
The json()
method of the Response
interface takes a Response
stream and reads it to completion. It returns a promise which resolves with the result of parsing the body text as JSON
.
Note that despite the method being named json()
, the result is not JSON but is instead the result of taking JSON as input and parsing it to produce a JavaScript object.
None.
Return valueA Promise
that resolves to a JavaScript object. This object could be anything that can be represented by JSON â an object, an array, a string, a numberâ¦
DOMException
AbortError
The request was aborted.
TypeError
Thrown for one of the following reasons:
Content-Encoding
header is incorrect).SyntaxError
The response body cannot be parsed as JSON.
In our fetch JSON example (run fetch JSON live), we create a new request using the Request()
constructor, then use it to fetch a .json
file. When the fetch is successful, we read and parse the data using json()
, then read values out of the resulting objects as you'd expect and insert them into list items to display our product data.
const myList = document.querySelector("ul");
const myRequest = new Request("products.json");
fetch(myRequest)
.then((response) => response.json())
.then((data) => {
for (const product of data.products) {
const listItem = document.createElement("li");
listItem.appendChild(document.createElement("strong")).textContent =
product.Name;
listItem.append(` can be found in ${product.Location}. Cost: `);
listItem.appendChild(document.createElement("strong")).textContent =
`£${product.Price}`;
myList.appendChild(listItem);
}
})
.catch(console.error);
Specifications Browser compatibility See also
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.3