Ionic --live-reload 不在设备上运行应用程序答案

【问题标题】：Ionic --live-reload not running app on deviceIonic --live-reload 不在设备上运行应用程序
【发布时间】：2015-06-09 16:53:47
【问题描述】：

使用 --live-reload 参数时，我在手机上看不到我的 ionic 应用程序。

我使用的是 Windows 8.1 和连接的 Nexus 5 Android 设备。该应用是使用ionic start demo sidemenu 创建的示例sidemenu 应用。

当我运行 ionic run --live-reload 时，我首先会看到一个可能的 IP 地址列表：

Multiple addresses available.
Please select which address to use by entering its number from the list below:
Note that the emulator/device must be able to access the given IP address
 1) 192.168.0.109 (Wi-Fi)
 2) 192.168.159.1 (VMware Network Adapter VMnet1)
 3) 192.168.174.1 (VMware Network Adapter VMnet8)
 4) 192.168.56.1 (VirtualBox Host-Only Network)

我选择选项 1 - 这是我的开发 PC 的 IP 地址，用于托管 ionic 服务器。

Ionic 确认此选择，并确认它正在为以下端口提供服务：

Selected address: 192.168.0.109
Running live reload server: http://192.168.0.109:35729
Watching : [ 'www/**/*', '!www/lib/**/*' ]
Running dev server: http://192.168.0.109:8100

我通过在我的 PC 上打开 Chrome 并导航到 http://192.168.0.109:8100 确认它正在提供该页面

应用在Android设备上运行时，首先显示启动画面，然后显示错误的webview：

Web page not available
The Web page at http://192.168.0.109:8100/ could not be loaded as:

net::ERR_ADDRESS_UNREACHABLE

Ionic 论坛上也对此进行了报道：

Ionic Forums - Livereload error: Webpage not available

据我所知，我已经在我的 Windows 机器上打开了 TCP 端口 35729 和 8100（使用控制面板 - 防火墙设置）。

我必须进行哪些配置才能在我的设备上看到我的 Ionic 应用？

【问题讨论】：

标签： cordova ionic-framework ionic livereload

【解决方案1】：

上面的配置都是正确的。

需要在 Windows 防火墙中打开端口 - 但缺少的步骤是在更新防火墙设置后需要重新启动。

重启后一切正常。

【讨论】：

谢谢。在 Windows 10 for ionic cordova 中运行 android --device -l -c，打开 8100 端口即可解决此问题。

【解决方案2】：

对大多数人来说可能不是问题，但对我来说，这是因为我在手机上运行 VPN。

【讨论】：

【解决方案3】：

很简单，你可以在 cmd 中使用这个命令，效果很好：

ionic serve --address 0.0.0.0

【讨论】：

【解决方案4】：

您似乎遇到了 CORS 问题。

安装和配置cordova-plugin-whitelist 将纠正您的问题

【讨论】：

此类一般问题的有用信息。很高兴知道有人从原生应用转向混合应用。

【解决方案5】：

什么对我有用（没有更改任何项目配置文件或我的防火墙设置）：

$ ionic cordova run android -c -l --address=10.0.0.2 (use your local IP address here)

我的设置：

我的 Android 手机（运行 Android 7.1.1）已通过 USB 数据线连接到我的 Windows 台式计算机。
使用的地址是台式计算机的本地 IP 地址，我从www.whatismybrowser.com得到的

我用来在我的 Android 手机上使用新的 ionic 3 项目进行 livereload 的所有命令：

$ ionic start testLivereloadProject1 tabs
$ cd testLivereloadProject1
$ ionic cordova platform add android
$ ionic cordova run android -c -l --address=10.0.0.2

（-c 是控制台，-l 是 livereload）

注意：一开始在手机上加载速度很慢（闪屏一闪而过，然后是纯白色的），但一旦加载，livereload 运行良好。

【讨论】：

【解决方案6】：

我迟到了，但我的config.xml 在我的构建过程中的某处生成了以下行：

<content src="http://10.0.0.25:8100" original-src="index.html"/>

我通过将其改回<content original-src="index.html"/>（没有src="http://10.0.0.25:8100"）来修复它

【讨论】：

为什么每次我删除src="10.0.0.25:8100"，运行android时又会生成？

【解决方案7】：

以上答案均不适合我，我检查了我的手机连接了哪个网络以及我的笔记本电脑连接了哪个网络。由于它们不同，我让它们连接到同一个网络，它解决了这个问题。

【讨论】：

【解决方案8】：

使用 ionic info 检查您的 CLI 版本。

如 OP 所述，Live-reload 停止为我工作，我必须恢复到 4.12.0 才能使其重新启动并运行。

【讨论】：

【解决方案9】：

如果您不想使用防火墙，请使用主机选项：

ionic capacitor run android -l --host=172.20.10.10

【讨论】：