NextJS 公共环境变量不适用于 Azure 应用服务

Question

我的 NextJS 应用程序中有一个NEXT_PUBLIC环境变量。它已在我的.env.local文件中设置并正常工作，但在将其部署到 Azure 应用服务后，应用程序无法读取它。它是“未定义”。我已在应用程序服务的配置下对其进行了配置。

关于可能出现的问题有什么建议吗？

提前致谢。

Answer 1

我遇到了同样的问题， Azure AppService 上的NEXT_PUBLIC环境变量始终具有“未定义”值，尽管它们在 AppService 设置中定义为环境变量。

构建 Docker 镜像时，NEXT_PUBLIC 环境变量在构建过程中直接设置，之后无法覆盖。这就是 NEXT_PUBLIC 的 AppService 设置不起作用的原因。

Renato Pozzi ( dev.to )的以下解决方案对我有所帮助。

这是我的步骤：（下一个 v.12.2.5）：

a) 在“构建”过程开始之前在 Dockerfile 中创建所需的 NEXT_PUBLIC 变量，并用“占位符值”填充它。

RUN NEXT_PUBLIC_API_URL=PLACEHOLDER_NEXT_PUBLIC_API_URL yarn build

b) 创建一个入口点文件 (entrypoint.sh)，当 Docker 映像启动时，该文件将占位符值替换为 AppService 中的真实环境变量。

在我的示例中，占位符“PLACEHOLDER_NEXT_PUBLIC_API_URL”被替换为 AppService 配置（环境变量）中的实际值“NEXT_PUBLIC_API_URL”。

#!/bin/sh
test -n "$NEXT_PUBLIC_API_URL"
find /app/.next \( -type d -name .git -prune \) -o -type f -print0 | xargs -0 sed -i "s#PLACEHOLDER_NEXT_PUBLIC_API_URL#$NEXT_PUBLIC_API_URL#g"
exec "$@"

c) 使之前创建的入口点文件在 Dockerfile 中可见。

COPY --chown=nextjs:nodejs entrypoint.sh /entrypoint.sh
RUN chmod +x /entrypoint.sh
ENTRYPOINT ["/entrypoint.sh"]
CMD ["node", "server.js"]