Рендеринг на стороне сервера (SSR)

Также известен как "SSR" или "Динамический рендеринг (Dynamic Rendering)".

Если страница использует рендеринг на стороне сервера (SSR), её HTML генерируется при каждом запросе.

Чтобы использовать SSR для страницы, необходимо экспортировать async функцию getServerSideProps. Эта функция будет вызываться сервером при каждом запросе.

Например, предположим, что ваша страница должна предварительно рендерить часто обновляемые данные (получаемые из внешнего API). Вы можете написать getServerSideProps, которая получает эти данные и передаёт их в компонент Page, как показано ниже:

export default function Page({ data }) {
  // Рендеринг данных...
}

// Эта функция вызывается при каждом запросе
export async function getServerSideProps() {
  // Получение данных из внешнего API
  const res = await fetch(`https://.../data`)
  const data = await res.json()

  // Передача данных в страницу через props
  return { props: { data } }
}

Как видите, getServerSideProps похожа на getStaticProps, но разница в том, что getServerSideProps выполняется при каждом запросе, а не во время сборки.

Чтобы узнать больше о работе getServerSideProps, ознакомьтесь с нашей документацией по получению данных.