为什么 React 似乎无法识别 Heroku 的 PORT 环境变量？答案

【问题标题】：Why does React not seem to recognize Heroku's PORT env variable?为什么 React 似乎无法识别 Heroku 的 PORT 环境变量？
【发布时间】：2021-10-01 07:58:03
【问题描述】：

我正在尝试使用 django 后端部署前端反应应用程序。我能够为 Django 后端获取 Heroku 的 PORT 环境变量，但无论我做什么或尝试什么，process.env.PORT 总是返回未定义。我尝试添加一个以 REACT_APP 开头的临时变量，它只读取 procfile 中的 PORT 变量。 Env 文件将不起作用，因为 PORT 变量是动态分配的。

我发现的每个资源都说要尝试 .env 文件或导出变量，但就像我说的那样，这是不现实的，因为 Heroku 会动态分配端口。有什么想法吗？

【问题讨论】：

实际服务应用的是什么？您不应该在生产中使用开发服务器，而是为构建过程的静态输出提供服务。
我正在为构建过程的静态输出提供服务。我无法让 nodejs buildpack 工作，但我确实让 react 工作：github.com/mars/create-react-app-buildpack
服务它用什么，但是？ REACT_APP_ env vars 用于 CRA，在构建时，它们在运行时不起作用。看起来 buildpack 使用 NGINX，它应该选择默认的 env var。是什么让您认为它不起作用 - 您在哪里尝试记录 process.env.PORT？
环境变量在客户端中不可用。那是在用户的浏览器中运行，而不是在服务器中。就此而言，服务器上也没有运行 Node 进程。鉴于您使用的是 NGINX buildpack，Django 应用程序可能完全处于不同的 dyno 中，您不需要知道它绑定到哪个 PORT。
请不要在问题中添加答案 - 如果您不再遇到问题，我建议您删除问题。

标签： javascript reactjs django heroku environment-variables

【解决方案1】：

环境变量在客户端中不可用。那是在用户的浏览器中运行，而不是在服务器中。就此而言，服务器上也没有运行 Node 进程。鉴于您使用的是 NGINX buildpack，Django 应用程序可能完全位于不同的测功机中，您不需要知道它绑定到哪个端口。 - @jonrsharpe

在 Heroku 部署的环境中，项目的方向应该是前端通过特定的 url 配置向后端发出请求，而不是通过不同的端口调用。

【讨论】：