HTTP是应用层协议,是基于TCP底层协议而来。

TCP的机制限定,每建立一个连接需要3次握手,断开连接则需要4次挥手。

HTTP协议采用“请求-应答”模式,HTTP1.0下,HTTP1.1非Keep-Alive模式下,每个请求都要新建一个连接,完成之后立即断开连接。如果有新的请求,则要重新创建请求连接(HTTP协议为无连接的协议)。

这样不免造成了网络传输数据一定的延迟,1999年推出HTTP1.1,虽然可以通过设置延迟时间,让连接延迟关闭。但仍然有线头阻塞,max-connection最大连接限制了并行请求数量等痛点,难以应对日益增长的大数据实时传输。

新一代HTTP2.0协议应运而生,提高HTTP应对高并发场景下的数据传输能力。

「 HTTP1.1」

Pipelining管道化

提出管道化方案解决连接延迟,服务端可设置Keep-Alive来让连接延迟关闭时间,但因为浏览器自身的Max-Connection最大连接限制,同一个域名 (host) 下的请求连接限制(同域下谷歌浏览器是一次限制最多6个连接),只能通过多开域名来实现,这也就是我们的静态资源选择放到CDN上或其它域名下,来提高资源加载速度。

pipelining方案需要前后端支持,但绝大部分的HTTP代理器对pipelining的支持并不友好。

只支持GET/HEAD

pipelining只支持GET/HEAD方式传送数据,不支持POST等其它方式传输。

头部信息冗余

HTTP是无状态的,客户端/服务端只能通过HEAD的数据维护获取状态信息,这样就造成每次连接请求时都会携带大量冗余的头部信息,头部信息包括COOKIE信息等。

超文本协议

HTTP1.X是超文本协议传输。超文本协议传输,发送请求时会找出数据的开头和结尾帧的位置,并去除多余空格,选择最优方式传输。如果使用了HTTPS,那么还会对数据进行加密处理,一定程度上会造成传输速度上的损耗。

线头阻塞

pipelining通过延迟连接关闭的方案,虽然可同时发起对服务端的多个请求,但服务端的response依旧遵循FIFO(first in first out)规则 依次返回。

举个例子客户端发送了1、2、3、4四个请求,如果1没返回给客户端,那么2,3,4也不会返回。这就是所谓的线头阻塞。高并发高延迟的场景下阻塞明显。

HTTP1.X传输优化方法

  1. 多个资源合并成一个请求连接,如前端Spriting雪碧图,JS/CSS压缩成一个文件等
  2. Inlining内联的方式,采用inline css/inline js等并入html中,减少对css/js文件的请求
  3. CDN资源多域名转发,静态资源分布存储在多个域下。

以上三种三种方法虽然能使HTTP1.X协议传输速度提高,但也有对应的不足。

  1. 如雪碧图,将多个小图合并成一张大图,降低多张小图请求的高延迟,但是如果我只想要两个icon小图,却需要加载一整张大图,就会造成资源冗余。合并的JS/CSS文件也有类似的问题。
  2. 内联的方式,会让我们的代码变得难以维护,让html文件变得更大,代码混合严重。
  3. 多域名下可缓解Max-Connection,但不同域会让Cookie信息无法彼此共享。

了解完HTTP1.1的痛点,接下来就是我们新一代的HTTP协议HTTP2.0


「 HTTP2.0」

前身SPDY

SPDY是2012年谷歌推出的是基于SSL/TLS的传输协议,SPDY有降低延迟,多路复用,头部压缩,服务端推送等特点,这些特点也称为了后续HTTP2.0的功能基石,HTTP2.0是SPDY/3 draft的优化版。

HTTP2.0 与 SPDY的区别:

  1. HTTP2.0 头部压缩采用HPACK, 而SPDY采用DELEFT。
  2. HTTP2.0 理论上支持明文HTTP传输,而SPDY强制使用HTTPS。

多路复用

(一个域只要一个TCP连接)实现真正的并发请求,降低延时,提高了带宽的利用率。

