Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ng serve doesn't listen other than localhost #2375

Closed
gyuho opened this issue Sep 27, 2016 · 23 comments
Closed

ng serve doesn't listen other than localhost #2375

gyuho opened this issue Sep 27, 2016 · 23 comments

Comments

@gyuho
Copy link

gyuho commented Sep 27, 2016

  1. OS? Windows 7, 8 or 10. Linux (which distribution). Mac OSX (Yosemite? El Capitan?)

Ubuntu 16.04

  1. Versions. Please run ng --version. If there's nothing outputted, please run
    in a Terminal: node --version and paste the result here:
node --version
v6.6.0
  1. Repro steps. Was this an app that wasn't created using the CLI? What change did you
    do on your code? etc.

I have this app https://github.com/jelbourn/material2-app.

And just type npm start in repository root. Both in remote and local machine, I see

> m2-app@0.0.0 start /home/gyuho/material2-app
> ng serve

Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
** NG Live Development Server is running on http://localhost:4200. **
8221ms building modules                                                                  
23ms sealing
0ms optimizing 
1ms basic module optimization 
97ms module optimization
0ms advanced module optimization 
11ms basic chunk optimization       
0ms chunk optimization 
2ms advanced chunk optimization 
0ms module and chunk tree optimization 
150ms module reviving
2ms module order optimization 
5ms module id optimization 
3ms chunk reviving 
0ms chunk order optimization 
13ms chunk id optimization
83ms hashing
1ms module assets processing 
188ms chunk assets processing
5ms additional chunk assets processing 
0ms recording 
0ms additional asset processing 
2415ms chunk asset optimization
1616ms asset optimization
37ms emitting
Hash: 93c935dc7d6ef86a5d1e
Version: webpack 2.1.0-beta.22
Time: 12902ms
           Asset       Size  Chunks             Chunk Names
  main.bundle.js    3.43 MB    0, 2  [emitted]  main
styles.bundle.js    43.4 kB    1, 2  [emitted]  styles
       inline.js    5.53 kB       2  [emitted]  inline
        main.map     3.5 MB    0, 2  [emitted]  main
      styles.map    53.8 kB    1, 2  [emitted]  styles
      inline.map    5.59 kB       2  [emitted]  inline
      index.html  580 bytes          [emitted]  
Child html-webpack-plugin for "index.html":
         Asset     Size  Chunks       Chunk Names
    index.html  2.92 kB       0       
webpack: bundle is now VALID.

But when I try to connect to http://[PUBLIC_IP_ADDRESS_OF_CLOUD]:4200, it doesn't serve. I checked all network settings (I am using Google Cloud VM) and confirm that there's no firewall blocking :4200.

Same simple webserver in Go listening to :4200 works fine on the same machine.

Is there anything that I am missing to deploy angular app in virtual machines?

@gyuho
Copy link
Author

gyuho commented Sep 27, 2016

This also doesn't serve via remote machines.

$ ng --version
Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
angular-cli: 1.0.0-beta.15
node: 6.6.0
os: linux x64


npm install -g angular-cli
ng new sample-app
cd sample-app
ng serve
#open http://[IP]:4200

@gyuho gyuho changed the title ng serve doesn't work with localhost:4200 ng serve doesn't listen other than localhost Sep 27, 2016
@gyuho
Copy link
Author

gyuho commented Sep 27, 2016

I found the cause. It's binding static IP 127.0.0.1, not 0.0.0.0.

