Connection refused: localhost:4200 favicon.ico 502 in angular 7

Question

I have create an angular project via

ng new project_name --style=scss

and then try to run via

ng serve

but getting error

removed and reinstalled the node_modules but all in vain.

Every time getting this error, please guide what to do!!!

UPDATE 1

Why I am not able to run Angular application on localhost (running on 192.168.X.X:4200) in my office pc but the same project I can run on localhost at my home

UPDATE 2

in hosts file, I have this. Is it OK?

127.0.0.1 localhost

::1 localhost

Update 3

I am quite sure, it is only the system config issue that's why it is blocking localhost and allowing 192.168.X.X but don't know where the problem lies.

Did you try `127.0.0.1`? Localhost is just an alias for this IP address. Maybe your PC in the office has different hosts settings. Please, let me know if this worked. — Michal, Apr 04 '19 at 10:51
Worked but facing CORS problem [https://stackoverflow.com/questions/55254354/access-to-xmlhttprequest-at-http-localhost3000-from-origin-http-192-168](https://stackoverflow.com/questions/55254354/access-to-xmlhttprequest-at-http-localhost3000-from-origin-http-192-168), although I have set pre-flight option but didn't work — WasiF, Apr 04 '19 at 11:06
Would this help? https://expressjs.com/en/resources/middleware/cors.html#configuring-cors — Michal, Apr 04 '19 at 11:11
Btw setting allow origin to `*` helps but try no to do this in production. This can be a huge security issue. :) — Michal, Apr 04 '19 at 11:13
though `*` is a security concern but at least it should work but in my case it don't ;( — WasiF, Apr 04 '19 at 11:21
tried different CORS but none working. provided exceptions but none worked. [you can see here](https://stackoverflow.com/questions/55254354/access-to-xmlhttprequest-at-http-localhost3000-from-origin-http-192-168) I have provided different cors but all in vain. — WasiF, Apr 04 '19 at 11:23
Which OS are you using on your office pc? and is different from the one at home? — Nickolaus, Apr 06 '19 at 06:22
@WasiF propably the port 4200 is already used in the system try running on a different and make sure that post is not used by the system port `ng serve --port 4401 ` — Joel Joseph, Apr 09 '19 at 11:36
@JoelJoseph Tested on different ports but same result 'connection refused' — WasiF, Apr 09 '19 at 11:49
I am quite sure, it is only the system config issue that's why it is blocking localhost and allowing 192.168.X.X — WasiF, Apr 09 '19 at 11:50

WasiF · Accepted Answer · 2020-03-05T10:27:46.887

1

I was using Opera browser for testing and it was my default browser and trying to access localhost:4200 but every time connection refused then I test this on Chrome, it ran smoothly.

I checked proxy setting for both the browsers and there was no proxy enabled. Finally I reset settings and data in Opera and problem resolved.

Still, question is there!!! What was that hindering localhost ...

edited Mar 05 '20 at 10:27

answered Mar 04 '19 at 07:51

WasiF

26,101
16
120
128

I already told you to change your local address :) ng serve --host 0.0.0.0. Good to see you found problem, have fun. – rcanpahali Mar 04 '19 at 09:16
yes thank you, but that `--host 0.0.0.0` didn't work – WasiF Mar 04 '19 at 10:30
Thanks for this answer. I also uses Opera and got the same problem. I reset the browser setting, now it works for me. – LiemLT Mar 27 '21 at 18:08

score 1 · Answer 2 · edited Mar 04 '20 at 21:17

1

I also faced the same issue. I tried the above solutions, it didn't work. I am using a different port now. I used this command:

-ng serve --port 0

and I could see my app running on the new port.

edited Mar 04 '20 at 21:17

sawyermclane

896
11
28

answered Mar 04 '20 at 19:12

Prashanti.D

69
6

score 0 · Answer 3 · answered Mar 04 '19 at 07:19

0

Put your favicon.ico file in assets folder and change the path in the index.html

answered Mar 04 '19 at 07:19

ZearaeZ

899
8
20

score 0 · Answer 4 · answered Apr 05 '19 at 11:33

0

Just put your favicon.ico file to your project root directory and update your favicon file inject code with the below code in the head of your index.html file. Thanks

<link rel="icon" href="favicon.ico" type="image/x-icon">

answered Apr 05 '19 at 11:33

Hassan Siddiqui

2,799
1
13
22

but the same project at my home pc working fine. no need to add favicon to root or else where. I don't think so its favicon issue – WasiF Apr 05 '19 at 11:52
It would be very helpful if you share any working example. Thanks – Hassan Siddiqui Apr 05 '19 at 12:09
What info I should share, I too wonder about that? It's angular 7 project, running on windows 7 x64 and what else do I need to share? It also happens newly created project (with no addition) – WasiF Apr 08 '19 at 07:26
Move your newly created project which have same issue on https://stackblitz.com. Thanks – Hassan Siddiqui Apr 08 '19 at 09:21
It's not the problem with this project but every other project that I created and run smoothly but now they aren't running on `localhost` so I am quite sure it's the system config problem not with the project. Thanks – WasiF Apr 08 '19 at 09:45
@WasiF did you try my answer below ? – Joel Joseph Apr 09 '19 at 11:52
@JoelJoseph trying – WasiF Apr 09 '19 at 11:56

score 0 · Answer 5 · edited Jun 20 '20 at 09:12

0

You can use the following method to solve the same :

Check your LAN proxy settings.

In chrome Settings -> Advanced -> Open Proxy Settings -> LAN Settings -> make sure you unchecked "use proxy server for your LAN" or mark "bypass proxy server for local address" if you are using proxy

Also if the above settings didn't solve your problem probably the port 4200 is already used in the system try running app on a different port ng serve --port 4401

Also make sure you clear browser cache to see the result

edited Jun 20 '20 at 09:12

Community

1
1

answered Apr 09 '19 at 11:50

Joel Joseph

5,889
4
31
36

1

I checked in Chrome there was no proxy enabled and app run smoothly but during development I used Opera and Opera too doesn't have this proxy enabled. Finally I reset Opera settings and app worked on localhost. By the way Thanks Joel Joseph – WasiF Apr 09 '19 at 12:12

Connection refused: localhost:4200 favicon.ico 502 in angular 7

5 Answers5

Linked