头部压缩

客户端/服务端进行渐进更新维护,采用HPACK压缩,节省了报文头占用流量。

  1. 相同的头部信息不会通过请求发送,延用之前请求携带的头部信息。
  2. 新增/修改的头部信息会被加入到HEAD中,两端渐进更新。

两端会共同维护一个head list,每次请求时都会进行检查。
该list包括:

  1. static (既定的头部信息)
  2. dynamic (自定义的头部信息)

请求优先级

每个流都有自己的优先级别,客户端可指定优先级。并可以做流量控制。因为HTTP2.0的传世允许请求并发,但是应用场景中我们要处理一些主要文件的优先级权重,以及资源模块依赖等。所以我们可通过设置优先级来提高主要文件的权重,使其优先加载请求。

服务端推送

请求不是来自客户端“明确”的请求,是从服务端PUSH_PROMISE帧中提供。例如我们加载index.html, 我们可能还需要index.js, index.css等文件。传统的请求只有当拿到index.html,解析html中对index.js/index.css的引入才会再请求资源加载,但是通过服务端数据,可以提前将资源推送给客户端,这样客户端要用到的时候直接调用即可,不用再发送请求。

  • push的资源能缓存在浏览器中
  • 不同的网页能使用该缓存,不用重新发起
  • push的资源通过multiplexed进行传输
  • push的资源能够进行priority标识
  • client有权取消push资源的加载
  • push的资源必须同域

二进制协议

HTTP2.0 传输协议采用二进制协议,区别与HTTP1.X的超文本协议。更易于帧,数据包的发送接收。HTTP2.0是运行在TCP连接上的应用层协议,接受服务器或发送请求时,会自动将头部信息/request body分成HEAD帧和DATA帧。

客户端/服务端发送/接收数据时,会将数据打散乱序发送,接收数据时接收一端再通过streamID标识来将数据合并。

HTTP2.0环境要求

HTTP2.0理论上支持明文HTTP传输,但因为其前身SPDY是在TLS上,他们的主人Google 和 Firefox 都支持TLS架构,所以需要搭建HTTP2.0 + TLS成了标准。

  1. Nginx > 1.10
  2. OpenSSL > 1.0.2
  3. CA证书

参考文档

作者:以乐之名
本文原创,有不当的地方欢迎指出。转载请指明出处。

