CODEWITHSUNDEEP
node.jsangularangular15
Carla C
Carla C

Reputation: 199

Angular 15 / Node 18 proxy fails

I've recently updated my angular-14 app to angular 15 following this migration guide. I upgraded Node from 16.17.0 to 18.10.0 as well.

I've ran npm install and npm start and I'm getting errors when my app sends http requests:

[webpack-dev-server] [HPM] Error occurred while proxying request localhost:4200/api/physicians/ to [backend_server] [ETIMEDOUT] (https://nodejs.org/api/errors.html#errors_common_system_errors)

I'm using a proxy for my api calls, which worked well before migrating:


{
  "/api": {
    "target": "[backend_server]",
    "secure": true,
    "changeOrigin": true
  }
}

Here is my package.json:

{ 
   "dependencies": {
       "@angular/animations": "^15.0.0",
       "@angular/cdk": "^15.0.0",
       "@angular/common": "^15.0.0",
       "@angular/compiler": "^15.0.0",
       "@angular/core": "^15.0.0",
       "@angular/forms": "^15.0.0",
       "@angular/material": "^15.0.0",
       "@angular/platform-browser": "^15.0.0",
       "@angular/platform-browser-dynamic": "^15.0.0",
       "@angular/router": "^15.0.0",
       "rxjs": "~7.5.0",
       "tslib": "^2.3.0",
       "zone.js": "~0.11.4"
     },
     "devDependencies": {
       "@angular-devkit/build-angular": "^15.0.0",
       "@angular/cli": "~15.0.0",
       "@angular/compiler-cli": "^15.0.0",
       "@types/jasmine": "~4.0.0",
       "jasmine-core": "~4.3.0",
       "karma": "~6.4.0",
       "karma-chrome-launcher": "~3.1.0",
       "karma-coverage": "~2.2.0",
       "karma-jasmine": "~5.1.0",
       "karma-jasmine-html-reporter": "~2.0.0",
       "typescript": "~4.8.4"
     }
}

and my angular.json:

{
  "projects": {
    "app": {
      "architect": {
        "build": {...},
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "configurations": {
            "production": {
              "browserTarget": "app:build:production"
            },
            "development": {
              "browserTarget": "app:build:development"
            }
          },
          "defaultConfiguration": "development",
          "options": {
            "proxyConfig": "src/proxy.conf.json"
          }
        },
        "test": {...}
      }
    }
  }
}

Did I miss something during my app migration?

The issue occurs on windows and linux, after migrating node back to v16.17.0, the issue does not occur anymore.

Upvotes: 2

Views: 1931

Answers (1)

user472749
user472749

Reputation: 459

Updating the proxy config from localhost to 127.0.0.1 fixed the issue for us.

Upvotes: 3

Related Questions