HTTP/2 服务器推送实现

前言

HTTP/2.0发布于2015年，作为新一代HTTP协议，其由于推进互联网加密技术的使用，所以只能作用于https连接当中。HTTP/2.0提供HTTP语义的有效序列化，是一个二进制协议，所有的框架开始一个8字节的头，紧跟着的0和16.383个八位位组之间的有效载荷。当然HTTP的复用性也是其一大特点，而新定义的HTTP请求与响应映射到流的新互动模式，也就是我今天要说的服务器推送。

服务器推送

HTTP/2允许服务器在请求之前先推送响应信息到客户端（之前客户端有过请求），如果实现了HTTP缓存，推送的响应信息可以在客户端被缓存（可通过no-cache进行配置）。

（注意：HTTP/2是持久连接，为了实现最佳性能，预计客户端在确定不需要与服务器进一步通信时或者服务器关闭连接时才会关闭连接，所以客户端不应该打开多个同一IP与端口的连接。）

对于HTTP/2的推送详细说明在官方文档种过于繁杂，下面将以更为简单的方式来进行说明。

bg2018030501.png

普通请求

左图表示一个正常情况下的一个简单的页面请求，一个HTML页面我们要进行页面请求与页面包含的样式文件请求，如果有页面中有图片等页面文件时请求次数将会更多。

当然，我们可以通过

<link rel="preload" href="//www.greatytc.com/styles.css" as="style">

这种形式来进行资源预加载，但是不同类型的代码整合已经不符合代码规则，虽然速度有所提升，但是HTTP请求次数并没有减少。

服务器推送

右图中表示通过只通过一次HTML请求，就同时把样式、图片等全部发送给浏览器，通过一次通信获得所有资源。

实现方式

Nginx实现

在nginx的conf配置文件中，添加http2_push命令，表示请求根目录"/"时，会推送这两个文件。（如果有多个文目录时需要写多个，方法繁琐，每次修改都要重启，不推荐）

server {
    listen 443 ssl http2;
    ···//省略
    location / {
        ···//省略
        http2_push /style.css；
        http2_push /example.png;
    }
}

Apache 实现

在httpd.conf文件中加入(不推荐，理由同上)

<FilesMatch "\index.html$">
    Header add Link "<//www.greatytc.com/styles.css>; rel=preload; as=style"
    Header add Link "</example.png>; rel=preload; as=image"
</FilesMatch>

后端实现

通过在应用生成HTTP 回应的头信息中设置Link命令（推荐），服务器在收到包含Link的头信息时，就会进行推送,例如：

Link: <//www.greatytc.com/styles.css>; rel=preload; as=style, </example.png>; rel=preload; as=image

服务器推送方式据说可以提高8%左右的打开速度，有兴趣的朋友可以测试一下，有结果记得给我反馈一下哦。

更多精彩内容请关注“IT实战联盟”公众号哦~~~

img

最后编辑于：2018.03.16 17:09:25