首页 存档 技术 查看内容

给前端看的HTTP协议浅析

2018-3-30 13:00 |来自: 互联网 435 0

摘要: 告诉你们一个不幸的消息,小编最近忙着结婚,这段时间微信无法保证及时推送,更新改为不定时推送,到年后恢复,有问题留言即可,看到就会回复,谢谢大家的支持。 简介HTTP(超文本传输)是一种获取网络资源的协议, ...

告诉你们一个不幸的消息,小编最近忙着结婚,这段时间微信无法保证及时推送,更新改为不定时推送,到年后恢复,有问题留言即可,看到就会回复,谢谢大家的支持。


简介
HTTP(超文本传输)是一种获取网络资源的协议,例如获取一个html页面,一张图片,一个js文件,都需要遵守这个协议,HTTP协议是Web上数据交换的基础。

客户端、服务端
客户端通常是一个浏览器,当输入URL时,浏览器发起第一个请求以获取HTML文档,服务端收到请求后,生成相应的HTML文档,返回给浏览器,浏览器解析返回的HTML文档,并根据文档中的资源信息发送其他的请求获取这些资源,例如css文件,js脚本,图片等,浏览器根据这些资源绘制页面。

页面展现流程

  1. 解析HTML构建DOM树(Parsing HTML to construct the DOM tree )

  2. 解析CSS,根据CSS选择器计算出的样式构建渲染树(Render tree construction)

  3. 布局渲染树(Layout of the render tree)

  4. 绘制渲染树(Painting the render tree)

代理服务器
在浏览器和服务器之间可能存在代理服务器,代理服务器主要有以下几个作用

  • 缓存功能,提高访问速度

  • 过滤(像反病毒扫描,家长监护)

  • 负载均衡,让多个服务器服务不同的请求

  • 对不同资源的权限控制

  • 登陆,允许存储历史信息

HTTP是无状态,有会话的
HTTP协议是无状态的,在同一个连接中,两个成功执行的请求之间是没有关系的,对服务器来说,它并不知道这两个请求来自同一个连接,为了解决这个问题,可以使用cookie以及session创建有状态的会话,也可以在请求头中添加token来解决这个问题

var request = new XMLHttpRequest();

request.open('GET', '', true);

request.setRequestHeader('Authorization','')

request.send();

HTTP 流
一个客户端与服务器的数据交换流程如下

  1. 打开一个TCP连接(或者重用之前的一个):TCP连接用来发送一条或多条请求,当然也用来接受回应消息。客户端可能重用一个已经存在的连接,或者也可能重开几个新的与服务端的TCP连接。

  2. 发送一个HTTP报文:HTTP报文(在HTTP/2之前)是语义可读的。在HTTP/2中,这些简单的消息被封装在了帧中,这使得报文不可能被直接读出来,但是规则仍旧是相同的。

GET / HTTP/1.1

Host: developer.mozilla.org

Accept-Language: fr

  1. 读取服务端返回的报文:

HTTP/1.1 200 OK

Date: Sat, 09 Oct 2010 14:28:02 GMT

Server: Apache

Last-Modified: Tue, 01 Dec 2009 20:18:22 GMT

ETag: "51142bc1-7449-479b075b2891b"

Accept-Ranges: bytes

Content-Length: 29769

Content-Type: text/html

声明:文章版权归原作者所有 部分文章转自互联网 如有侵权请联系 [邮箱地址] 删除

路过

雷人

握手

鲜花

鸡蛋

相关分类

返回顶部