如何為 NodeJS Express App 設置 Heroku 端口？

Question

所以我試圖在 Heroku 上托管我的網站並設置一切以啟動和運行我的應用程序。 每當我嘗試提交表單時，我都會收到未定義的錯誤。

未定義的錯誤控制台錯誤

我已將其設置為使用文檔中顯示的端口：

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

當使用heroku local web在本地啟動應用程序時，我得到Typerror: Failed to Fetch和未定義的結果，但是當我 go 到 my.env 文件中時，它工作得很好，並且將它添加到port=8081文件中。 好結果

當我用heroku open它時，我仍然有這個未定義的問題。

我真的不必在.env 中設置 PORT 對嗎？ 還是我？ 我讀到那個標准端口是 80，但這也不起作用。

有人可以幫幫我嗎？ 謝謝！

下面是公共站點的鏈接： https://shrouded-everglades-61993.herokuapp.com/這里是我的 Github 代表的鏈接： Z5E056C500A1C4B6Acapstone/Z1110B5ADESTEFANNER/Github

Answer 1

所以它們未定義的原因是它們是由main.js中的這些行設置的：

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

其中data是您從/getData端點檢索的 object。 問題是/getData實際返回的是[{}, {}]所以當然這些值都是undefined ，導致視覺上的破碎。

現在，為什么/getData返回這些空對象？ 我無法檢查您的服務器日志，但根據server.js的編寫方式，有兩種明顯的可能性。

首先是某處出現錯誤，而您根本沒有一直到 callApi 中的callApi ，因此weatherData和pixabayData都沒有更新。

其次，這些調用也有可能是成功的，但所需的數據不在結果中，即這些 if 語句都不為真：

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

同樣，在這種情況下， weatherData和pixabayData都沒有被更新。

/sendFormData的處理程序的編寫方式，它不檢查callApi確實獲得了任何有用的數據，只是檢查它是否已完成執行。 因此，盡管數據對象仍然是空的，但您的代碼流會繼續愉快地進行。

然而，這里有一個更大的、不相關的設計缺陷：如果不止一個人使用您的網站會發生什么？ 您的客戶端代碼調用/sendFormData ，它有望正確填充全局變量weatherData和pixabayData ，然后分別調用/getData以嘗試檢索此數據。

但是，問題是，在您的客戶端調用/sendFormData和/getData之間，使用您網站的其他任何人都可以單獨調用/sendFormData並將全局變量中包含的數據從您的搜索結果更改為他們的結果搜索。 所以你會得到他們的搜索結果而不是你的，因為他們的結果覆蓋了你在服務器上的結果。 您需要處理獲取 API 結果並在單個事務中將它們發送回請求者。

（回復：所有本地 Heroku 配置，如果不弄亂本地計算機就很難回答，抱歉。）