如何为 NodeJS Express App 设置 Heroku 端口？

Question

所以我正在尝试在 Heroku 上托管我的网站并设置一切以启动我的应用程序和运行。每当我尝试提交表单时，我都会收到未定义的错误。

Undefined Errors Console Errors

我已将其设置为使用文档中显示的端口：

app.listen(process.env.PORT || 8081, function () {
    console.log('Example app listening on port 8081!');
});

当使用 heroku local web 在本地启动应用程序时，我得到 Typerror: Failed to Fetch 和未定义的结果，但是当我进入我的 .env 文件并添加一个 port=8081 它工作得很好。 Good result

当我用 heroku open 打开它时，我仍然有那个未定义的问题。

我真的不需要在 .env 中设置端口，对吗？或者我呢？我读到标准端口是 80，但它也不起作用。

有人可以帮助我吗？谢谢！

这里是 link public 网站：https://shrouded-everglades-61993.herokuapp.com/ 这里是 link 我的 Github 代表：https://github.com/stefanfeldner/capstone-travel-app

Answer 1

所以它们未定义的原因是它们是由 main.js:

中的这些行设置的

uiData.imageURL = data[1].imageUrl;
...
uiData.iconCode = data[0].iconCode;

其中 data 是您从 /getData 端点检索的对象。问题是 /getData 实际上 returns 是 [{}, {}] 所以当然这些值都是 undefined，导致视觉 broken-ness.

现在，为什么 /getData return 这些空对象？我无法检查您的服务器日志，但根据 server.js 的书写方式，有两种明显的可能性。

首先是某处出现错误，您根本没有在 callApi 中一直走到 try-catch 的末尾，所以 weatherData 和 pixabayData 正在更新中。

其次，也有可能这些调用成功但所需数据不在结果中，即这些 if 语句都不为真：

if('city_name' in data) {`
...
if('hits' in data) {

同样，在这种情况下，weatherData 和 pixabayData 都不会更新。

/sendFormData 的处理程序的编写方式，它不会检查 callApi 是否确实获得了任何有用的数据，只是检查它是否已完成执行。因此，尽管数据对象仍然为空，但您的代码流继续以其愉快的方式进行。

但是，这里有一个更大的、无关的设计缺陷：如果不止一个人使用您的网站会怎样？您的 client-side 代码调用 /sendFormData，这有望正确填充全局变量 weatherData 和 pixabayData，然后分别调用 /getData 来尝试检索此数据。

但是，在您的 client-side 调用 /sendFormData 和 /getData 之间，使用您网站的任何其他人都可以单独调用 /sendFormData 并更改数据从你的搜索结果到他们的搜索结果包含在全局变量中。所以你会得到他们的搜索结果而不是你的，因为他们的结果覆盖了你在服务器上的结果。您需要处理获取 API 结果并在单个事务中将它们发送回请求者。

（回复：所有本地 Heroku 配置，如果不弄乱本地计算机就很难回答，抱歉。）

如何为 NodeJS Express App 设置 Heroku 端口？

How to set Heroku Port for NodeJS Express App?

javascript

hosting

heroku

node.js

express