学习记录_1126

从URL输入到页面展现到底发生什么?

  • DNS解析,将域名解析成IP地址
  • TCP连接,TCP三次握手
  • 发送HTTP请求
  • 服务器处理请求并返回HTTP报文
  • 浏览器解析渲染页面
  • 断开连接:TCP四次挥手

域名解析(DNS)
输入网址后,首先要经过域名解析,浏览器要靠IP地址才能找到对应的服务器。
DNS协议提供通过域名查找IP地址,或逆向从IP地址反查域名的服务。DNS是一个网络服务器,域名解析简单来说就是在DNS上记录一条信息记录。
浏览器通过域名查询URL对应的IP?

  • 浏览器缓存
  • 操作系统缓存
  • 路由缓存
  • ISP的DNS服务器
  • 根服务器.

总结:浏览器通过向DNS发送域名,DNS服务器查询到与域名相对应的IP地址,然后返回给浏览器,浏览器再将IP地址打在协议上,同时请求参数也会在协议搭载,然后一并发送给对对应的服务器。
接下来是http请求阶段:
TCP三次握手
在客户端发送数据之前会发起TCP三次握手用以同步客户端和服务端的序列号和确认号,并交换TCP窗口大小信息。三次握手过程如下:

学习记录_1126

  • 客户端向服务端发起连接请求,首先客户端随机生成一个起始序列号ISN(比如100),客户端向服务端发送的报文包括SYN标志位 SYN=1,序列号 seq = 100
  • 服务端收到客户端发来的报文之后,发现SYN=1,知道是一个连接请求,将客户端的序列号存起来,随机生成一个服务端的起始序列号(比如300),然后回复客户端一段报文,包括SYN和ACK标志(也就是SYN=1,ACK=1),序列号 seq = 300,确认号ack = 101
  • 客户端收到服务端的后发现ACK=1并且ack=101,知道服务端已经收到了序列号为100的报文;同时发现SYN=1,知道同意了这次连接,于是将序列号300存起来。然后回复一段报文给服务端,包含ACK标志位(ACK=1)、ack=301(服务端序列号+1)、seq=101。当服务端收到报文后发现ACK=1并且ack=301,知道客户端收到序列号为300的报文了,这样客户端和服务端通过TCP建立了连接。

三次握手的目的是为了防止已失效的连接请求报文段突然又传送到了服务端,因而产生错误
发送HTTP请求
三次握手结束后,开始发送HTTP报文。
请求报文由请求行、请求头、请求体组成
学习记录_1126
1.请求行包含方法、URL、协议版本

  • 请求方法包括 GET POST PUT DELETE PATCH HEAD OPTIONS TRACE
  • URL即请求地址
  • 协议版本即http版本号

2.请求头包含请求的附加信息,由关键字/值对组成,每行一对,关键字和值用 : 分隔
请求头部通知服务器有关于客户端请求的信息。包含许多有关的客户端环境和请求正文的有用信息。
3.请求体可以承载多个请求参数的数据,包含回车符、换行符和请求数据,并不是所有请求都具有请求数据。
服务器处理请求并返回HTTP报文
1.服务器
服务器是网络环境中的高性能计算机,他侦听网络上的其他计算机(客户机)提交的服务请求,并提供相应的服务,比如网页服务、文件下载服务、邮件服务、视频服务。而客户端主要功能是浏览网页、看视频、听音乐等。每台服务器都会安装处理请求的应用——web server。常见的web server 产品有 apache、nginx、IIS、lighttpd等。
web server 担任管控的角色,对于不同用户发送的请求,会结合配置文件,把不同的请求委托给服务器上处理相应请求的程序进行处理,然后返给后台程序处理产生的结果作为响应。
2.MVC后台处理阶段
模型(model)视图(view)控制器(controller)
浏览器发送来的请求先经过控制器,控制器进行逻辑处理和请求分发,接着会调用模型,这一阶段模型会获取 redis db 以及 MySQL 的数据,获取数据后将渲染好的页面,响应信息会以响应报文的形式返回给客户端,最后浏览器通过渲染引擎将网页呈现在用户面前。
3.http 响应报文
响应报文由响应行、响应头部、响应主体三个部分组成。
(1)响应行包括:协议版本,状态码,状态码描述
状态码规则如下:
1XX:指示信息–表示请求已接收,继续处理
2XX:成功–表示请求已被成功接收、理解、接受
3XX:重定向–要完成请求必须进行更进一步的操作
4XX:客户端错误–请求有语法错误或者请求无法实现
5XX:服务器端错误–服务器未能实现合法的请求
(2)响应头部包含响应报文的附加信息,由 名/值 对组成。
(3)响应主体包含回车符、换行符和响应返回数据,并不是所有响应报文都有响应数据
浏览器解析渲染页面
浏览器解析渲染页面分为以下五个步骤:

  1. 根据HTML解析出DOM树
  2. 根据CSS解析出CSS规则树
  3. 结合DOM和CSS规则树,生成渲染树
  4. 根据渲染树计算每一个节点的信息
  5. 根据计算好的信息绘制页面

