Метод 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()' в этой спецификации.
Живой стандарт  

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

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidEdge MobileFirefox для AndroidOpera для AndroidiOS SafariSamsung Internet
Базовая поддержка
Экспериментальная
Chrome Полная поддержка 42
Полная поддержка 42
Полная поддержка 41
Отключено
Отключено From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Полная поддержка ДаFirefox Полная поддержка 39
Полная поддержка 39
Полная поддержка 34
Отключено
Отключено From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE Нет поддержки НетOpera Полная поддержка 29
Полная поддержка 29
Полная поддержка 28
Отключено
Отключено From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari Нет поддержки НетWebView Android Нет поддержки НетChrome Android Нет поддержки НетEdge Mobile Полная поддержка ДаFirefox Android Нет поддержки НетOpera Android Нет поддержки НетSafari iOS Нет поддержки НетSamsung Internet Android Нет поддержки Нет

Легенда

Полная поддержка  
Полная поддержка
Нет поддержки  
Нет поддержки
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Пользователь должен сам включить эту возможность.
Пользователь должен сам включить эту возможность.

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

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

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