网络协议TCP/IP模型

网络模型

计量单位

• 1bit（位） ：1bit
• 1Byte (字节)：1Byte =8bit
• 1KB=1024Byte=1*210Byte
• 1M=1024KB =1*220Byte 210 210
• 1G=1024MB
• 1T=1024GB

5层参考模型

• 应用层 ：支持各种网络应用： FTP、SMTP、HTTP
• 传输层：进程的数据传输 TCP、UDP
• 网络层：源主机到目的主机的数据分组路由与转发 IP、ICMP、OSPF协议
• 数据链路层：把网络层传下来的数据包组装成帧 Ethrnet，PPP
• 物理层 :比特传输

1.TCP协议是什么?

TCP(Transmission Control Protocol 传输控制协议)是一种面向连接(连接导向)的、可靠的、基于IP的传输层协议。TCP 使用校验、确认和重传机制来保证可靠传输
而 HTTP协议 就是建立在TCP协议之上的一种应用。

2.一次完整的HTTP服务过程是什么

当我们在web浏览器的地址栏中输入: www.baidu.com ，具体发生了什么?
1.对 www.baidu.com 这个网址进行DNS域名解析，得到对应的IP地址
2.根据这个IP，找到对应的服务器，发起TCP的三次握手
3.建立TCP连接后,发起HTTP请求
4.服务器响应HTTP请求，浏览器得到html代码
5.浏览器解析html代码，并请求html代码中的资源(如is、CSS、图片等) (先得到html代码，才能去找这些资源)
6.浏览器对页面进行渲染呈现给用户
7.服务过程完毕。关闭TCP连接,四次挥手
注:

1.DNS怎么找到域名的?
DINS域名解析采用的是递归查询的方式，过程是，先去找DNS缓存->缓存找不到就去找根域名服务器->根域名又会去找下一级，这样递归香找之后，找到给我们的web浏览哭

强制缓存

• cache-control: max-age=15552000（秒） 15552000/3600

cache-control是一个时间段

• expires: Wed, 19 Jul 2023 13:48:26 GMT

expires是一个时间点
如果expires不好用，则会使用max-age

协商缓存

last-modified

last-modified 的单位是秒，如果一秒内发生了修改，那就不能判断出改变，这时候可以用Etag。

Etag生成靠以下几种银子

• 文件的i-node编号，是Linux/Unix用来识别文件的编号
• 文件最后修改时间
• 文件大小
• …

生成Etag的时候，可以使用其中一种或者几种因子，使用抗碰撞散列函数生成，生成一个标记文件的唯一值。
Last-Modified与Etag是一起使用的，服务器会先验证ETag，一致的情况下，才会继续比对Last-Modified，然后才决定是否返回304

小结：

• 强缓存：检查过期时间，判断缓存是否失效。如果不失效，则直接使用。

大大减少了服务器的请求次数，在过期时间内，直接从客户端内存中读（适合图片，不大会修改的内容。过期时间也可以设置很长）

• 协商缓存：强缓存命中失效了，超过过期时间了，拿着标识（最后的修改时间，唯一标识etag），去问服务器，是否振的过期了。如果验证通过，服务器会直接响应304，且不会返回资源。

http常⻅的状态码有哪些? 以及他们分别表示什么?

成功 2XX

重定向（3XX）

因为post请求, 是⾮幂等的, 从302中, 细化出了 303 和 307
简⽽⾔之:

• 301 302 307 都是重定向
• 304 协商缓存

客户端错误（4XX）

服务端错误（5XX）

关键渲染路径

1. 构建DOM树
2. 构建CSSOM树
3. 合并DOM和CSSOM
4. 布局

把display不为none的元素，进行布局

5. 重绘

如果遇到图片、transform等属性，opacity等设置，还需要重绘。

keep-alive

早期HTTP/1.0在每次请求的时候，都要创建一个新的链接，而创建连接的过程需要消耗资源和时间，为了减少资源消耗，缩短响应时间，就需要复用已有的连接。
在后来的HTTP/1.0和HTTP/1.1中引入了复用链接的机制，也就是在请求头中加入Connection:keep-alive，以此告诉对象这个请求响应完成后不要关闭链接，下一次还用这个请求的连接进行后续交流。
协议规定，如果想保持连接，则需要在请求头中加上 Connection:keep-alive

keep-alive 的优点(复用连接)
。较少的 CPU 和内存的占用 (因为要打开的连接数变少了,复用了连接)
。减少了后续请求的延迟 (无需再进行握手)
缺点: 因为在处理的暂停期间，本来可以释放的资源仍旧被占用。请求已经都结束了,但是还一直连接着也不合适解决: Keep-Alive: timeout=5, max=100

• timeout: 过期时间5秒 (对应httpd.conf里的参数是: KeepAliveTimeout)，max是最多一百次请求，强制断掉连接。
• 就是在timeout时间内又有新的连接过来，同时max会自动减1，直到为0，强制断掉。

什么是DNS 解析

DNS解析 (域名解析服务器) 将域名转换成ip地址
假定请求的是 www.baidu.com
a)首先会搜索浏览器自身的DNS缓存(缓存时间比较短，大概只有1分钟，且只能容纳1000条缓存
b) 如果浏览器自身的缓存里面没有找到，那么浏览器会搜索操作系统windows自身的DNS缓存
c) 如果还没有找到，那么尝试从 hosts 文件里面去找
d)在前面三个过程都没获取到的情况下，就递归地去域名服务器去查找(就近查找)，具体过程如下

