简体繁体 English

如何在开发过程中在移动设备上运行 Angular2 应用程序？

[英]How to run an Angular2 app on mobile during development?

原文 2021-12-26 22:46:49 2 1 angular

I'm developing an Angular2 app.我正在开发一个 Angular2 应用程序。 The app is served using ng s --open , and then the results can be seen at the browser at http://localhost:4200 .该应用程序使用ng s --open提供服务，然后可以在浏览器中的http://localhost:4200看到结果。

I also run a server at the same localhost, at port 3000. To connect to the server, Angular sends requests to https://localhost:3000/some/api .我还在同一个 localhost 的 3000 端口上运行了一个服务器。为了连接到服务器，Angular 向https://localhost:3000/some/api发送请求。

The problem: when I run the Angular app on a mobile device (connected to the same WiFi), localhost:3000 is not reachable.问题：当我在移动设备（连接到同一个 WiFi）上运行 Angular 应用程序时，无法访问 localhost:3000。

How can I run the app on a mobile device browser and still connect to the server at port 3000, while still running the app on http://localhost:4200 on desktop (that connects to localhost:3000) at the same time ?如何在移动设备浏览器上运行应用程序并仍然连接到端口 3000 的服务器，同时仍然在桌面上的http://localhost:4200上运行应用程序（连接到 localhost:3000）？

1 个解决方案

Use a local network and then serve your angular project on local ip of your system with desired port.使用本地网络，然后使用所需端口在系统的本地 ip 上为您的 angular 项目提供服务。 For example:- My system's local ip = 192.168.1.15 now ng serve --host 192.168.1.15 --port 2600例如：- 我系统的本地 ip = 192.168.1.15 现在ng serve --host 192.168.1.15 --port 2600

After successful compilation, Open 192.168.1.15:2600 in your mobile device (ensure the mobile is connected to the WiFi in the same local network)编译成功后，在你的移动设备中打开192.168.1.15:2600（确保手机连接到同一个本地网络的WiFi）