Detect HTTP2/SPDY Support in Browser

问题

Is it possible to detect a browser's support for HTTP2/SPDY client-side from within the browser?

I am attempting to show users whether their browser supports HTTP2/SPDY or would use the traditional, non-HTTP2/SPDY HTTPs protocol.

回答1:

No, not really. At least in a way that is meaningful or actionable.

Frontend javascript would be running after the server has already served all of the assets. Everything you want to be doing will be done on the server side. A SPDY compliant browser should negotiate with a SPDY server automagically.

All you need to do is configure it to do so (nginx, and apache). You can also send the Alternate-Protocol header with your https responses. That would have the browser respond with SPDY requests in the future if possible (I can't find that in the updated SPDY spec, so that may be outdated information. Take with salt).

If you wanted to know if a site has been served with SPDY, in chrome there is chrome.loadTimes().wasFetchedViaSpdy (obviously only works in chrome). For firefox and safari you would have to inspect the headers (as far as I know there is not a similar api, though plugins exist to do this for you). SPDYCheck is another great resource to test if the server has been setup correctly.

回答2:

Thanks, Patrick. I took your advice and leveraged nginx's $http2 variable and used PHP to return a dynamic JS variable for the browser's detection. (Passing a cookie or adding a response header for AJAX detection are also options if other readers prefer).

NGINX config additions

server {
    ...

    if ($http2) { 
        rewrite ^/detect-http2.js /detect-http2.js.php?http2=$http2 last;
    }
    # fallback to non-HTTP2 rewrite
    rewrite ^/detect-http2.js /detect-http2.js.php last;

    # add response header if needed in the future
    add_header x-http2 $http2;
}

detect-http2.js.php

<?
    header('content-type: application/javascript');
    if (isset($_REQUEST['http2'])) {
        echo "var h2Version='". $_REQUEST['http2'] . "';\n";
    }
?>

detect-http2.html

<html>
    <body>
        <script src="https://DOMAIN_NAME/detect-http2.js"></script>
        <script>
            document.write('HTTP2-Supported Browser: '+ (typeof h2Version !== 'undefined'));
        </script>
    </body>
</html>

来源：https://stackoverflow.com/questions/27211134/detect-http2-spdy-support-in-browser

标签

nginx

http2

spdy