继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

基于http/1.1协议长链接案例分析

五月君
关注TA
已关注
手记 120
粉丝 7785
获赞 2338

http的请求是在tcp链接之上进行发送,tcp链接分为长链接、短链接的概念,http发送请求的时候会先创建一个tcp链接,在tcp连接上把http请求的内容发送,并接收返回,这个时候一次请求就结束了,浏览器会和服务端商量,要不要把这次tcp链接给关闭到,如果不关闭,这个tcp链接就会一直开着,会有消耗,但是接下去如果还有请求,就可以直接在这个tcp链接上进行发送,那么就不需要经过三次握手这样的一个链接消耗,而如果直接关闭,那么在下次http请求的时候就需要在创建一个tcp链接,长链接是可以设置timeout的,可以设置多长时间在这个tcp链接上没有新的请求就会关闭。

http/1.1

http/1.1的链接在tcp上去发送请求是有先后顺序的,例如你有10个请求是不可以并发的在一个tcp链接上去发送,浏览器是可以允许并发的创建一个tcp链接,chrome允许的是6个,一次性的并发,如果你有10个只能等前面6个其中一个完成,新的请求在进去。

http/1.1长链接示例

  • connection.html
<html>
    <head>
        <meta charset="utf-8" />
        <title>Connection</title>
    </head>
    <body>
        <img src="/test1.jpg" alt="" />
        <img src="/test2.jpg" alt="" />
        <img src="/test3.jpg" alt="" />
        <img src="/test4.jpg" alt="" />
        <img src="/test5.jpg" alt="" />
        <img src="/test6.jpg" alt="" />
        <img src="/test7.jpg" alt="" />
        <img src="/test8.jpg" alt="" />
    </body>
</html>
  • connection.js
const http = require('http');
const fs = require('fs');
const port = 3010;

http.createServer((request, response) => {
    console.log('request url: ', request.url);

    const html = fs.readFileSync('./connection.html', 'utf-8');
    const img = fs.readFileSync('./test_img.jpg');

    if (request.url === '/') {
        response.writeHead(200, {
            'Content-Type': 'text/html',
        });

        response.end(html);
    } else {
        response.writeHead(200, {
            'Content-Type': 'image/jpg'
        });

        response.end(img);
    }
}).listen(port);

console.log('server listening on port ', port);
  • 返回结果

可以看到第一次图片加载时复用了第一次localhost的tcp链接,最后两张图片一直在等待前面的tcp链接完成,有一定的响应等待

图片描述

http/2

在http/2中有了一个新的概念<strong>信道复用</strong>,在TCP连接上可以并发的去发送http请求,链接一个网站只需要一个TCP链接(同域的情况下),关于http/2笔者后续会采用Nginx做个示例,欢迎关注。

打开App,阅读手记
2人推荐
发表评论
随时随地看视频慕课网APP