1.根据HTML解析DOM树

  • 根据HTML的内容,将标签按照结构成DOM树,DOM树解析的过程是一个深度优先的遍历。先构建当前节点的所有子节点,再构建下一个兄弟节点。
  • 在读取HTML文档,构建DOM树的过程中,若遇到script标签,则DOM树的构建会暂停,直至脚本执行完毕。

2.根据css解析生成css规则树

  • 解析CSS规则树时 js 将暂停,直至CSS规则树就绪。
  • 浏览器在CSS规则树生成之前不会渲染。

3.结合DOM树和CSS规则树,生成渲染树

  • DOM树和CSS规则树全部准备好了以后,浏览器才会开始构建渲染树。
  • 精简CSS并可以加快CSS规则树的构建,从而加快页面响应速度

4.根据渲染树计算每一个节点的信息

  • 布局:通过渲染树中渲染对象的信息,计算出每一个渲染对象的位置和尺寸
  • 回流:在布局完成后,发现了某个部分发生了变化影响了布局,那就需要倒回去重新渲染

5.根据计算好的信息绘制页面

  • 绘制阶段,系统会遍历呈现树,并调动呈现器的“paint”方法,将呈现的内容显示在屏幕上
  • 重绘:某个元素的背景颜色,文字颜色等,不影响元素周围或内部布局的属性,将只会引起浏览器的重绘
  • 回流:某个元素的尺寸发生了变化,则需要重新计算渲染树,重新渲染

断开连接
当数据 传送完毕,需要断开TCP 连接,此时发起 TCP 四次挥手

学习记录_1126

  • 当客户端的数据传输完成后,客户端向服务端发出连接释放报文,释放连接报文包括FIN标志位(FIN=1),序列号seq = u 。客户端发出FIN报文后不能发数据了,但还可以正常接收数据 。
  • 服务端收到客户端发的FIN报文后给客户端回复确认报文,确认报文包含ACK标志位(ACK=1)、确认号标志位ACK=1、确认号ack=u+1,序列号seq=v。此时服务端处于关闭等待状态,而不是立刻向客户端发送FIN报文,这个状态还要持续一段时间,因为服务端可能还有数据没有发完
  • 服务端将最后数据发送完毕后就向客户端发送连接释放报文,报文包括FIN和ACK标志位(FIN=1、ACK=1)、确认号ack和上次挥手一样 ack=u+1,序列号seq=w
  • 客户端收到服务端发的FIN报文后,向服务端发出确认报文,确认报文包含ACK标志位(ACK=1)、确认号ack=w+1、序列号seq=u+1。注意客户端发出报文不是立马释放TCP连接,而是经过2MSL(最长报文寿命的2倍时长)才释放TCP连接。而服务端一旦收到客户端的确认报文就会立刻释放TCP连接,所以服务端结束TCP连接的时间要比客户端早一些。
上一篇:PTA甲1126 Eulerian Path (25 point(s))


下一篇:POJ 3061 - Subsequence - 快慢指针