Метод json() , определен на миксине Body, который включён в объектах Request и Response, принимает и читает тело Response stream. Возвращает promise (обещание), который, когда ответ будет получен, вызовет коллбэк с результатом парсинга тела ответа в JSON объект.

Синтаксис

response.json().then(function(data) {
  // do something with your data
});

Аргументы

Нет.

Возвращает

Promise (обещание), который, когда ответ будет получен, вызовет коллбэк с результатом парсинга тела ответа в JSON объект. Этим может быть что угодно, что может быть представлено как JSON объект — объект, массив, строка, число...

Пример

В нашем fetch json примере (запустите fetch json live), мы создаем новый запрос, используя Request.Request конструктор, в последствии мы используем его (запрос) для получения .json файла. Когда fetch запрос будет выполнен, мы прочтем и спарсим данные, используя json(), а далее вставим значения из полученного объекта в list элементы списка для отображения данных по нашему продукту.

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);
    }
  });

Спецификации

Specification Status Comment
Fetch
Определение 'json()' в этой спецификации.
Живой стандарт  

Совместимость с браузерами

ВозможностьChromeEdgeFirefoxInternet ExplorerOperaSafari
Базовая поддержка

42

411

Да

39

342

Нет

29

283

Нет
ВозможностьAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Базовая поддержка Нет Нет Да Нет Нет Нет Нет

1. From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.

2. From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.

3. From version 28: this feature is behind the Experimental Web Platform Features preference.

Смотрите также

Метки документа и участники

Внесли вклад в эту страницу: dasha_hshr
Обновлялась последний раз: dasha_hshr,