我有一个使用 React 的应用程序,它通过 axios 连接到 REST 服务器。 REST 服务器( flask )位于为 JS 项目的构建提供服务的同一台机器上。正在服务的项目是 npm run build
的输出。然后使用 npm serve 来部署这个包。然后从不同 IP 的远程计算机查看 Web 界面。
我遇到的问题是,为站点提供服务的机器的 IP 和 REST API 可能会更改。如何更改 axios 动态调用的 IP?目前我有一个脚本可以在 js 构建中搜索 IP 字符串并将其替换为机器当前的 IP。
使用 ip
之类的实用程序只会返回本地主机。我想我需要找到一种方法来获取谁在为脚本提供服务的 IP?
最佳答案
您可以使用env
变量来解决这些问题。一种流行的方法是使用 cross-env .您的 package.json
文件将在 script
部分中包含一个 build
命令。您必须修改这些以将所需的配置添加为 环境变量
并在需要的代码中使用它。
例子:
{
"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
。要构建开发运行 npm run build:dev
。
在您的代码中,您可以使用 process.env.API_URL
(在您编写 ip 地址/主机名的地方),它会根据构建具有不同的值。要允许 webpack 替换这些 env
变量,请使用 webpack Define
plugin as
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify(process.env.NODE_ENV),
API_URL: JSON.stringify(process.env.API_URL),
}
})
关于javascript - 来自具有更改 IP 地址的机器的 JS 服务和 REST API,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51747628/