The json()
method
of the Body
mixin takes a Response
stream and reads it to completion. It returns a promise that resolves with the result of parsing the body text as JSON
.
Syntax
response.json().then(function(data) { // do something with your data });
Parameters
None.
Returns
A promise that resolves with the result of parsing the body text as JSON. This could be anything that can be represented by JSON — an object, an array, a string, a number...
Example
In our fetch json example (run fetch json live), we create a new request using the Request.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.
var myList = document.querySelector('ul'); var myRequest = new Request('products.json'); fetch(myRequest) .then(function(response) { return response.json(); }) .then(function(data) { for (var i = 0; i < data.products.length; i++) { var listItem = document.createElement('li'); listItem.innerHTML = '<strong>' + data.products[i].Name + '</strong> can be found in ' + data.products[i].Location + '. Cost: <strong>£' + data.products[i].Price + '</strong>'; myList.appendChild(listItem); } });
Specifications
Specification | Status | Comment |
---|---|---|
Fetch The definition of 'json()' in that specification. |
Living Standard |
Browser compatibility
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support | 42 [1] |
(Yes) | 39 (39) [2] | No support |
29 [3] |
No support |
Feature | Android | Edge | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Phone | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|---|
Basic support | No support | (Yes) | No support | No support | No support | No support | No support | No support |
[1] Behind a preference in version 41.
[2] Behind a preference starting with version 34.
[3] Behind a preference in version 28.