0

I am able to access the client server in Angular 5 from localhost:4200 with Cross-Origin concept but when I am deploying the app using ng build to Pivotal Cloud Foundry, getting error Failed to load resource: the server responded with a status of 404 (Not Found). Not able to figure out the exact issue. I am using package.config.json as - 

{
  "/api": {
    "target": "https://benifit.cfapps.io/api",
    "pathRewrite": {
    "^/api": ""
    },
    "changeOrigin": true
 }
}

Also, I am using cf push -b staticfile_buildpack portal-app for pushing my app to PCF. Please suggest where and what I am missing

Meenal
  • 105
  • 3
  • 17

1 Answers1

0

You are referring to the proxy config file from angular-cli dev server. This file is only used for local development, to avoid cross-origin requests. You cannot use this proxy, after the app is deployed.

So in your case the Angular app will directly query your backend underneath the following path /api. So you have to ensure the api is available at the same host (in cloud foundry). When the api is only available under benifit.cfapps.io/api, you have to change the base path for your HTTP queries in the app and also take care to enable cross-origin requests on the api side.

Daniel Beckmann
  • 286
  • 2
  • 8
  • Not sure if I understand correctly, but do I need to try with this command by changing my basepath: ng build --prod --base-href /benifit.cfapps.io/api. Currently my Angular-app endpoint is exposed as https://portal-app.cfapps.io/ – Meenal Aug 28 '18 at 09:40
  • To provide more detail, this is the error which I see on Inspect HttpErrorResponse {headers: HttpHeaders, status: 404, statusText: "Not Found", url: "https://portal-app.cfapps.io/api", ok: false, …} – Meenal Aug 28 '18 at 09:50