http2相关协议详解（express中开启http2流程）

最近想玩点新花样，所以就想搞下http2，之前公司也有搞过go语言的，一直对https和http2比较好奇，就锤了下。

http2.0与1.1的性能对比这里有个从别人那里抄来的demo地址，上面分别使用和http1.1和http2来加载较大量的图片请求，差不多400个图片，http2的传输速度差不多是http1.1的2-4倍，极大地减少了网络的延迟。

http2历史及相关技术

2009年，谷歌公开了自行研发的 SPDY 协议，作为http2的前身他瞄准http1.x的痛点:高延迟，原因有2个

1.浏览器阻塞（HOL blocking）：浏览器会因为一些原因阻塞请求。浏览器对于同一个域名一般同时只能有4-6 个连接(下面盗了一个图)，超过浏览器最大连接数限制，后续请求就会被阻塞,这个被称作线头阻塞head of line block。



2.建立连接（Initial connection）：HTTP 是基于 TCP 协议的，浏览器最快也要在第三次握手时才能捎带 HTTP 请求报文，达到真正的建立连接，但是这些连接无法复用会导致每次请求都经历三次握手和慢启动。三次握手在高延迟的场景下影响较明显，慢启动则对文件类大请求影响较大

spdy被当作 HTTP/2 的基础，有不少改进(可以不看，我抄的)

1：降低延迟，针对HTTP高延迟的问题，SPDY优雅的采取了多路复用（multiplexing）。多路复用通过多个请求stream共享一个tcp连接的方式，解决了线头阻塞的问题，降低了延迟同时提高了带宽的利用率。

2.请求优先级（request prioritization）。多路复用带来一个新的问题是，在连接共享的基础之上有可能会导致关键请求被阻塞。SPDY允许给每个request设置优先级，这样重要的请求就会优先得到响应。比如浏览器加载首页，首页的html内容应该优先展示，之后才是各种静态资源文件，脚本文件等加载，这样可以保证用户能第一时间看到网页内容。

3.header压缩。使用了Hpack压缩算法可以减小http的大小和数量。

4.基于HTTPS的加密协议传输，大大提高了传输数据的可靠性。

5.服务端推送（server push），采用了SPDY的网页，例如我的网页有一个sytle.css的请求，在客户端收到sytle.css数据的同时，服务端会将sytle.js的文件推送给客户端，当客户端再次尝试获取sytle.js时就可以直接从缓存中获取到，不用再发请求了。

http2新特性

1.新的二进制格式（Binary Format），HTTP1.x的解析是基于文本。基于文本协议的格式解析存在天然缺陷，文本的表现形式有多样性，要做到健壮性考虑的场景必然很多。基于这种考虑HTTP2.0的协议解析决定在 应用层(HTTP/2)和传输层(TCP or UDP)之间采用二进制格式，实现方便且健壮。在 应用层(HTTP/2)和传输层(TCP or UDP)之间。

2.多路复用（MultiPlexing），即连接共享，即每一个request都是是用作连接共享机制的。一个request对应一个id，这样一个连接上可以有多个request，每个连接的request可以随机的混杂在一起，接收方可以根据request的 id将request再归属到各自不同的服务端请求里面。单链接是的内存更少，吞吐量变大。



3.header压缩，HTTP1.x的header带有大量信息，而且每次都要重复发送，HTTP2.0使用encoder来减少需要传输的header大小，通讯双方各自cache一份header fields表，既避免了重复header的传输，又减小了需要传输的大小。SPDY/2使用的是gzip压缩算法，但后来出现的两种攻击方式BREACH和CRIME使得即使走ssl的SPDY也可以被破解内容，最后综合考虑采用的是一种叫HPACK的压缩算法。这两个漏洞和相关算法可以点击链接查看更多的细节，不过这种漏洞主要存在于浏览器端，因为需要通过javascript来注入内容并观察payload的变化。

4.服务端推送（server push），同SPDY一样，HTTP2.0也具有server push功能。目前，有大多数网站已经启用HTTP2.0，例如YouTuBe，淘宝网等网站，利用chrome控制台可以查看是否启用H2：

Linux生成证书

linux中输入下列代码，如果openssl不能使用的话，安装下，这里我就不搞了，我用的是xx云
[root]#  openssl genrsa -des3 -passout pass:x -out server.pass.key 2048
[root]#  openssl rsa -passin pass:x -in server.pass.key -out server.key
writing RSA key
[root]#  openssl req -new -key server.key -out server.csr
// 国家名CN
Country Name (2 letter code) [AU]:CN
// 省，我江苏的
State or Province Name (full name) [Some-State]:Jiangsu
// 城市
Locality Name (eg, city): suzhou
// 下面回车到底，可以不填
[root]#  openssl x509 -req -sha256 -days 3650 -in server.csr -signkey server.key -out server.crt

产生了三个文件

server.crt

server.csr

server.key

EXPRESS代码

express脚手架

安装http2相关库执行npm install sdpy –save-dev

//生成一个express项目
//在bin/www头部加上
const http2 = require('spdy'),
fs = require('fs');

//把上面linux生成的几个文件放到该项目的key文件夹里
//var server = http.createServer(app);上面加一个options读取两个验证文件
const options = {
key: fs.readFileSync('./key/server.key'),
cert: fs.readFileSync('./key/server.crt')
}
//var server = http.createServer(app);替换成下面这个
const server = http2.createServer(options, app);

然后打开https://localhost:3000，这个service下的文件都是http2的了，在浏览器里查看,如果为h2就是开启成功了，如果浏览器里没有Protocol就右键点上面，然后勾选



HTTP/2.0 相比1.0有哪些重大改进？

HTTP,HTTP2.0,SPDY,HTTPS你应该知道的一些事

关于请求被挂起页面加载缓慢问题的追查

浏览器允许的并发请求资源数是什么意思？