Урок: проверить тип ответа до чтения JSON

Назначение

Endpoint, от которого ожидается JSON, иногда возвращает HTML ошибки или страницу входа. Проверка статуса и объявленного медиатипа помогает объяснить проблему до попытки разобрать неожиданное тело.

Как это работает

Создайте lesson.json в своём HTTP-проекте и настройте Content-Type:application/json. Код выполняет только GET этого локального ресурса. Для данного упражнения контракт намеренно принимает только application/json.

Пример

const readLesson = async () => {
  const response = await fetch("./lesson.json");
  if (!response.ok) throw new Error(`HTTP ${response.status}`);
  const type = (response.headers.get("content-type") ?? "").split(";", 1)[0].trim().toLowerCase();
  if (type !== "application/json") throw new Error("Ожидался application/json");
  const data = await response.json();
  console.log(data);
};
readLesson().catch(error => console.error(error.message));

Что должно получиться

Корректный ответ разбирается и выводится. Ответ с другим типом отклоняется понятной ошибкой. Даже правильный Content-Type не гарантирует валидность JSON, поэтому ошибка разбора тоже попадёт в catch.

Граница применения и частая ошибка

API могут использовать application/problem+json и другие согласованные +json-типы: расширяйте проверку по реальному контракту. После успешного разбора всё равно нужна проверка структуры данных. Не выводите тело ошибки целиком, если оно может содержать чувствительную информацию.

Самостоятельная проверка

Проверьте корректный JSON, ошибку 404 и HTML с кодом 200 в своём тестовом проекте. Затем испортите синтаксис JSON при правильном заголовке. Запишите, на каком шаге обнаруживается каждый случай.

Связанные материалы

• Панель Network
• Локальная страница
• Повторная проверка