CODEWITHSUNDEEP
jsonangularwebpackurl-rewritingproxy
Jeff Davies
Jeff Davies

Reputation: 71

Angular Proxy Config "Not rewriting GET /api/account/user because the client prefers JSON"

Having run into a CORS error in Angular v16.1.0 (using port 44498) with a ASPNET CORE DotNet 6.0 backend (using port 44303), I have followed the recommendation of using the Angular Proxy to rewrite a request to the backend URL. This is my proxy config:

proxy.conf.js

I call a HTTClient GET in a typescript component:

HTTPCLIENT GET

Nothing happens - the URL is not rewritten and the browser displays an HTTP 404 not found message:

Chrome 404 Error

I enabled verbose logging and was presented with this message:

WebPack Error message.

I have researched this extensively and have not been able to find anybody reporting this particular problem, particularly not that specific WebPack error message. I have found other people reporting the Angular Proxy not working, but in nearly every case it seems that they are not rewriting an HTTPS call.

The expected behaviour is that the URL https://localhost:44498/api/account/user is rewritten to https://localhost:44303/api/account/user so that GET succeeds (as it does when called by POSTMAN.)

Upvotes: 7

Views: 955

Answers (1)

Alex Biro
Alex Biro

Reputation: 1227

Try changing the proxy config from

const PROXY_CONFIG = [
  {
    "/api/*": { 
      "target": 'https://localhost:44303',
      "secure": true,
    }
  }
]

to

const PROXY_CONFIG = [
  {
    "/api/**": { 
      "target": 'https://localhost:44303',
      "secure": true,
    }
  }
]

Note the double ** in the path matcher. I think the single * means wildcard for a single path section, and the double one means wildcard for the complete path.

Upvotes: 7

Related Questions