技术控

    今日:105| 主题:49390
收藏本版 (1)
最新软件应用技术尽在掌握

[其他] HTTP2.0关于Server Push的研究

[复制链接]
时光熬人 发表于 2016-11-27 23:56:43
4 3

立即注册CoLaBug.com会员,免费获得投稿人的专业资料,享用更多功能,玩转个人品牌!

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
1,HTTP2的新特性。

  关于HTTP2的新特性,读着可以参看我之前的文章,这里就不在多说了,本篇文章主要讲一下server push这个特性。
      HTTPS与HTTP2的原理,搭建,性能测试对比  
      HTTP,HTTP2.0,SPDY,HTTPS你应该知道的一些事  
  2,Server Push是什么。

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

  要想了解server push原理,首先要理解一些概念。我们知道HTTP2传输的格式并不像HTTP1使用文本来传输,而是启用了二进制帧(Frames)格式来传输,和server push相关的帧主要分成这几种类型:
  
       
  • HEADERS frame(请求返回头帧):这种帧主要携带的http请求头信息,和HTTP1的header类似。   
  • DATA frames(数据帧) :这种帧存放真正的数据content,用来传输。   
  • PUSH_PROMISE frame(推送帧):这种帧是由server端发送给client的帧,用来表示server push的帧,这种帧是实现server push的主要帧类型。   
  • RST_STREAM(取消推送帧):这种帧表示请求关闭帧,简单讲就是当client不想接受某些资源或者接受timeout时会向发送方发送此帧,和PUSH_PROMISE frame一起使用时表示拒绝或者关闭server push。  
      Note:HTTP2.0相关的帧其实包括    10种帧,正是因为底层数据格式的改变,才为HTTP2.0带来许多的特性,帧的引入不仅有利于压缩数据,也有利于数据的安全性和可靠传输性。  
  了解了相关的帧类型,下面就是具体server push的实现过程了:

  
       
  • 由多路复用我们可以知道HTTP2中对于同一个域名的请求会使用一条tcp链接而用不同的stream ID来区分各自的请求。   
  • 当client使用stream 1请求index.html时,server正常处理index.html的请求,并可以得知index.html页面还将要会请求index.css和index.js。   
  • server使用stream 1发送PUSH_PROMISE frame给client告诉client我这边可以使用stream 2来推送index.js和stream 3来推送index.css资源。   
  • server使用stream 1正常的发送HEADERS frame和DATA frames将index.html的内容返回给client。   
  • client接收到PUSH_PROMISE frame得知stream 2和stream 3来接收推送资源。   
  • server拿到index.css和index.js便会发送HEADERS frame和DATA frames将资源发送给client。   
  • client拿到push的资源后会缓存起来当请求这个资源时会从直接从从缓存中读取。  
  下图表示了整个流程:
      HTTP2.0关于Server Push的研究-1 (浏览器,frame,服务器,server,二进制)  
  4,Server Push怎么用。

  既然server push这么神奇,那么我们如何使用呢?怎么设置服务器push哪些文件呢?
  首先并不是所有的服务器都支持server push,nginx目前还不支持这个特性,可以在nginx的官方博客上得到证实    https://www.nginx.com/blog/http2-r7/,但是Apache和nodejs都已经支持了server push这一个特性,需要说明一点的是server push这个特性是基于浏览器和服务器的,所以浏览器并没有提供相应的js api来让用户直接操作和控制push的内容,所以只能是通过header信息和server的配置来实现具体的push内容,本文主要以nodejs来说明具体如何使用server push这一特性。  
  准备工作:下载    nodejs http2支持,本地启动nodejs服务。  
  1. 首先我们使用nodejs搭建基本的server:

  [code]var http2 = require('http2');

var url=require('url');
var fs=require('fs');
var mine=require('./mine').types;
var path=require('path');

var server = http2.createServer({
  key: fs.readFileSync('./zs/localhost.key'),
  cert: fs.readFileSync('./zs/localhost.crt')
}, function(request, response) {
    var pathname = url.parse(request.url).pathname;
    var realPath = path.join("my", pathname);    //这里设置自己的文件名称;

    var pushArray = [];
    var ext = path.extname(realPath);
    ext = ext ? ext.slice(1) : 'unknown';
    var contentType = mine[ext] || "text/plain";

    if (fs.existsSync(realPath)) {

        response.writeHead(200, {
            'Content-Type': contentType
        });

        response.write(fs.readFileSync(realPath,'binary'));

    } else {
      response.writeHead(404, {
          'Content-Type': 'text/plain'
      });

      response.write("This request URL " + pathname + " was not found on this server.");
      response.end();
    }

});

server.listen(443, function() {
  console.log('listen on 443');
});[/code]  这几行代码就是简单搭建一个nodejs http2服务,打开chrome,我们可以看到所有请求都走了http2,同时也可以验证多路复用的特性。
HTTP2.0关于Server Push的研究-2 (浏览器,frame,服务器,server,二进制)  
  这里需要注意几点:

  
       
  • 创建http2的nodejs服务必须时基于https的,因为现在主流的浏览器都要支持SSL/TLS的http2,证书和私钥可以自己通过      OPENSSL生成。   
  • node http2的相关api和正常的node httpserver相同,可以直接使用。  
  2. 设置我们的server push:
  [code]var pushItem = response.push('/css/bootstrap.min.css', {
            request: {
                accept: '*/\*'
            },
            response: {
                'content-type': 'text/css'
            }
        });
        pushItem.end(fs.readFileSync('/css/bootstrap.min.css','binary'));[/code]  我们设置了bootstrap.min.css来通过server push到我们的浏览器,我们可以在浏览器中查看:
12下一页
友荐云推荐




上一篇:Bra-Ket Notation Trivializes Matrix Multiplication
下一篇:Interactive Console Applications in Java
酷辣虫提示酷辣虫禁止发表任何与中华人民共和国法律有抵触的内容!所有内容由用户发布,并不代表酷辣虫的观点,酷辣虫无法对用户发布内容真实性提供任何的保证,请自行验证并承担风险与后果。如您有版权、违规等问题,请通过"联系我们"或"违规举报"告知我们处理。

yukirin 发表于 2016-11-28 06:57:35
我用手机上酷辣虫,好好用
回复 支持 反对

使用道具 举报

我爱你李翠鸣 发表于 2016-11-28 22:17:20
恋爱就是无数个饭局,结婚就是一个饭局。  
回复 支持 反对

使用道具 举报

DTea 发表于 2016-11-29 01:55:06
再过一遍。。。
回复 支持 反对

使用道具 举报

*滑动验证:
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

我要投稿

推荐阅读

扫码访问 @iTTTTT瑞翔 的微博
回页顶回复上一篇下一篇回列表手机版
手机版/CoLaBug.com ( 粤ICP备05003221号 | 文网文[2010]257号 )|网站地图 酷辣虫

© 2001-2016 Comsenz Inc. Design: Dean. DiscuzFans.

返回顶部 返回列表