运行时配置
警告:
- 此功能已弃用。 我们建议改用环境变量,它也可以支持读取运行时值。
- 你可以使用
register函数在服务器启动时运行代码。- 此功能不适用于自动静态优化、输出文件跟踪或 React 服务端组件。
要向应用添加运行时配置,请打开 next.config.js 并添加 publicRuntimeConfig 和 serverRuntimeConfig 配置 :
next.config.js
module.exports = {
serverRuntimeConfig: {
// 仅在服务端可用
mySecret: 'secret',
secondSecret: process.env.SECOND_SECRET, // 传递环境变量
},
publicRuntimeConfig: {
// 在服务端和客户端都可用
staticFolder: '/static',
},
}
将任何仅服务端的运行时配置放在 serverRuntimeConfig 下。
客户端和服务端代码都可访问的内容应放在 publicRuntimeConfig 下。
依赖
publicRuntimeConfig的页面必须使用getInitialProps或getServerSideProps,或者你的应用必须具有带有getInitialProps的自定义 App,以选择退出自动静态优化。如果没有服务端渲染,运行时配置将不可用于任何页面(或页面中的组件)。
要在应用中访问运行时配置,请使用 next/config,如下所示:
import getConfig from 'next/config'
import Image from 'next/image'
// 仅包含 serverRuntimeConfig 和 publicRuntimeConfig
const { serverRuntimeConfig, publicRuntimeConfig } = getConfig()
// 仅在服务端可用
console.log(serverRuntimeConfig.mySecret)
// 在服务端和客户端都可用
console.log(publicRuntimeConfig.staticFolder)
function MyImage() {
return (
<div>
<Image
src={`${publicRuntimeConfig.staticFolder}/logo.png`}
alt="logo"
layout="fill"
/>
</div>
)
}
export default MyImage