Angular-cli: NG development server - app connecting to localhost:3000/sockjs-node/info when behind reverse proxy

[koen-serneels]

Bug Report or Feature Request (mark with an x)

- [X ] bug report -> please search issues before submitting
- [ ] feature request

Versions.

@angular/cli: 1.1.0-rc.0
node: 7.7.3
os: linux x64
@angular/cli: 1.1.0-rc.0
@angular/animations: 4.1.3
@angular/common: 4.1.3
@angular/compiler: 4.1.3
@angular/core: 4.1.3
@angular/forms: 4.1.3
@angular/http: 4.1.3
@angular/platform-browser: 4.1.3
@angular/platform-browser-dynamic: 4.1.3
@angular/router: 4.1.3
@angular/compiler-cli: 4.1.3
Linux (Ubuntu)

Details

Hi. I'm using the NG development server behind an apache reverse proxy to avoid security domain/cors issues between our front and backend. With rc0 and '--disable-host-check' this all seems to work perfectly. Expect that I see following errors reported in the browser: GET http://localhost:3000/sockjs-node/info?t=1495632403818 net::ERR_CONNECTION_REFUSED

The URL int he browser is not localhost, but that of the reverse proxy:" thttp://proxhost/..." . Might the localhost be due to some absolute path present somewhere in the NG development server? Afaic it does not seem to break anything. I start the server like this: ng serve --host 0.0.0.0 --port 3000 --disable-host-check

[RicardoVaranda]

Hi @koen-serneels ,

You are seeing localhost on your request because you are accessing the website in your browser via http://localhost:3000.

Could you try and access it using your local network address e.g: http://192.168.1.2:3000

[bravik]

it breaks live reloading..
People change webpack config to fix this, but we cant change webpack config with angular-cli ?
See this.

[koen-serneels]

@RicardoVaranda Yes I did exactly that accessing it from another machine using the ip address of the RP on which also the dev server is running (RP and dev server run on the same machine). See my post, I was not using localhost

[skesani]

Hey, any update regarding this issue? I am using the angular-cli so can't change webpack config.

I am also having the same issue.
zone.js:2263 GET https://localhost:4400/sockjs-node/info?t=1505327858161 net::ERR_CONNECTION_REFUSED

[csmithson]

This problem appears to go away when I remove the port declaration from the URL. What might fix this for everyone is to have the code smart enough to not include the port in the URL if a FQDN is used.

Such as: 127.0.0.1 would include :4200 and dev.mywebsite.com would not.

[JoshDSommer]

I'm having the opposite problem of this now. instead of listening to locahost:4200 which did work with our reverse proxy setting, in older version of the cli. Now in 1.5.0 it seems to build the sockjs-node server url, from the url in the browser. Which breaks because we have everything running in a folder. I've tried numerous setting an no matter what I do I cannot force the url it listens to to anything other than http://our.localurl/sockjs-node/info?=XXXXXXXX when I need it to either listen to http://localhost:4200/sockjs-node/info?=XXXXXXXX or http://our.localurl/Folder/sockjs-node/info?=XXXXXXXX

[JoshDSommer]

Update I found I could set this setting with the flag --public-host. which changes sockjs to use the url http://localhost:4200/sockjs-node/info?=XXXXXXXX. I'm also using the flag --disable-host-check although I think I may not actually need it in the future. for anyone else have the same problem this is what my start script looks like now.

ng server --aot --public-host=\"http://localhost:4200\" --disable-host-check

[skesani]

If anyone still having this problem, when you deploy your code to production environment, set

--live-reload false

So that it will not reload in the production environment, this is not recommended for local since your changes don't reload automatically in local, but highly recommended for production environment.

[SimonHawesome]

@TheOriginalJosh Setting the public host flag worked for me!

Didn't need to disable host check and had to removed the back slashes from the url.

ng serve --public-host=http://localhost:4200

[JoshDSommer]

@SimonHawesome nice! I had the backslashes in there since it was part of the package.json scripts. glad this worked for you.

[angular-automatic-lock-bot[bot]]

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._}