首先我们来看一下网络的七层模型结构

可以看到http协议属于应用层协议

一、一次完整的http请求的过程

对 www.baidu.com 这个网址进行DNS域名解析，得到对应的IP地址
通过这个IP，找到对应的服务器，发起TCP的三次握手
建立TCP连接后发起HTTP请求
服务器响应HTTP请求，浏览器得到html代码
浏览器解析html代码，并请求html代码中的资源（如js、css图片等）（先得到html代码，才能去找这些资源）
浏览器对页面进行渲染呈现给用户

第一步：如何通过DNS域名解析协议，解析得到IP地址？

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

graph LR
  浏览器 --> DNS服务器缓存
  DNS服务器缓存  --Y--> 结束(返回IP给浏览器)
  DNS服务器缓存  --N--> 根域名服务器递归查找
  根域名服务器递归查找 --Y--> 结束(返回IP给浏览器)

第二步：如何理解三次握手？四次挥手？为什么http协议要利用tcp来实现？

第一次握手：客户端发送syn包(seq=x)到服务器，并进入SYN_SENT状态，等待服务器确认；第二次握手：服务器收到syn包，必须确认客户的SYN（ack=x+1），同时自己也发送一个SYN包（seq=y），即SYN+ACK包，此时服务器进入SYN_RECV状态；
第三次握手：客户端收到服务器的SYN＋ACK包，向服务器发送确认包ACK(ack=y+1)，此包发送完毕，客户端和服务器进入ESTABLISHED状态，完成三次握手\ $\color{red}{（总结：服务器会将握手信息传回给客户端）}$

第一次挥手：主动关闭方发送一个FIN，用来关闭主动方到被动关闭方的数据传送，也就是主动关闭方告诉被动关闭方：我已经不会再给你发数据了(当然，在fin包之前发送出去的数据，如果没有收到对应的ack确认报文，主动关闭方依然会重发这些数据)，但是，此时主动关闭方还可以接受数据。
第二次挥手：被动关闭方收到FIN包后，发送一个ACK给对方，确认序号为收到序号+1（与SYN相同，一个FIN占用一个序号）。
第三次挥手：被动关闭方发送一个FIN，用来关闭被动关闭方到主动关闭方的数据传送，也就是告诉主动关闭方，我的数据也发送完了，不会再给你发数据了。
第四次挥手：主动关闭方收到FIN后，发送一个ACK给被动关闭方，确认序号为收到序号+1，至此，完成四次挥手。
$\color{red}{（总结：第一次主动关闭方还可以接受数据，第二次挥手被动方通知主动方}$ $\color{red}{ ，第三次也是被动方发送关闭通知，第四次主动方收到通知，告诉被动方）}$

TCP是一个端到端的可靠的面相连接的协议，HTTP基于传输层TCP协议不用担心数据传输的各种问题（当发生错误时，会重传）。

最后：浏览器如何渲染页面dom结构

首先解析html为dom树然后解析css为渲染树边解析，边渲染，单线程，从上到下（引申：为什么js一般不放在head头部呢？因为JavaScript是单线程，放头部会阻塞dom渲染，影响用户体验，当然你也可以在引入js的时候，加上 $\color{red}{async}$ ），从而实现异步下载文件

二、http url包含的信息有哪些

https://baike.baidu.com/item/HTTP/243074?fr=aladdin#aaa 
https：协议
baike.baidu.com:域名
prot:端口，https默认443，http默认80
?fr:参数 
aaa:锚点

三、http的请求结构组成

打开chrome的network，然后地址栏访问百度或者常用的网站，点击任意一条request请求，即可发现，每个http headers都包含以下部分:Genaral，Request Headers，Response Headers，Request Payload。\

General(不属于headers，只用于收集请求url和响应的status等信息)：

Request url:请求地址
Request Method:  请求方法
Status Code:状态码
Remote Address:服务器IP地址

Response Headers(响应headers)：

Bdpagetype,Bdpagetype：服务端带给前端的参数
Cache-Control：缓存控制，指定请求和响应遵循的缓存机制(共有public，private,no-cache,no-store,)
Connection：表示是否需要持久连接，一般默认keep-alive保持连接
Content-Encoding：Accept-Encoding 和Content-Encoding是HTTP中用来对采用哪种编码格式传输正文进行协定的一对头部字段，一般会使用nginx配置gzip压缩代码
Content-Type：数据类型，这里因为请求时的html页面所以类型为 html,编码格式为utf-8
Date个expires分别为请求时间和到期时间
Cookie:服务端令牌
Strict-Transport-Security:告诉浏览器只能通过https访问

HTTP 请求头Cache-Control 详解

Request Headers(请求headers)：

Cache-Control：同上
Accept：表示客户端可以处理的内容类型
Accept-Charset：客户端可以处理的字符集类型
Accept-Encoding：客户端能够理解的内容编码方式
Accept-Language：客户端可以理解的自然语言
Cookie：通过Set-Cookie设置的值
Host：目标地址

前端必须要会的http协议知识点