Что делает метод json() у объекта response в JavaScript

Что проверяют

Понимаете ли вы, что происходит между сетевым ответом и готовым объектом в коде. Следом почти всегда спрашивают, почему fetch не упал на ответе 500 и что будет, если вызвать json() дважды.

Как отвечать

response.json() читает поток тела ответа до конца и разбирает его как JSON. Возвращает промис, который резолвится JavaScript-значением: объектом, массивом, строкой, числом, булевым значением или null. Метод асинхронный, потому что тело приходит по сети частями, а к моменту резолва fetch получены только статус и заголовки.

Ключевые детали:

• ошибка разбора: если тело не валидный JSON, промис отклоняется с SyntaxError. Типичный случай: сервер вернул HTML-страницу ошибки или пустое тело на 204 No Content;
• тело читается один раз: повторный вызов json() или text() даёт TypeError, проверить можно по response.bodyUsed. Если тело нужно дважды, заранее делают response.clone();
• заголовки не проверяются: Content-Type метод игнорирует и просто пытается разобрать то, что пришло;
• HTTP-ошибки не отклоняют промис: fetch падает только при сетевом сбое или отмене, а ответы 404 и 500 резолвятся. Поэтому перед json() проверяют response.ok или response.status;
• соседние методы: text(), blob(), arrayBuffer(), formData() и более свежий bytes(), который отдаёт Uint8Array.

Типовой код на async/await: const res = await fetch(url); if (!res.ok) throw new Error(res.statusText); const data = await res.json();. Отмена через AbortController прерывает и чтение тела, а не только ожидание заголовков.

Плюсом будет упомянуть статический Response.json(data, init). Он ничего не читает, а создаёт ответ с JSON-телом и нужным заголовком. Его используют в Service Worker и в роут-хендлерах Next.js.

Где спотыкаются

Говорят, что json() «преобразует ответ в JSON». Всё наоборот: он превращает JSON-текст в объект JavaScript.

Забывают await и кладут в стейт промис вместо данных, а потом ищут ошибку в рендере.

Логируют тело через res.text(), а следом вызывают res.json() и получают ошибку уже прочитанного потока.