在其他机器上运行反应代码

Posted 2023-02-22

【中文标题】在其他机器上运行反应代码

【英文标题】：Running react code on other machine

【发布时间】：2017-06-24 07:25:10

【问题描述】：

您好，我正在研究 reactJS 想了解如何通过我在其他机器上的 IP 地址运行在 http://localhost:8888/index.html#/?_k=pu9k2u 上运行的本地 React 应用程序？

每当我执行“npm start”时，它总是在 localhost:8888 上运行

如何将其更改为在 0.0.0.0:8888 上运行？

我知道如何更改应用程序的端口，

以下是我的 webpack.congif.js

module.exports = 
  entry: './index.js',

  output: 
    filename: 'index.js',
    path: ''
  ,

  devServer: 
    inline:true,
    port: 8888
  ,

  module: 
    loaders: [
       test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader?presets[]=es2015&presets[]=react' 
    ]
  

由于我对 reactJS 非常陌生，请解释下面给出的解决方案或提供更新的 webpack.config.js

How to make the webpack dev server run on port 80 and on 0.0.0.0 to make it publicly accessible?

【问题讨论】：

尝试打开localhost:3000隐身窗口。

【参考方案1】：

仅通过将 host: 添加到 webpack.config.js 它对我有用

devServer: 
  host:'000.000.00.00',
  port: 8888
,

然后我开始通过给出反应代码 webpack-dev-server --host 000.000.00.00 --port 888

【讨论】：

仅将这些项目添加到我的 webpack.config.js 并运行 npm start 对我有用。

【参考方案2】：

您需要将 React 应用程序的托管从 localhost 更改为您的本地 IP 地址。 （例如10.10.54.124），您可以在Windows命令提示符下使用ipconfig命令获取。

接下来您需要通过防火墙打开您的端口（例如 214），以便从第 3 方计算机访问。之后，您本地或 *** 网络中的所有人都可以通过链接10.10.54.124:214 访问您的应用程序。

附注这仅适用于您本地网络中的人

【讨论】：

我在我的 react 应用程序的 webpack.config.js 中自己提供了这个端口 8888

你至少可以使用它

还有其他解决方案吗？我无法通过防火墙打开端口

安全系统不允许我访问这些设置

【参考方案3】：

这就是我所做的：我告诉节点使用计算机的本地主机名，而不是使用 IP 地址。这是在脚本部分的 package.json 文件中使用 HOST 参数完成的，还有一个 PORT 参数：

  
  ...,
  "scripts": 
    "start": "node scripts/start.js",
    "start-local": "HOST='BlueLight.local' node scripts/start.js",
    "build": "node scripts/build.js",
    "test": "node scripts/test.js --env=jsdom",
    ....
  
  ...

我的主机名是BlueLight，所以我的本地地址是BlueLight.local，打开终端并写hostname命令找出你的。

所以我本地网络中的任何电脑都可以打开http://BlueLight.local:3000你甚至可以使用手机，我甚至使用iPhone或android模拟器。

请注意，某些安全检查（如 WebRTC、实时摄像头和其他 https 检查）将不起作用，因为您的本地地址没有 SSL 证书。其中一些可以在浏览器的高级设置中停用。