离子服务与 wifi 热点在移动设备上进行测试

Question

我正在尝试在移动浏览器中测试我们的应用。

• 我启动了一个 wifi 热点
• 在我们的项目根目录上运行ionic serve
• 已连接到移动设备上的 wifi
• 在移动浏览器上转到http://localhost:8100

但我没有找到一个页面。如果我连接到运行应用服务器的电脑的 wifi 热点，离子应用程序不应该在浏览时加载吗？

Answer 1

您需要做的就是确保您的笔记本电脑和手机在同一个 Wifi 连接上

快跑 ionic serve

网络：http://192.168.1.***:8100/

在您的移动浏览器中输入该网络地址

它适用于所有 create-react-app 和 vue-cli

热重载也可以工作

如果您没有 WiFi，请使用移动热点

Answer 2

ionic serve 喜欢接受的答案对我不起作用。但是

ionic serve --host=COMMON_NETWORK_IP 并连接到

COMMON_NETWORK_IP:8100 在电话里，确实。

通过 ifconfig (unix) 或 ipconfig (windows) 查找您的 COMMON_NETWORK_IP。 如果你在 WiFi 上并且使用 mac，你也可以使用 GUI：

Answer 3

最好的方法：

1. 从您的移动设备到您的计算机制作个人热点
2. 运行ionic serve
3. 读取此命令引发的输出。在那里你可以看到External IP-Adress
4. 在您的智能手机上打开浏览器并使用Exernal IP-Adress + 8100（端口）

例如： http://192.168.32.12:8100

Answer 4

localhost 是您的本地地址。如果您想从您的移动设备浏览器访问您的 PC 提供的 ionic 应用程序，您应该使用您的 PC 的 IP 地址而不是 localhost，因为 localhost 是您的移动设备的地址。

所以只需在您的终端上运行ifconfig (unix) 或ipconfig (windows) 并从您的移动设备访问使用此地址的应用程序：http://IP_OF_YOUR_PC:8100

根据您的防火墙规则，这可能不起作用。