在没有固定IP的本地连接中从浏览器进行API调用

Question

我在一个有两个不同网络接口的设备中运行Nginx web服务器。我想在端口80上提供一个React应用程序，该应用程序对同一设备的不同端口上的API服务器进行API调用。我已经将Nginx配置为在端口80上侦听，它在两个接口上都正确地为React应用程序提供服务。然而，进行API调用比较麻烦。

如果我只有一个固定IP的接口，我会在React APP中将该IP设置为API服务器地址，一切都会好起来。然而，当有多个接口时，React App不知道哪个接口被用来服务它。因此，it不知道哪个是API服务器的IP

这个问题也适用于只有一个接口但IP动态变化的设备。Nginx为网页提供服务，而不考虑IP，但React应用程序需要知道对.进行API调用的IP地址

我知道一个常见的解决方案是将域分配给API服务器，但在我的场景中，与设备的连接只能在本地网络上进行。

我考虑过的解决方案：

1. 在两个接口上都有一个固定的IP，并让nginx为每个接口提供不同的React应用程序。除了API服务器地址参数外，应用程序将是相同的。这可能有些过头了
2. 请求用户在浏览器中运行时在React应用程序上输入IP。这不是真正的用户友好

我真正想要的是React应用程序通过它所服务的IP来知道它的方法，或者Nginx通过取决于设备IP的配置来服务网络的方法。有这样的解决方案吗？

Answer 1

由于React应用程序在本地网络中提供服务，并且它不使用域，因此在浏览器中使用设备IP作为href来请求它。因此，应用程序可以使用javascript方法window.location.href获取设备的IP地址，并将其用作API服务器地址。