Конфигурация выполнения

Предупреждение:

• Эта функция устарела. Рекомендуется использовать переменные окружения вместо этого, которые также могут поддерживать чтение значений во время выполнения.
• Вы можете запускать код при запуске сервера, используя функцию register.
• Эта функция не работает с Автоматической оптимизацией статики, Отслеживанием файлов вывода или Компонентами React для сервера.

Чтобы добавить конфигурацию выполнения в ваше приложение, откройте next.config.js и добавьте конфигурации publicRuntimeConfig и serverRuntimeConfig.

module.exports = {
  serverRuntimeConfig: {
    // Will only be available on the server side
    mySecret: 'secret',
    secondSecret: process.env.SECOND_SECRET, // Pass through env variables
  },
  publicRuntimeConfig: {
    // Will be available on both server and client
    staticFolder: '/static',
  },
}

Разместите любую конфигурацию выполнения, доступную только на сервере, в serverRuntimeConfig.

Все, что доступно как клиентской, так и серверной части кода, должно находиться в publicRuntimeConfig.

Страница, которая полагается на publicRuntimeConfig , должна использовать getInitialProps или getServerSideProps, или ваше приложение должно иметь Пользовательское приложение с getInitialProps, чтобы отказаться от Автоматической оптимизации статики. Конфигурация выполнения не будет доступна ни на какой странице (или компоненту на странице), если она не была отображена на стороне сервера.

Чтобы получить доступ к конфигурациям выполнения в вашем приложении, используйте next/config, как показано ниже:

import getConfig from 'next/config'
import Image from 'next/image'
 
// Only holds serverRuntimeConfig and publicRuntimeConfig
const { serverRuntimeConfig, publicRuntimeConfig } = getConfig()
// Will only be available on the server-side
console.log(serverRuntimeConfig.mySecret)
// Will be available on both server-side and client-side
console.log(publicRuntimeConfig.staticFolder)
 
function MyImage() {
  return (
    <div>
      <Image
        src={`${publicRuntimeConfig.staticFolder}/logo.png`}
        alt="logo"
        layout="fill"
      />
    </div>
  )
}
 
export default MyImage