Port and Proxy Config on ng-build

Question

I have a frontend running for example on int.myapp.com and it's backend on int.backend.myapp.com. I thought I can do the proxing with the proxy.config.json like this:

 "/api": {
    "target": "https://int.backend.myapp.com",
    "secure": true,
    "changeOrigin": true
  }

And in my package.json file

"start": "ng serve --proxy-config proxy.conf.json"

Everything works on my dev environment.

But when I build for production :

ng build --prod

and deploy on firebase

firebase deploy

The web application is not able to communicate with the API

How can I do to fix it ?

Answer 1

In case anybody else run into this problem, I found a workaround in case you still want to run locally your production angular application, use the http-server application:

npm install -g http-server

Build your production application:

ng build --prod

Go to your dist/[YOUR_APP_NAME_FOLDER] folder:

cd dist/[YOUR_APP_NAME_FOLDER] 

Run the http-server application and pass the Proxy option (--proxy or -P) with the backend proxy you would like to point to:

 http-server -c-1 -P http://localhost:3000 .