Какие знаешь группы статусов кода?

Группы статусов HTTP-кодов

HTTP-статусы (или коды состояния) делятся на пять основных групп, определяемых первой цифрой трёхзначного кода (от 1xx до 5xx). Каждая группа обозначает определённый класс ответа сервера. Понимание этих групп критически важно для фронтенд-разработчика, так как от этого зависит корректная обработка ответов от API, построение логики взаимодействия с бэкендом и улучшение пользовательского опыта (UX).

1. Информационные коды (100–199) – 1xx

Эти статусы являются промежуточными и информируют клиент о том, что запрос принят и обработка продолжается. Обычно они не отображаются пользователю в браузере напрямую, но могут использоваться на уровне протокола.

• 100 Continue: Сервер получил заголовки запроса, клиент может продолжать отправлять тело запроса. Часто используется при отправке больших данных (например, файлов).
• 101 Switching Protocols: Сервер соглашается переключить протокол по запросу клиента (например, с HTTP на WebSocket).
• 102 Processing: Сервер обрабатывает запрос, но обработка ещё не завершена. Используется для предотвращения таймаута.

HTTP/1.1 100 Continue

2. Успешные коды (200–299) – 2xx

Наиболее желанная группа для фронтенда. Говорит о том, что запрос был успешно получен, понят и обработан. С этими статусами приходит полезная нагрузка (данные).

• 200 OK: Стандартный ответ на успешные GET, POST, PUT или DELETE запросы. В теле ответа содержатся запрошенные данные.
• 201 Created: Запрос успешен и в результате был создан новый ресурс (часто после POST). В заголовке Location может быть указан URI нового ресурса.
• 204 No Content: Сервер успешно обработал запрос, но не возвращает никакого контента в теле ответа (например, после успешного DELETE или некоторых POST/PUT запросов). Это важный статус для операций, где ответ не нужен.
• 206 Partial Content: Сервер возвращает только часть контента (используется для докачки файлов, потокового видео).

// Пример обработки успешного ответа на фронтенде
fetch('/api/user')
  .then(response => {
    if (response.ok) { // response.ok проверяет статусы в диапазоне 200-299
      return response.json();
    }
    throw new Error(`Ошибка HTTP: ${response.status}`);
  })
  .then(data => console.log('Данные пользователя:', data));

3. Коды перенаправления (300–399) – 3xx

Указывают клиенту, что для завершения операции требуются дополнительные действия, обычно ещё один запрос к другому URI. Браузер часто обрабатывает их автоматически, но фронтенд-разработчик должен уметь с ними работать вручную.

• 301 Moved Permanently: Запрошенный ресурс навсегда перемещён на новый URI.
• 302 Found (или 307 Temporary Redirect): Ресурс временно доступен по другому адресу.
• 304 Not Modified: Используется для кэширования. Говорит клиенту, что можно использовать сохранённую в кэше версию, так как ресурс не изменился.

// Пример: настройка fetch для следовать или не следовать редиректам
fetch('/old-url', {
  redirect: 'manual' // 'follow' (по умолчанию), 'error', 'manual'
});

4. Коды ошибок клиента (400–499) – 4xx

Статусы этой группы указывают, что ошибка кроется на стороне клиента. Запрос содержит некорректный синтаксис или не может быть выполнен. Фронтенд-разработчик должен корректно обрабатывать эти ошибки, чтобы информировать пользователя.

• 400 Bad Request: Общая ошибка из-за неверного синтаксиса запроса (например, некорректный JSON в теле POST).
• 401 Unauthorized: Требуется аутентификация. Часто означает, что токен доступа не предоставлен или устарел.
• 403 Forbidden: Сервер понял запрос, но отказывается его авторизовать (нет прав доступа).
• 404 Not Found: Сервер не может найти запрашиваемый ресурс.
• 429 Too Many Requests: Клиент отправил слишком много запросов за короткое время (реализация rate limiting).

// Пример обработки ошибок 4xx на фронтенде
async function fetchData() {
  try {
    const response = await fetch('/api/protected-data', {
      headers: { 'Authorization': `Bearer ${token}` }
    });

    if (response.status === 401) {
      // Токен устарел — пробуем обновить
      await refreshToken();
      return fetchData();
    }
    if (response.status === 403) {
      // Показываем пользователю сообщение об отсутствии прав
      showErrorModal('У вас недостаточно прав для этого действия.');
      return;
    }
    if (!response.ok) {
      throw new Error(`Клиентская ошибка: ${response.status}`);
    }

    const data = await response.json();
    // ... обработка данных
  } catch (error) {
    console.error('Ошибка запроса:', error);
  }
}

5. Коды ошибок сервера (500–599) – 5xx

Эти статусы означают, что сервер не смог выполнить корректный запрос из-за внутренней ошибки. Проблема не на стороне клиента. На фронтенде такие ошибки требуют особого UX — уведомления пользователя о временных неполадках.

• 500 Internal Server Error: Общая ошибка сервера, когда он столкнулся с неожиданной ситуацией.
• 502 Bad Gateway: Сервер, действуя как шлюз или прокси, получил недействительный ответ от вышестоящего сервера.
• 503 Service Unavailable: Сервер временно не может обрабатывать запросы (перегрузка, техобслуживание).
• 504 Gateway Timeout: Сервер, выступая в роли шлюза, не дождался ответа от вышестоящего сервера.

Важно для фронтенда: Для статусов 4xx и 5xx ответ response.ok в Fetch API будет иметь значение false, что позволяет централизованно обрабатывать ошибки в interceptors (например, в Axios) или при помощи проверки if (!response.ok).

Понимание и грамотная обработка каждой группы статусов позволяет создавать отказоустойчивые, понятные для пользователя приложения, которые корректно ведут себя в любых сценариях сетевого взаимодействия.