How to deploy angular 2 application to HTTP server with proxy-config

Question

I'm building angular 2 application with following proxy configurations.

proxy.conf.json

{ 
 "/": {
  "target": "http://localhost:6060",
  "secure": false,
  "changeOrigin": true,
  "logLevel": "debug" 
}}

I used spring boot application as my back end and it is running at port 6060

My package json's build scripts are as follows

package.json

"scripts": {
"ng": "ng",
"start": "ng serve --proxy-config proxy.conf.json",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
}

When I use npm start , the application works fine. All back end requests are sent to http://localhost:6060

Then I build production version using

ng build --prod --proxy-config proxy.conf.json

and deploy the generated code to HTTP sever (apache server). Then I visit to http://localhost/ the application stats. But when I try to make requests, those are pointed to http://localhost/ ... not to http://localhost:6060

I try to find some solutions but non of those works. Please give me some help.

thanks

Answer 1

The --proxy-config parameter to ng serve only applies to the development web server built in to the CLI. It has no effect on other deployment targets, and does nothing to your production builds.

You say that you use apache and in this case you should set up Apache with the ProxyPass directive: Link to Apache mod_proxy documentation

Typically for a Ubuntu Linux server that would be to edit:

/etc/apache2/sites-enabled/000-default

and insert the following directives:

ProxyPass /path/to/backend http://localhost:6060/

Then Apache will forward (proxy) the requests you se beeing made to http://localhost/path/to/backend to http://localhost:6060