在 React 应用程序中使 api 请求从同一网络上的另一台计算机工作

Make api requests work from another computer on the same network in a react app

我在一台 ipv4 地址为 192.168.1.5 的计算机上有一个 React 应用程序和一个 express api 运行 在端口 3000 & 9000.

在那台计算机上浏览 http://localhost:3000 时,我的应用程序可以运行,我可以向 api 发出请求。但是,当我从另一台本地计算机打开应用程序时,我得到以下输出:

这是在我的 React 应用程序中发出请求的基础 url:

baseUrl 更改为 http://192.168.1.5:9000/api 会使应用程序在同一网络中的另一台机器上运行,但不再在主机上运行。

所以我的问题是,我需要配置什么才能在本地计算机和同一网络上的另一台计算机上安装应用程序 运行?

你可能会在 express 服务器中有这一行

app.listen(3000, () => console.log("Listening"));

"0.0.0.0"作为主机地址传递。

app.listen(3000, "0.0.0.0");

确保您的防火墙允许入站规则中的选定端口。

也看看ngrok。基本上,它将您的服务器暴露在互联网上!

是的,public 互联网。

在启动 ngrok 服务之前,启动 express 服务器。将服务器端口传递给 ngrok 参数。

npm install ngrok -g
ngrok http 3000