How to implement HTTP/2 stream connection in browser?
Asked Answered
V

2

18

Nowadays HTTP/2 is rising as of its performance.

The recent version of Node.js supports HTTP/2 very well.

https://nodejs.org/api/http2.html

But I have no idea how to implement HTTP/2 client in the browser environment.

https://nodejs.org/api/http2.html#http2_client_side_example

The above link shows how to use it in Node.js client.

How can I implement the same client in the browser?

Venetian answered 11/9, 2018 at 9:47 Comment(6)
I don't think http2 client is available on browsers.Outfield
the browser will use http/2 if the server supports http/2 - one does not need to "implement a client" .. you just use XHR or fetch for exampleTauto
@JaromandaX fetch or XHR can not control push promises sent from server. I think providing a http2 client on browsers still makes sense.Outfield
or you can use websockets in that case @Outfield (what is a push promise?)Tauto
@JaromandaX I mean you can not control files served via http2 request without an http2 client (events for determining state of each server push, response of each server push, etc)Outfield
Many modern browsers support HTTP/2, so there should be some interfaces for it.Venetian
S
19

You can’t currently do this. In general HTTP/2 should be transparent in its use to web pages and web applications and so there is no need to implement low level HTTP/2 streams and connection details. That’s part of the beauty of the way it was implemented - the browser takes care of all this and the web page and web application has no need to know whether HTTP/1.1 or HTTP/2 was used.

A possible exception to that is, is HTTP/2 push and there was a proposal to expose HTTP/2 Push programmatically as part of the Web Hypertext Application Technology Working Group (WHATWG): https://github.com/whatwg/fetch/issues/51. Though activity on that seems to have dropped off completely. As there are a few complications in implementing a Push notification api. All in all HTTP/2 push is complicated, especially because of different browser implementations and bugs, so trying to expose push messages to a web application is going to be complicated. There are also many who feel HTTP/2 push has limited use and there are better technologies for most use cases, such as resource hints (for requesting HTTP resources) or web sockets (for two way comms). Chrome are even experimenting with switching it off completely.

Other than push, prioritization might be another use case for exposing low level HTTP/2 details to web applications and perhaps priority hints will provide a mapping for that eventually, without tying it to HTTP/2 (so it can be used under HTTP/1.1, QUIC or whatever comes in the future).

So IMHO, I don’t see a pressing need to allow creating or managing of an HTTP/2 connection from a web application in the same way that there is not a simple way (AFAIK) of creating a TCP or UDP connection from JavaScript. While that remains the case I don’t think we’ll see much effort to create such a implementation. Even the HTTP/2 client you link to is very basic and just makes a HTTP request - which the browser already allows you to do (though I appreciate that node exposes more details should you want to go lower level than this while the browser does not). For the most part, HTTP/2 stream handling and other low-level details of the protocol probably are best handled transparently by the browser itself - as they are now.

Stu answered 12/9, 2018 at 21:16 Comment(4)
The need to a bi-di stream like that in HTTP/2 in a browser may arise from wanting to recreate the websocket functionality - currently with HTTP/2 that's not possible - (truly bi-di exchange of binary data).Goldstone
WebSockets are now possible with HTTP/2 (tools.ietf.org/html/rfc8441) though admittedly no browser has implemented them yet (Firefox has it coming in v65 apparently - bugzilla.mozilla.org/show_bug.cgi?id=1434137 and Chrome seems to have stalled on this bugs.chromium.org/p/chromium/issues/detail?id=801564). Websockets are probably the better option anyway rather than using HTTP, which has more overheads: #50957257Stu
that's great to know, thanks for the hint - I expect Chrome will catch up with Firefox with regards to websockets over HTTP/2. Good news altogether!Goldstone
My use case is a webapp based on wasm in which I want to use gRPC to communicate with a service.Perot
S
2

In the Client side:

You don't need to do anything in the browser, just use one that already supports the HTTP 2.0 protocol https://caniuse.com/#search=http2

In the Server side:

Depends on the server you are using you need to activate some modules and configurate some files, here you can see some links to server configurations: https://github.com/http2/http2-spec/wiki/Implementations

Regarding the Server Push functionality:

The same, It depends on the server but is important to note that you can configure a: Manual Push or an Automatic Push (Auto Push)

Examples:

Manual Push

server {    
    # whenever a client requests demo.html, also push
    # /style.css, /image1.jpg and /image2.jpg
    location = /demo.html {
        http2_push /style.css;
        http2_push /image1.jpg;
        http2_push /image2.jpg;
    }
}

Auto Push

server { 
    # Intercept Link header and initiate requested Pushes
    location = /myapp {
        proxy_pass http://upstream;
        http2_push_preload on;
    }
}

//httpd.conf or .htaccess (cuando se cargue un html)
<FilesMatch "\.html$">
    Header set Link "</css/styles.css>; rel=preload; as=style"
<FilesMatch>
Sundog answered 12/1, 2019 at 23:44 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.