检测浏览器中的 HTTP2/SPDY 支持答案

【问题标题】：Detect HTTP2/SPDY Support in Browser检测浏览器中的 HTTP2/SPDY 支持
【发布时间】：2015-01-28 10:33:11
【问题描述】：

是否可以从浏览器中检测到浏览器对 HTTP2/SPDY 客户端的支持？

我试图向用户展示他们的浏览器是支持 HTTP2/SPDY 还是会使用传统的非 HTTP2/SPDY HTTPs 协议。

【问题讨论】：

客户端不是总是意味着浏览器中的 JavaScript 吗？

标签： nginx http2 spdy

【解决方案1】：

不，不是真的。至少以有意义或可操作的方式。

前端 javascript 将在服务器已经为所有资产提供服务后运行。您想做的所有事情都将在服务器端完成。符合 SPDY 的浏览器应自动与 SPDY 服务器协商。

您需要做的就是将其配置为这样做（nginx 和 apache）。您还可以将 Alternate-Protocol 标头与您的 https 响应一起发送。如果可能的话，这将使浏览器在未来响应 SPDY 请求（我在更新的 SPDY 规范中找不到，所以这可能是过时的信息。带盐）。

如果您想知道某个站点是否已使用 SPDY 提供服务，则在 chrome 中可以使用 chrome.loadTimes().wasFetchedViaSpdy（显然仅适用于 chrome）。对于 firefox 和 safari，您必须检查标头（据我所知，没有类似的 api，尽管存在 plugins 可以为您执行此操作）。 SPDYCheck 是另一个很好的资源来测试服务器是否设置正确。

【讨论】：

【解决方案2】：

谢谢，帕特里克。我听取了您的建议并利用了 nginx 的 $http2 变量并使用 PHP 返回一个动态 JS 变量以供浏览器检测。（如果其他读者愿意，也可以选择传递 cookie 或添加响应头以进行 AJAX 检测）。

NGINX 配置添加

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;
}

检测-http2.js.php

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

检测-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>

【讨论】：