Что такое серверные запросы в Next.js и как они выполняются?

В Next.js запросы могут выполняться на разных этапах жизненного цикла страницы, и серверные запросы — ключевой механизм для SSR, SSG и ISR.

Определение

Определение: серверный запрос — это запрос за данными, который выполняется в Node.js-среде (или edge), а не в браузере пользователя.

Где выполняются серверные запросы

1. SSR

   • На каждый HTTP-запрос пользователя

2. SSG

   • Во время билда

3. ISR

   • По таймеру или при ревалидации

4. Server Components (app router)

   • При рендере компонента на сервере

Пример серверного запроса в app router

const products = await fetch("https://api.example.com/products", {
  cache: "no-store" // отключает кеширование
}).then(r => r.json());

Отличия от клиентских запросов

• Серверные

  • Нет доступа из DevTools браузера

  • Можно использовать API-ключи

  • Данные попадают сразу в HTML

• Клиентские

  • Выполняются после загрузки страницы

  • Видны в сети браузера

  • Часто ухудшают SEO при неправильном использовании

Практические сценарии

• Каталоги, статьи, лендинги → серверные запросы

• Фильтры, интерактив, пользовательские действия → клиентские запросы

Вывод

Серверные запросы в Next.js применяются для безопасной и SEO-дружественной загрузки данных и являются базовым инструментом серверного рендеринга.