为啥 heroku 不能在我的反应应用程序中使用代理？

Posted 2023-03-11

【中文标题】为啥 heroku 不能在我的反应应用程序中使用代理？

【英文标题】：Why won't heroku work with proxy in my react app?为什么 heroku 不能在我的反应应用程序中使用代理？

【发布时间】：2020-01-20 18:46:58

【问题描述】：

我有一个简单的笔记应用程序，它在客户端文件夹中使用 react(create react app) 和 node express mongoose 后端。如果我尝试上传到 heroku，它会因为客户端文件夹中 package.json 中的代理（“proxy”：“http://localhost:3001”）而拒绝它。如果我摆脱代理，它会上传到 heroku 没问题，但因为它不在那里，它不会与后端对话，所以没有任何效果。当使用代理推送到 heroku 时，它会构建，但应用程序给了我“无效的主机头”。我该如何解决这个问题？我所尝试的只是删除代理。

【参考方案1】：

您是否在应用中使用固定端口？ Heroku 为您分配了一个您必须绑定到的动态端口，因此您不能简单地使用像 3001 这样的固定端口。

您应该在 Heroku 上运行时绑定到 process.env.PORT。见runtime principles。

【讨论】：

由于某种原因，我没有将它作为 process.env.PORT，但是当我打开应用程序时，我仍然收到 Invalid Host 标头。

您是否尝试过将 Heroku 应用的 HOST 环境变量设置为您通过 heroku 使用的域？

我该如何设置？它会是根文件夹中的 .env 吗？ HOST = react-notes-project.herokuapp.com ？

由于配置是特定于 Heroku 实例的，您希望转到 Heroku，导航到您的应用，单击“设置”，单击“显示配置变量”，然后将其添加到那里。

【参考方案2】：

原来我的模型文件夹中有一个拼写错误的 index.js 文档，这就是导致我出现 Invalid Host Header 错误的原因。我有一个大写 I 而不是小写...

【参考方案3】：

有一个构建包可以解决这个问题，并通过create-react-app 提供更好的体验，请查看：

https://elements.heroku.com/buildpacks/mars/create-react-app-buildpack

只需运行以下命令即可创建您的应用程序：

heroku create <app name> --buildpack mars/create-react-app

【讨论】：

这样我打开应用程序时收到 404。我将所有内容都移到了一个新文件夹并创建了一个新的 heroku 应用程序。