明月登楼

体验Nginx 1.13.9的HTTP/2 server push
最近刚上班就发现 Nginx 的 Mainline version 已经升级更新到了 1.13.9 了,并且这个版...
扫描右侧二维码阅读全文
23
2018/02

体验Nginx 1.13.9的HTTP/2 server push

最近刚上班就发现 Nginx 的 Mainline version 已经升级更新到了 1.13.9 了,并且这个版本开始支持 HTTP/2 server push 了,于是毫不犹豫的立马更新至 1.13.9 了,准备尝试一下这个 HTTP/2 server push 。

HTTP/2 规范中定义的服务器推送允许服务器抢先将资源推送到远程客户端,预计客户端可能很快会请求这些资源.通过这样做,您可以在页面加载操作中将 RTT (往返时间 - 请求和响应所需的时间)减少一个RTT或更多,从而为用户提供更快的响应。

Server Push是什么。

简单来讲就是当用户的浏览器和服务器在建立链接后,服务器主动将一些资源推送给浏览器并缓存起来,这样当浏览器接下来请求这些资源时就直接从缓存中读取,不会在从服务器上拉了,提升了速率。举一个例子就是:
假如一个页面有3个资源文件index.html,index.css,index.js,当浏览器请求index.html的时候,服务器不仅返回index.html的内容,同时将index.css和index.js的内容push给浏览器,当浏览器下次请求这2两个文件时就可以直接从缓存中读取了。

配置HTTP/2 server push

server {
        location / {
        http2_push /usr/uploads/logo/favicon.ico;
        http2_push /usr/themes/handsome/assets/css/function.min.css;
        http2_push /usr/themes/handsome/assets/css/handsome.min.css;
        http2_push /usr/themes/handsome/assets/css/features/jquery.fancybox.min.css;
        http2_push /usr/themes/handsome/assets/css/font.css;
        http2_push /usr/themes/handsome/assets/js/features/jquery.pjax.min.js;
        http2_push /usr/themes/handsome/assets/js/features/SmoothScroll.js;
        http2_push /usr/themes/handsome/assets/js/features/jquery.fancybox.min.js;
        http2_push /usr/themes/handsome/assets/js/music.min.js;
        http2_push /usr/themes/handsome/assets/js/function.min.js;
        http2_push /usr/themes/handsome/assets/js/core.min.js;
        }  
}

使用浏览器开发人员工具进行验证(Google Chrome)

20180223020734.png

HTTP/2 Server Push 意味着什么?

5a8d66382b54a.png

最后修改:2018 年 02 月 23 日 02 : 11 AM
如果觉得我的文章对你有用,请随意赞赏

发表评论

8 条评论

  1. 明月登楼

    这个目前好像还没有办法,理论上浏览器缓存应该也是有时效性的吧!

    1. puffbaby
      @明月登楼

      另外一个,通过chrome的控制台elements 的initiator指示器没看到有push字样。官方https://www.nginx.com/blog/nginx-1-13-9-http2-server-push/
      这里有个验证方法。为什么博主的看不到?话说我这边弄了也验证不出来

      1. 明月登楼
        @puffbaby

        呵呵,我也比较迷茫,据说需要使用的CDN支持的!

  2. puffbaby

    速度似乎提升一点,这起等于是服务器端的并行发送了,另外,如果资源文件有变化了,会怎么样呢?

  3. 薅羊毛

    看不懂怎么配置, 是升级就可以 ,还是需要改动什么?

    1. 明月登楼
      @薅羊毛

      升级提供支持,然后在Nginx的站点配置文件里根据情况调用和启用!

      1. 薅羊毛
        @明月登楼

        上面那个配置文件是在80端口下面配置 还是443端口

        1. 明月登楼
          @薅羊毛

          HTTP/2是HTTPS的扩展强化,所以必须是443端口下的了!