CLI 1.5.0 Live Reload Issues When Using Reverse Proxy

Bug Report or Feature Request (mark with an x)

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

Versions.

Angular CLI: 1.5.0
Node: 6.11.2
OS: darwin x64
Angular: 5.0.0
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 2.0.0-beta.12
@angular/cli: 1.5.0
@angular/material: 2.0.0-beta.12
@angular-devkit/build-optimizer: 0.0.32
@angular-devkit/core: 0.0.20
@angular-devkit/schematics: 0.0.35
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.0
@schematics/angular: 0.1.0
typescript: 2.4.2
webpack: 3.8.1

Repro steps.

I have a tomcat on port 8080 serving the API the angular app (running on 4200) feeds from. I have an apache running on port 8888 with a reverse proxy like configured as shown below:

ProxyRequests On
ProxyVia On

ProxyPreserveHost On

    ProxyPass /app http://localhost:4200/
    ProxyPassReverse /app http://localhost:4200/

    ProxyPass /guest http://localhost:3000/
    ProxyPassReverse /guest http://localhost:3000/

    ProxyPass / http://localhost:8080/
    ProxyPassReverse / http://localhost:8080/

Essentially, I have set up to access the angular app on localhost:8888/app.

Prior to upgrading to Angular 5 and cli 1.5.0 it was all working fine. Now, the live reload stopped working. The rest of the app and processes keep working as expected.

Prior to upgrading, I ran angular with ng serve --host=0.0.0.0 --deploy-url=/app/ --base-href=/app. As mentioned that stopped working and I’ve tried a number of command/param configurations without success. Here are some of my attempts to have it working…

• ng serve --host '0.0.0.0' --deploy-url '/app' --base-href '/app' --serve-path '/app'
• ng serve --host 0.0.0.0 --deploy-url /app --base-href /app --serve-path /app
• ng serve --host 0.0.0.0 --deploy-url /app --base-href /app --public-host http://localhost:8888/app
• ng serve --host 0.0.0.0 --deploy-url /app --base-href /app --public-host http://0.0.0.0:8888/app
• ng serve --host 0.0.0.0 --deploy-url /app --base-href /app --live-reload-client http://localhost:8888/app
• ng serve --deploy-url /app --base-href /app --live-reload-client http://localhost:8888
• ng serve --host=0.0.0.0 --deploy-url=/app --base-href=/app --public-host=http://localhost:8888/app --disable-host-check --aot

I believe the issue to be related to cli 1.5, since it was working correctly just before upgrading.

The log given by the failure.

Browser’s (chrome, in this case) console shows the following:

http://localhost:8888/sockjs-node/info?t=1509897420616 404 (Not Found) (zone.js:2933)
[WDS] Disconnected! (client:164)

Changing files no longer refreshes the browser

Desired functionality.

The server and live reload to continue to work regardless of proxying or for the params to help configure the server to work through the proxy correctly.

Mention any other details that might be useful.

• FYI. Mainly — but not exclusively — use this setup to avoid CORS issues and so that the app serving the API (running on 8080) writes the auth cookie and the angular app requests go through as authenticated.
• This seems somehow related to #6440 but that one continues unsolved, the issue is not exactly the same and is on an older version of cli. I actually had the proxy working fine prior to upgrading to cli 1.5.0

Thanks.

[rart]

I finally got it working using the command like

ng serve --deploy-url /app/ --base-href /app --public-host http://localhost:4200/sockjs-node

At this point, i’m not sure if this is a bug or not. What’s curious is that prior to upgrading to 1.5.0 ng serve --deploy-url=/app/ --base-href=/app worked fine with my proxy setting. After the upgrade I need to specify the public-host (AKA live-reload-client) for the exact same env to work.

Observations

• Without the / at the end of the deploy-url some app paths brake.
• ng serve --help states that --live-reload-client is an alias for public-host. Based on how it works I’d argue that public-host as the name for that param doesn’t make sense. live-reload-client makes more sense.
• The explanation that @clydin provided here on serve-path it’s clearer than what the serve --help explains. I think most of those on the --help could use better explanations.

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