如何在不同的端口中运行反应端口和后端端口？

Posted 2023-03-07

【中文标题】如何在不同的端口中运行反应端口和后端端口？

【英文标题】：How to run react port and backend port in different ports?

【发布时间】：2021-12-16 12:53:38

【问题描述】：

我运行一个反应前端应用程序。我还在后端提供 API。当我执行“node server.js”时，它在端口 5000 上运行，然后当我 npm start 时，它尝试在端口 5000 上运行，但由于它很忙，我选择了另一个并转到 5001。

但是，如果我使用 nodemon 并同时在一个命令中同时运行前端和后端，则不会出现反冲问我端口忙的情况。如果我这样做，我怀疑后端不会运行，因为我无法通过 localhost/api/data 链接访问它。

如何在不同的端口上运行它们？我在启动脚本中使用craco，因为我使用tailwindcss，所以cross-env不起作用

【参考方案1】：

我怀疑您使用的是 create-react-app 样板。

在这种情况下，您可以在package.json 文件中添加一个proxy 字段，以告诉反应服务器将本地请求转发到单独的端点。

更多信息请点击此处：https://create-react-app.dev/docs/proxying-api-requests-in-development/

如果您的后端在端口 5000 上运行，请将以下内容添加到您的 package.json

"proxy": "http://localhost:5000"

完成后启动反应服务器，它应该自己进行转发，与 cors 无关。

【讨论】：

我认为你没有理解这个问题。这是过程：我通过运行“node backend/server.js”运行服务器它在端口 5000 上运行。然后我继续使用“npm start”运行前端反应应用程序。在这里它通知我端口 5000 正忙，如果我想在不同的端口运行 react 应用程序。我说是的，然后就没事了。但是，如果我尝试通过 nodemon 同时运行命令并同时运行，我永远不会收到通知，并且我无法通过 localhost:5000/api/data

访问我的后端数据