ng serve does not respond to http2 headers #21293

judos · 2021-07-06T14:53:13Z

🐞 Bug report

Command (mark with an `x`)

serve

Is this a regression?

Unsure.

Description

ng serve does not respond to requests containing both of these headers:

Connection: Upgrade, HTTP2-Settings
Upgrade: h2c

This happens when specific clients connect to Angular such as Java Rest clients (java.net.http.HttpClient)

🔬 Minimal Reproduction

Setup a new Angular project. Dependencies see below package.json file. (probably doesn't matter too much).
Serve the project:

ng serve

Curl to get responses. First without http2 headers works fine:

$ curl -sv "http://localhost:4200"
*   Trying 127.0.0.1:4200...
* TCP_NODELAY set
* Connected to localhost (127.0.0.1) port 4200 (#0)
> GET / HTTP/1.1
> Host: localhost:4200
> User-Agent: curl/7.68.0
> Accept: */*
>
* Mark bundle as not supporting multiuse
< HTTP/1.1 200 OK
< X-Powered-By: Express
< Access-Control-Allow-Origin: *
< Accept-Ranges: bytes
< Content-Type: text/html; charset=UTF-8
< Content-Length: 530
< ETag: W/"212-LsOzC7gYUUzQpCEaiFFaZD+o1Zc"
< Date: Tue, 06 Jul 2021 14:48:06 GMT
< Connection: keep-alive
< Keep-Alive: timeout=5
<
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Test</title>
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="styles.css"></head>
<body>
  <app-root></app-root>
<script src="runtime.js" defer></script><script src="polyfills.js" defer></script><script src="styles.js" defer></script><script src="vendor.js" defer></script><script src="main.js" defer></script></body>
</html>
* Connection #0 to host localhost left intact

Second with Http2 headers gets stuck and never returns:

$ curl -sv "http://localhost:4200" -H "Connection: Upgrade, HTTP2-Settings" -H "Upgrade: h2c"
*   Trying 127.0.0.1:4200...
* TCP_NODELAY set
* Connected to localhost (127.0.0.1) port 4200 (#0)
> GET / HTTP/1.1
> Host: localhost:4200
> User-Agent: curl/7.68.0
> Accept: */*
> Connection: Upgrade, HTTP2-Settings
> Upgrade: h2c
>

🔥 Exception or Error


None, no response is returned by ng serve. Connection is left open. ng serve --verbose=true does not report any warning or error

🌍 Your Environment


Angular CLI: 11.2.5
Node: 14.17.0
OS: win32 x64

Angular: 11.2.6
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1102.5
@angular-devkit/build-angular   0.1102.5
@angular-devkit/core            11.2.5
@angular-devkit/schematics      11.2.5
@angular/cli                    11.2.5
@schematics/angular             11.2.5
@schematics/update              0.1102.5
rxjs                            6.6.6
typescript                      4.1.5

Anything else relevant?

Here's my package.json:

{
  "name": "test",
  "version": "0.0.1",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build-test": "ng build",
    "build": "ng build --prod"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~11.2.6",
    "@angular/common": "~11.2.6",
    "@angular/compiler": "~11.2.6",
    "@angular/core": "~11.2.6",
    "@angular/forms": "~11.2.6",
    "@angular/platform-browser": "~11.2.6",
    "@angular/platform-browser-dynamic": "~11.2.6",
    "@angular/router": "~11.2.6",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.11.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1102.5",
    "@angular/cli": "~11.2.5",
    "@angular/compiler-cli": "~11.2.6",
    "@types/jasmine": "~3.6.0",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~6.1.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.1.5"
  }
}

The text was updated successfully, but these errors were encountered:

alan-agius4 · 2021-07-06T15:33:22Z

Both webpack-dev-server and express which are used under the hood don't support HTTP2.

From
https://webpack.js.org/configuration/dev-server/#devserverhttp2

Serve over HTTP/2 using spdy. This option is ignored for Node 10.0.0 and above, as spdy is broken for those versions. The dev server will migrate over to Node's built-in HTTP/2 once Express supports it.

Related issues
expressjs/express#2761
webpack/webpack-dev-server#1713

judos · 2021-07-06T19:57:55Z

Ok sure. but how about logging something such that it is easier to see why suddenly nothing works?
I takes hours to debug such an issue when there is zero information in logs.

In Java you can workaround using this code when building your request:

HttpRequest.newBuilder(URI(uri)).version(HttpClient.Version.HTTP_1_1)

angular-automatic-lock-bot · 2021-08-06T08:03:55Z

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

alan-agius4 closed this as completed Jul 6, 2021

angular-automatic-lock-bot bot locked and limited conversation to collaborators Aug 6, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

ng serve does not respond to http2 headers #21293

ng serve does not respond to http2 headers #21293

judos commented Jul 6, 2021 •

edited

alan-agius4 commented Jul 6, 2021

judos commented Jul 6, 2021

angular-automatic-lock-bot bot commented Aug 6, 2021

ng serve does not respond to http2 headers #21293

ng serve does not respond to http2 headers #21293

Comments

judos commented Jul 6, 2021 • edited

🐞 Bug report

Command (mark with an x)

Is this a regression?

Description

🔬 Minimal Reproduction

🔥 Exception or Error

🌍 Your Environment

alan-agius4 commented Jul 6, 2021

judos commented Jul 6, 2021

angular-automatic-lock-bot bot commented Aug 6, 2021

judos commented Jul 6, 2021 •

edited

Command (mark with an `x`)