杂谈:HTTP1.1 与 HTTP2.0 知多少?的更多相关文章

  1. Web 协议 HTTP1.0 HTTP1.1 SPDY HTTP2.0

    Web 协议 HTTP1.0 HTTP1.1 SPDY HTTP2.0 HTTP1.0 VS HTTP1.1 长连接HTTP 1.0需要使用keep-alive参数来告知服务器端要建立一个长连接,而H ...

  2. HTTP、HTTP1.0、HTTP1.1、HTTP2.0——笔记

    笔记来源地址:https://mp.weixin.qq.com/s/T2IErLDxbWP1a-VbRkZZHg HTTP: HTTP是WWW数据通信的基础,是应用层协议. HTTP是干什么的?用来给 ...

  3. Http1.1和http2.0

    HTTP2.0 最近在读一本书叫<web性能权威指南>谷歌公司高性能团队核心成员的权威之作. 一直听说HTTP2.0,对此也仅仅是耳闻,没有具体研读过,这次正好有两个篇章,分别讲HTTP1 ...

  4. HTTP1.0和HTTP1.1以及HTTP2.0的区别

    (1)连接方面 HTTP1.0使用非持久连接,即在非持久连接下,一个tcp连接只传输一个Web对象.每次请求和响应都需要建立一个单独的连接,每次连接只是传输一个对象,严重影响客户机和服务器的性能. H ...

  5. http1.1与http2.0

    简介 http1.0: 1.0版本中每个TCP连接只能发送一个请求,数据发送完毕连接就关闭,如果还要请求其他资源,就必须重新建立TCP连接.(TCP为了保证正确性和可靠性需要客户端和服务器三次握手和四 ...

  6. HTTP1.0和HTTP1.1和HTTP2.0的区别

    1 HTTP1.0和HTTP1.1的区别1.1 长连接(Persistent Connection)       HTTP1.1支持长连接和请求的流水线处理,在一个TCP连接上可以传送多个HTTP请求 ...

  7. HTTP发展史,HTTP1.1与HTTP2.0的区别

    前言 我们知道HTTP是浏览器中最重要且使用最多的协议,它不仅是浏览器与服务端的通信语言,更是互联网的基石.随着浏览器的不断更新迭代,HTTP为了适应技术的更新也在不断进化,学习HTTP的最佳途径就是 ...

  8. HTTP1.0、HTTP1.1 和 HTTP2.0 的区别

    一.HTTP的历史 早在 HTTP 建立之初,主要就是为了将超文本标记语言(HTML)文档从Web服务器传送到客户端的浏览器.也是说对于前端来说,我们所写的HTML页面将要放在我们的 web 服务器上 ...

  9. HTTP1.0、HTTP1.1和HTTP2.0的区别

    一.HTTP的历史 早在HTTP建立之初,主要就是为了将超文本标记语言(HTML)文档从Web服务器传送到客户端的浏览器.也是说对于前端来说,我们所写的HTML页面将要放在我们的web服务器上,用户端 ...

随机推荐

  1. 学习node.js的C++扩展

    本想买本书,可是太贵,了一下作者可惜没有回应,不然也会去支持一下.于是自己baidu罗.先是从这个入手 安装好环境 https://github.com/nodejs/node-gyp#install ...

  2. 合理提升WEB前端性能

    前端的优化包括四个部分:HTML结构优化.CSS样式优化.JS行为优化.服务器的优化.合理的前端优化不仅能够提升网站加载速度,而且能够更好的提升用户体验和团队开发效率.所以前端性能优化的重要性是不言而 ...

  3. day30(对象转json(java))

    转换之前需要知道什么是json json类似于map集合:键值对的方式存在,是一种轻量级数据交互格式. eg: {name:" ",age:15} [{name:" &q ...

  4. hdu 5087 次长升序串的长度

    http://acm.hdu.edu.cn/showproblem.php?pid=5087 求数列次长升序串的长度 还是dp求最长升序串的长度,再开一个数组记录对于dp值的串的个数 最后看一下最长字 ...

  5. whu暑期集训#1

    题号:SGU123----SGU131 Problem A: 题意:求斐波那契的前N项和.. 做法:直接模拟,注意得用long long Problem B: 题意:给定一个封闭的多边形,求一个点在不 ...

  6. PhantomJS快速入门-无界面浏览器

    https://blog.csdn.net/libsyc/article/details/78199850 PhantomJS快速入门 本文简要介绍了PhantomJS的相关基础知识点,主要包括Pha ...

  7. cxGrid控件过滤排序和TClientDataSet同步

    https://www.cnblogs.com/false/archive/2013/02/24/2924240.html procedure TReport10Form.cxGridViewData ...

  8. 通过 sysprocesses 简单查询死锁及解决死锁办法

    简单查询死锁,如下四步可以轻松解决: 第一步:查询死锁语句 1: 条件是 blocked <> 0 select dbid,* from sys.sysprocesseswhere 1=1 ...

  9. 利用CPaintDC::IntersectClipRect将绘图限制在局部区域

    问题背景:画带坐标的图,例如 画里面那条曲线的时候,希望将绘图区域局限在坐标范围内,范围外的就自动屏蔽掉. 两个方案,一是用CPaintDC的SelectClipRgn函数,感觉略麻烦.另一个函数,就 ...

  10. WPF Command CanExecute 触发一次的问题

    昨天在项目中遇到一个问题,按钮bind了Command后,利用CanExecute控制它的是否可点击.结果却在初始化viewmodel的时候执行了一次CanExecute,之后一直不触发,按钮的可用性 ...