Ionic --live-reload not running app on device
Asked Answered
S

9

16

I can't see my ionic app on my phone when using the --live-reload parameter.

I am using Windows 8.1 and a connected Nexus 5 Android device. The app is the sample sidemenu app created with ionic start demo sidemenu.


When I run ionic run --live-reload, I first get presented by a list of possible IP addresses:

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)

I choose option 1 - this is the IP address of my development PC, that is hosting the ionic server.


Ionic confirms this selection, and confirms it is serving to the ports as below:

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

I confirmed that it is serving the page by opening Chrome on my PC and navigating to http://192.168.0.109:8100


When the app runs on the Android device, it first displays the splash screen, then shows the webview with the error:

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

net::ERR_ADDRESS_UNREACHABLE

This has also been reported on the Ionic forums:


As far as I can tell, I have opened up TCP ports 35729 & 8100 on my Windows machine (using Control Panel - Firewall settings).

What must I configure so that I can see my Ionic app on my device?

Succussion answered 9/6, 2015 at 16:53 Comment(0)
S
8

The above configuration was all correct.

The ports needed to be open in Windows Firewall - but the missing step was requiring a reboot after updating the Firewall settings.

After a reboot, everything is working correctly.

Succussion answered 10/6, 2015 at 7:52 Comment(1)
Thanks. In Windows 10 for ionic cordova run android --device -l -c, opening the port 8100 solves this issue.Chimkent
C
5

Easy, you can use this command in cmd and this is work well :

ionic serve --address 0.0.0.0
Condemn answered 1/1, 2017 at 17:31 Comment(0)
N
4

Likely not the issue for most people, but for me it was because I was running a VPN on my phone.

Noto answered 17/12, 2016 at 23:55 Comment(0)
I
3

Looks like you are facing a CORS issue.

Install & configure cordova-plugin-whitelist shall correct your issue

Insect answered 9/6, 2015 at 17:1 Comment(1)
useful info for generic issues of this kind. Good to know for someone coming from native apps over to hybrid apps.Succussion
D
2

What worked for me (with no changes to any project config files or to my firewall settings):

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

My setup:

  • My Android phone (running Android 7.1.1) is connected via usb cable to my Windows desktop computer.
  • The address used is the local IP address for the desktop computer, which I got from www.whatismybrowser.com

All the commands I used to get livereload working on my Android phone with a new ionic 3 project:

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

(-c is console, -l is livereload)

Note: It was initially very slow loading onto the phone (the splash screen went by, then it was solid white for a while), but once it loaded, the livereload worked well.

Describe answered 3/1, 2019 at 13:36 Comment(0)
C
1

I'm way late to this but my config.xml generated the following line somewhere in my build process:

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

I fixed it by changing it back to <content original-src="index.html"/> (without the src="http://10.0.0.25:8100")

Clow answered 2/11, 2016 at 5:26 Comment(1)
How come everytime I remove the src="10.0.0.25:8100", it gets generated again when I run android?Substituent
W
0

None of the answers above worked for me, I checked for which network was my phone connected and which network my laptop was connected. Since they were different, I made them connect to the same network and it resolved this issue.

Withrow answered 13/3, 2019 at 6:25 Comment(0)
F
0

Check your CLI version with ionic info.

Live-reload stopped working for me as the OP described, I had to revert to 4.12.0 in order to get it up and running again.

Fayalite answered 11/6, 2019 at 15:32 Comment(0)
V
0

if you don't want to struggle with the firewall, use the host option:

ionic capacitor run android -l --host=172.20.10.10

Vaios answered 4/7, 2021 at 17:10 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.