使用方法
<script setup lang="ts">
const config = useRuntimeConfig()
</script>
export default defineEventHandler((event) => {
const config = useRuntimeConfig()
})
定义运行时配置
下面的示例显示了如何设置一个公共 API 基本 URL 和一个只能在服务器上访问的秘密 API 令牌。
我们应该始终在 nuxt.config 中定义 runtimeConfig 变量。
export default defineNuxtConfig({
runtimeConfig: {
// 私钥仅在服务器上可用
apiSecret: '123',
// 公开给客户端的公钥
public: {
apiBase: process.env.NUXT_PUBLIC_API_BASE || '/api'
}
}
})
需要在服务器上访问的变量直接添加到 runtimeConfig 中。
需要在客户端和服务器上都可以访问的变量在 runtimeConfig.public 中定义。
访问运行时配置
要访问运行时配置，我们可以使用 useRuntimeConfig() 组合：
export default async () => {
const config = useRuntimeConfig()
// 访问公共变量
const result = await $fetch(`/test`, {
baseURL: config.public.apiBase,
headers: {
// 访问私有变量(仅在服务器上可用)
Authorization: `Bearer ${config.apiSecret}`
}
})
return result
}
在此示例中，由于 apiBase 是在 public 命名空间中定义的，因此它可以在服务器端和客户端普遍访问，而 apiSecret 只能在服务器端访问。
环境变量
可以使用前缀为NUXT_的匹配环境变量名称更新运行时配置值。
使用.env文件
我们可以在 .env 文件中设置环境变量，使它们在开发和构建/生成期间可访问。
NUXT_PUBLIC_API_BASE = "https://api.localhost:5555"
NUXT_API_SECRET = "123"
在 开发 和 构建/生成 期间，在 Nuxt 应用程序中使用 process.env 访问 .env 文件中设置的任何环境变量。
在生产运行时，您应该使用平台环境变量，不使用 .env。
使用 git 时，请确保将.env添加到.gitignore文件中，以避免将秘密泄露到 git 历史记录中。
App 命名空间
Nuxt 在 runtime-config 中使用app命名空间，键包括baseURL和cdnURL。 您可以通过设置环境变量在运行时自定义它们的值。
这是一个保留的命名空间。 你不应该在app中引入额外的键。
app.baseURL
默认情况下，baseURL设置为/。
但是，可以通过将NUXT_APP_BASE_URL设置为环境变量来在运行时更新 baseURL。
然后，您可以使用config.app.baseURL访问这个新的基本 URL：
export default defineNuxtPlugin((NuxtApp) => {
const config = useRuntimeConfig()
// 通用访问baseURL
const baseURL = config.app.baseURL
})
app.cdnURL
此示例演示如何设置自定义 CDN url 并使用 useRuntimeConfig() 访问它们。
您可以使用自定义 CDN，使用NUXT_APP_CDN_URL环境变量在.output/public内提供静态资产。
然后使用 config.app.cdnURL 访问新的 CDN url。
export default defineEventHandler((event) => {
const config = useRuntimeConfig()
// 通用访问cdnURL
const cdnURL = config.app.cdnURL
})