Question

我有一个使用React的应用程序，该应用程序通过axios连接到REST服务器。 REST服务器（烧瓶）位于服务JS项目构建的同一台计算机上。所服务的项目是npm run build的输出。然后使用npm serve部署此软件包。然后从不同IP的远程计算机查看Web界面。

我遇到的问题是为站点和REST API服务的计算机的IP可能会更改。如何更改axios动态调用的IP？目前，我有一个脚本，可在js构建中搜索IP字符串，并将其替换为当前IP的机器。

使用ip之类的实用程序仅返回了localhost。我想我需要找到一种方法来获取谁提供脚本的IP？

Answer 1

您可以使用env变量来解决这些问题。一种流行的方法是使用cross-env。您的package.json文件在build部分中将有一个script命令。您必须修改这些设置，以将所需的配置添加为environment variables并在需要的代码中使用它。

示例：

{
  "scripts": {
    "build:prod": "cross-env API_URL=http://myserverip.com NODE_ENV=production webpack --config     build/webpack.config.js",
    "build:dev": "cross-env API_URL=http://localhost:8000 NODE_ENV=development webpack --config     build/webpack.config.js"
  }
}

然后，您可以使用不同的命令来构建它们。要生成产品，请运行npm run build:prod。要运行dev，请运行npm run build:dev。

在您的代码中，您可以使用process.env.API_URL（用于编写IP地址/主机名的位置），它会根据构建而具有不同的值。要允许webpack替换这些env变量，请使用webpack Define插件作为

new webpack.DefinePlugin({
  'process.env': {
    NODE_ENV: JSON.stringify(process.env.NODE_ENV),
    API_URL: JSON.stringify(process.env.API_URL),
  }
})

Answer 2

如果REST服务器和API共享一个公共服务器，则可以完全省略IP地址，所以代替

new_row.addEventListener('contextmenu', function(e){
      var t = e.srcElement.id.split('-');
      id = t[1];
      menu.popup(remote.getCurrentWindow());
    });

你可以

axios.get('http://123.4.567.89/user?ID=12345')

除此之外，使用DNS通常是更好的方法：

axios.get('/user?ID=12345')

IP地址不断变化的机器提供的JS服务和REST API

2 个答案: