Google Chrome debug tools cause a network failure when using an Apple MacBook Pro.
When not in the debugger, the following code works just fine:

async getQuotes() {
const uriParams = new HttpParams().set(‘page’, ++this.page);

await lastValueFrom(this.httpClient.get(`${environment.baseUrl}/api/quotes`, { params: uriParams}))
  .then (result => {
    this.message = `${JSON.stringify(result)}`;
  })
  .catch(() => {
    this.message = '*** Failed ***';
  })

}

proxy.conf.json contains:

{
“/api/*”: {
“target”: “http://localhost:3000”,
“changeOrigin”: true,
“logLevel”: “debug”,
“secure”: false
},
“/candy”: {
“target”: “http://localhost:3000”,
“changeOrigin”: true,
“logLevel”: “debug”,
“secure”: false
}
}

It seems that the developer tools for Chrome on the Mac don’t pick up the proxy.

So…

Same project in Linux. Everything works just fine.

Result – can’t use the Mac for Angular development since the debugger causes the api to fail. It looks for http://localhost:4200/api/quotes instead of http://localhost:3000.