我這邊遇到了前後端如何接在一起的問題，想請各位前輩幫幫忙
專案是前端用：React，後端用：node.js
最初我啟動 react 是 3000 port， node 是 5500 port
也就是在 react 中長這樣 fetch("http://localhost:5500/api")
可是我的老師希望只在一個 port 啟動
就是類似在 node 使用樣板語言讓後端資料能直接渲染畫面那樣
從頭到尾只會有一個網址
我在網路上找了很多資料，都是跟我一樣的做法 (兩個端點)
或是在 package.json 中設置代理服務器
"proxy": "http://localhost:5500/" (可是這也是兩個端點)
有沒有人有遇過類似的做法，或是相關關鍵字可以提供給我查詢
謝謝～

把打包完的檔案丟到node當靜態資源？

就build完當靜態資源阿

https://tinyurl.com/yyucogjv 請參考

app.use(express.static())跟app.get() app.post()多宣告幾個就好了啊而且我想你誤會了.... react-script也是透過node去聽 只是他聽的地方你沒去追就看不到而已

覺得奇怪，部署後你寫的一切 react code 都只是透過script tag 一個個引入，uri 的 domain 由 process.env 環境變數來決定，不會有你說的前端後端分別部署的情形。

3000port那個只是create_react_app讓你debug用，跟部署還有後端無關，也不是你打包好的網頁。你最後做好的網頁會跟你node在同一個port，原因是你的前端是藉由node程式中app.use傳到server。如果要檢測後端是否有接上前端，你應該在node所使用的port開啟你的網頁，而不是使用3000port

我覺得你的基礎完全不行，一個 port 啟動很正常你根本不需要 3000 port，你只要 react build 出來的丟進node.js 的靜態資料夾就好，常開 5500 連就對了前後端分離，前端不用丟在 5500 跑也沒關係你甚至隨便丟一個網路空間讓它去跟 api 存取都行如果你前後端要放在一起，那就是都丟在 node.js 目錄下正確前後端分離的話沒有什麼實務上誰要放在誰那裡的問題但佈署方便來說通常最終是前端放在後端的某個目錄下居多因為後端要決定伺服器的執行環境與目錄結構有空玩玩 Apache 或 nginx 理解一下 http server 概念好了不然 node.js 監聽 web 服務的方法有點抽象會讓你誤解另外看起來現代框架、打包、運行一條龍殘害新手不淺居然會對靜態網頁前端誤解成要啟動 web server 才能執行啟動 web server 是為了跑後端，讓前端順利存取 API 運作所謂 port 3000 只是一種方便需要 build 才能執行的開發用最基本的網頁你寫完存檔在本機到瀏覽器把檔案打開就能看到但現代 build 網頁是因為可能要把 scss compile然後 js 模組化也要編譯組合壓成一支檔案來執行再加上方便瀏覽器出錯時指回原始檔案位置而需要 source map最後是即時監控程式碼有更新就自動 build 完再立即重新整理前端的 node 主要是在做這些事，並不是實際佈署也需要這樣

前端打包後成為static資源檔案參考一下 https://tinyurl.com/y65uxy6lhttps://tinyurl.com/yxscmr84

最近為了學go和vue才遇到類似的問題，簡單整理一下。1.前端編譯後，就只是靜態的網頁，透過ajax去取資料而已。2.所以你只要把取資料的api用網址能夠區分，就能夠一個埠號解決。3.這種開發方式，最讓人頭痛的是前期api怎麼定、開發時的跨域存取api這些問題