DNS优化两个方面: DNS缓存、DNS负载均衡(准备多台dns服务器,进行dns解析

三次握手和四次挥手

建立连接

三次握手
(1) 服务器啊，我是浏览器，我要和你建立连接
(2) 服务器看到了，好的，那么建立连接吧，我准备好了，你确定吗?
(3) 浏览器:是的，我确定!
连接就建立成功
三次握手 = 连接的发起 + 双方的确认

四次挥手（客气挽留）

这和有礼貌的好友道别一样: (a: 客户端 b:服务端)
1、一开始A想要回家离开，但是呢? 怕B还有事情要交代，那么呢? 只好先向B打招呼，我要走了，请求停止交谈(请求断开连接
(此时，a到B的连接没有断开，依旧可以进行通伟) ;
2、同意A的请求，说好的，但是我这里可能还有一些话(数据)没说完。我检查看看，你等等，等我说完你再走。
3、B确实没啥要补充的了，就告知你我可以散伙了
4、A说好的，知道了，88;(B得知A走开了，关闭了自己的连接 )
完整的一次 http 请求流程才算结束

欢迎使用Markdown编辑器

你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。

新的改变

我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客：

1. 全新的界面设计 ，将会带来全新的写作体验；
2. 在创作中心设置你喜爱的代码高亮样式，Markdown 将代码片显示选择的高亮样式 进行展示；
3. 增加了 图片拖拽 功能，你可以将本地的图片直接拖拽到编辑区域直接展示；
4. 全新的 KaTeX数学公式 语法；
5. 增加了支持甘特图的mermaid语法¹ 功能；
6. 增加了 多屏幕编辑 Markdown文章功能；
7. 增加了 焦点写作模式、预览模式、简洁写作模式、左右区域同步滚轮设置 等功能，功能按钮位于编辑区域与预览区域中间；
8. 增加了 检查列表 功能。

功能快捷键

撤销：Ctrl/Command + Z
重做：Ctrl/Command + Y
加粗：Ctrl/Command + B
斜体：Ctrl/Command + I
标题：Ctrl/Command + Shift + H
无序列表：Ctrl/Command + Shift + U
有序列表：Ctrl/Command + Shift + O
检查列表：Ctrl/Command + Shift + C
插入代码：Ctrl/Command + Shift + K
插入链接：Ctrl/Command + Shift + L
插入图片：Ctrl/Command + Shift + G
查找：Ctrl/Command + F
替换：Ctrl/Command + G

合理的创建标题，有助于目录的生成

直接输入1次#，并按下space后，将生成1级标题。
输入2次#，并按下space后，将生成2级标题。
以此类推，我们支持6级标题。有助于使用TOC语法后生成一个完美的目录。

如何改变文本的样式

强调文本 强调文本

加粗文本 加粗文本

标记文本

删除文本

引用文本

H₂O is是液体。

2¹⁰ 运算结果是 1024.

插入链接与图片

链接: link.

图片:

带尺寸的图片:

居中的图片:

居中并且带尺寸的图片:

当然，我们为了让用户更加便捷，我们增加了图片拖拽功能。

如何插入一段漂亮的代码片

去博客设置页面，选择一款你喜欢的代码片高亮样式，下面展示同样高亮的 代码片.

// An highlighted block
var foo = 'bar';

生成一个适合你的列表

• 项目
  • 项目
    • 项目

1. 项目1
2. 项目2
3. 项目3

• 计划任务
• 完成任务

创建一个表格

一个简单的表格是这么创建的：

项目	Value
电脑	$1600
手机	$12
导管	$1

设定内容居中、居左、居右

使用:---------:居中
使用:----------居左
使用----------:居右

第一列	第二列	第三列
第一列文本居中	第二列文本居右	第三列文本居左

SmartyPants

SmartyPants将ASCII标点字符转换为“智能”印刷标点HTML实体。例如：

TYPE	ASCII	HTML
Single backticks	'Isn't this fun?'	‘Isn’t this fun?’
Quotes	"Isn't this fun?"	“Isn’t this fun?”
Dashes	-- is en-dash, --- is em-dash	– is en-dash, — is em-dash

创建一个自定义列表

Markdown

Text-to- HTML conversion tool

Authors

John

Luke

如何创建一个注脚

一个具有注脚的文本。²

注释也是必不可少的

Markdown将文本转换为 HTML。

KaTeX数学公式

您可以使用渲染LaTeX数学表达式 KaTeX:

Gamma公式展示 $\Gamma (n)=(n-1)!\forall n\in \mathbb{N}$ 是通过欧拉积分

$$\Gamma (z)={\int }_0^{\infty }{t}^{z-1}{e}^{-t}dt.$$

你可以找到更多关于的信息 LaTeX 数学表达式here.

新的甘特图功能，丰富你的文章

• 关于 甘特图 语法，参考 这儿,

UML 图表

可以使用UML图表进行渲染。 Mermaid. 例如下面产生的一个序列图：

这将产生一个流程图。:

• 关于 Mermaid 语法，参考 这儿,

FLowchart流程图

我们依旧会支持flowchart的流程图：

• 关于 Flowchart流程图 语法，参考 这儿.

导出与导入

导出

如果你想尝试使用此编辑器, 你可以在此篇文章任意编辑。当你完成了一篇文章的写作, 在上方工具栏找到 文章导出 ，生成一个.md文件或者.html文件进行本地保存。

导入

如果你想加载一篇你写过的.md文件，在上方工具栏可以选择导入功能进行对应扩展名的文件导入，
继续你的创作。

---

1. mermaid语法说明 ↩︎

2. 注脚的解释 ↩︎