I am not sure what npm package does this... :(

$ sudo netstat -ntlp
Active Internet connections (only servers)
Proto Recv-Q Send-Q Local Address           Foreign Address         State       PID/Program name
tcp        0      0 127.0.0.1:4200          0.0.0.0:*               LISTEN      27260/angular-cli
tcp        0      0 0.0.0.0:22              0.0.0.0:*               LISTEN      1799/sshd       
tcp6       0      0 :::22                   :::*                    LISTEN      1799/sshd       

It should be something like

$ sudo netstat -ntlp
Active Internet connections (only servers)
Proto Recv-Q Send-Q Local Address           Foreign Address         State       PID/Program name
tcp        0      0 0.0.0.0:22              0.0.0.0:*               LISTEN      1799/sshd       
tcp6       0      0 :::4200                 :::*                    LISTEN      27613/a         
tcp6       0      0 :::22                   :::*                    LISTEN      1799/sshd  

$ sudo netstat -ntlp
Active Internet connections (only servers)
Proto Recv-Q Send-Q Local Address           Foreign Address         State       PID/Program name
tcp        0      0 10.0.3.1:53             0.0.0.0:*               LISTEN      1033/dnsmasq    
tcp        0      0 0.0.0.0:22              0.0.0.0:*               LISTEN      1105/sshd       
tcp6       0      0 :::8000                 :::*                    LISTEN      6833/etcd-play  
tcp6       0      0 fe80::208e:5eff:fe6b:53 :::*                    LISTEN      1033/dnsmasq    
tcp6       0      0 :::22                   :::*                    LISTEN      1105/sshd   

@gyuho
Copy link
Author

gyuho commented Sep 27, 2016

Works with command ng serve --host 0.0.0.0

@gyuho gyuho closed this as completed Sep 27, 2016
gyuho added a commit to etcd-io/etcdlabs that referenced this issue Sep 27, 2016
@estradamarkie
Copy link

@gyuho Hi have you found the cause which package or making the app bind to 127.0.0.1 and not other IPs? I have to run --host 0.0.0.0 as well to make it work on VM.

@gyuho
Copy link
Author

gyuho commented Nov 11, 2016

@estradamarkie I have no idea :0

@estradamarkie
Copy link

#3101 I posted a similar issue this might help clear things up :)

@StabakSen
Copy link

ng serve --host 0.0.0.0 worked. Thanks

@CokeSpirit
Copy link

Thanks, this drove me crazy.

@nyannko
Copy link

nyannko commented May 27, 2017

Thanks, it is helpful to write Dockerfile and deploy to server.

@ZiedChekir
Copy link

Thanks It worked :D ng serve --host 0.0.0.0

@azarus
Copy link

azarus commented Jul 6, 2017

Whats the reason behind 127.0.0.1 this is just unnecessary most people probably want to test their apps on mobile too. And accessing the dev environment over lan is the easiest way to do so. Can we make the 0.0.0.0 to be the default please? @gyuho

@sshreya0808
Copy link

Invalid Host header. still not solved by ng serve --host 0.0.0.0

@levivel
Copy link

levivel commented Sep 4, 2017

@sshreya0808 I may have had the same "Invalid Host Header" problem as you did. The cause of this problem may or may not have been because AWS remote server/VPS has some default firewalls/security settings that may happen to obstruct simply testing Angular's CLI-installed "Welcome to app!" page.
To fix this on my AWS instance, without enabling production, I simply ran:
ng serve --port 8080 --host 0.0.0.0 --disableHostCheck true , then navigated from Safari/Chrome to the IP address I associated with my instance in the "Elastic IPs" section of my AWS dashboard -- plus the port I specified (e.g. "142.43.53.12:8080/").

@ghost
Copy link

ghost commented Sep 30, 2017

@levivel
yeah, ng serve --port 8080 --host 0.0.0.0 --disableHostCheck true it works for me.
thanks 👍

@dstran
Copy link

dstran commented Nov 2, 2017

None of these helped. My browser tab continues to spin with no errors in the dev tool Network tab in Chrome. I disabled private and domain firewalls. I'm out of ideas. Anyone can help me troubleshoot this? Greatly appreciated!

Windows 10 Creators Update
Vagrant: v2.0.0
VirtualBox: v5.1.30
Angular: ~4.0.0
Angular CLI: ~1.0.0

[vagrant@localhost ~]$ sudo netstat -ntlp
Active Internet connections (only servers)
Proto Recv-Q Send-Q Local Address           Foreign Address         State       PID/Program name
tcp        0      0 0.0.0.0:4200            0.0.0.0:*               LISTEN      3412/@angular/cli
tcp        0      0 0.0.0.0:22              0.0.0.0:*               LISTEN      1218/sshd
tcp        0      0 127.0.0.1:25            0.0.0.0:*               LISTEN      1696/master
tcp6       0      0 :::22                   :::*                    LISTEN      1218/sshd
tcp6       0      0 ::1:25                  :::*                    LISTEN      1696/master

@rohit2219
Copy link

Thanks for this , this option worked for me in my ubuntu remote: ng serve --host 0.0.0.0

@vusan
Copy link

vusan commented Dec 24, 2017

Also worked for me by ading serve on .angular-cli.json.
Port here 4201. Solution found from #2542.
"defaults": {
"styleExt": "css",
"component": {},
"serve": { "host": "0.0.0.0", "port": 4201 }
}

@lgoyal06
Copy link

thanks it worked for me as well

@bb1
Copy link

bb1 commented Jun 1, 2018

@ninjadev1030 solution with --host 0.0.0.0 --disableHostCheck true works even in Angular 6! Thanks for this.

@ludwigliu
Copy link

Thanks, it works now, as it drives me crazy for several days.

@vanishtachangea
Copy link

@ludwigliu , @lgoyal06 , @rohit2219 , Can anyone of you please explain how you fix it? I try modification in the .angular-cli.json: "serve": {
"host": "0.0.0.0", "port": 4201
}
and running
ng serve --host 0.0.0.0
The angular app is not loading.
I have another api url which is loading though. It is weird. Please help me.

@hamed6
Copy link

hamed6 commented May 3, 2019

@levivel You solved my problem thanks, how can I fix it permanently without changing host/port. Im using different cloud service, but I assume it can apply to my service.
one more question, what you mean you "without enabling production"?

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests