1.在浏览器输入URL到页面加载发生了什么？
- 域名解析: 域名到IP地址的转换
- TCP连接: 采用三次握手进行连接
- 发送HTTP请求: 构建HTTP请求报文通过TCP协议发送到服务器指定端口
- 服务端响应HTTP请求: 对HTTP协议进行解析，并返回数据
- 浏览器解析渲染页面
2.三次握手详解
第一次握手：客户端发了个连接请求消息到服务端；第二次握手：服务端收到请求，告诉客户端可以进行连接；第三次握手：客户端告诉服务端已收到回复（防止已经失效的连接请求报文段突然又传到服务端）
https://baijiahao.baidu.com/s?id=1654225744653405133&wfr=spider&for=pc
3.一次完整的HTTP请求经历的7个步骤
1. 建立TCP连接
在HTTP工作开始之前，Web浏览器首先要通过网络与Web服务器建立连接，该连接是通过TCP来完成的，该协议与IP协议共同构建Internet，即著名的TCP/IP协议族，因此Internet又被称作是TCP/IP网络。HTTP是比TCP更高层次的应用层协议，根据规则，只有低层协议建立之后才能进行更高层协议的连接，因此，首先要建立TCP连接，一般TCP连接的端口号是80。
2. Web浏览器向Web服务器发送请求命令
一旦建立了TCP连接，Web浏览器就会向Web服务器发送请求命令。例如：GET/sample/hello.jsp HTTP/1.1。
3. Web浏览器发送请求头信息
浏览器发送其请求命令之后，还要以头信息的形式向Web服务器发送一些别的信息，之后浏览器发送了一空白行来通知服务器，它已经结束了该头信息的发送。
4. Web服务器应答
客户机向服务器发出请求后，服务器会客户机回送应答， HTTP/1.1 200 OK ，应答的第一部分是协议的版本号和应答状态码。
5. Web服务器发送应答头信息
正如客户端会随同请求发送关于自身的信息一样，服务器也会随同应答向用户发送关于它自己的数据及被请求的文档。
6. Web服务器向浏览器发送数据
Web服务器向浏览器发送头信息后，它会发送一个空白行来表示头信息的发送到此为结束，接着，它就以Content-Type应答头信息所描述的格式发送用户所请求的实际数据。
7. Web服务器关闭TCP连接
一般情况下，一旦Web服务器向浏览器发送了请求数据，它就要关闭TCP连接，然后如果浏览器或者服务器在其头信息加入了这行代码：Connection:keep-alive
TCP连接在发送后将仍然保持打开状态，于是，浏览器可以继续通过相同的连接发送请求。保持连接节省了为每个请求建立新连接所需的时间，还节约了网络带宽。
4.浏览器解析渲染页面的过程：
主要步骤：
- 解析HTML，生成DOM树（DOM）
- 解析CSS，生成CSSOM树（CSSOM）
- 将DOM和CSSOM合并，生成渲染树（Render-Tree）
- 计算渲染树的布局（Layout）
- 将布局渲染到屏幕上（Paint）
浏览器解析HTML过程：浏览器获得一个html文件后，是自上而下顺序执行的，并且是边解析边渲染
- css是由单独的下载线程异步下载的
- 解析遇到link，script，img标签时，浏览器会向服务器发送请求资源
- link加载完css后会解析为CSSOM，但link外部引入文件的加载和解析都不会阻塞html的解析，但会阻塞渲染
- script的加载或者执行都会阻塞html解析，以及其他下载线程和渲染线程
- img的加载不会阻塞html的解析，但是img加载后并不会渲染，它需要等待render tree生成后才会渲染出来，为下载完的图片需要等到下载完后才渲染
阻塞发生的情况：
- 遇到script标签加载js的时候会加载js并且执行完毕才开始渲染
- 遇到alert会阻塞
总结：
1.css加载不会阻塞DOM树的解析（异步加载时DOM照常构建）
2.css加载会阻塞DOM树（render树）的渲染（渲染时需等css加载完毕，因为render树需要css信息）
3.css加载会阻塞后面js语句的执行
为了避免让用户看到长时间的白屏时间，我们应该尽可能的提高css加载速度，比如可以使用以下几种方法:
- 使用CDN(因为CDN会根据你的网络状况，替你挑选最近的一个具有缓存内容的节点为你提供资源，因此可以减少加载时间)
- 对css进行压缩(可以用很多打包工具，比如webpack,gulp等，也可以通过开启gzip压缩)
- 合理的使用缓存(设置cache-control,expires,以及E-tag都是不错的，不过要注意一个问题，就是文件更新后，你要避免缓存而带来的影响。其中一个解决防范是在文件名字后面加一个版本号)
- 减少http请求数，将多个css文件合并，或者是干脆直接写成内联样式(内联样式的一个缺点就是不能缓存)
重绘（repaint）：元素的背景颜色，文字颜色的改变，引起浏览器的重绘
回流（reflow）：布局的改变导致需要重新渲染
http://taligarsiel.com/Projects/howbrowserswork1.htm
https://blog.csdn.net/xiaozhuxmen/article/details/52014901
5.HTTP的缓存机制
web缓存的作用：减少网络带宽消耗；降低服务器压力；加快页面打开速度；
web缓存的类型：数据库数据缓存（内存）；服务器端缓存（代理服务器缓存/CDN缓存）；浏览器端的缓存；
浏览器的缓存机制有三种：HTML5离线储存和本地缓存、HTML Meta标签、HTTP协议缓存
1.appcache、sessionStorage、localStorage等等。
2.<META HTTP-EQUIV="Pragma" CONTENT="no-cache"> （告诉浏览器当前页面是否被缓存，只有部分浏览器支持，所有缓存代理服务器不支持，代理不解析HTML）
3.HTTP缓存：它是通过 HTTP 头信息来控制缓存的，HTTP 头信息可以让你对浏览器和代理服务器如何处理你的副本进行更多的控制。他们在 HTML 代码中是看不见的，一般由 Web 服务器自动生成。但是，根据你使用的服务器，你可以在某种程度上进行控制。
强缓存：利用http头重的cache-control和expires两个字段控制，当再次发起请求时，通过两个请求头来判断资源是否过期，没过期直接从缓存中取数据
协商缓存：如果已经过期，会重新发送请求到服务端，通过Last-Modified和Etag查看资源是否改变，没改变饭或304，然后读取缓存中的数据，如果有改变，返回200和数据
具体步骤：
①浏览器第一次访问服务器资源
在浏览器中没有缓存文件，直接向服务器发送请求。
服务器返回 200 OK，实体中返回 index.html文件内容，并设置一个缓存过期时间，一个文件修改时间，一个根据index.html内容计算出来的实体标记Entity Tag，简称Etag。
浏览器将/index.html路径的请求缓存到本地。
②浏览器第二次访问服务器资源 /index.html
由于本地已经有了此路径下的缓存文件，所以这一次就不直接向服务器发送请求了。
首先，进行缓存过期判断。浏览器根据①中设置缓存过期时间判断缓存文件是否过期。
情景一：若没有过期，则不向服务器发送请求，直接使用缓存中的结果，此时我们在浏览器控制台中可以看到 200 OK(from cache) ，此时的情况就是完全使用缓存，浏览器和服务 器没有任何交互的。
情景二：若已过期，则向服务器发送请求，此时请求中会带上①中设置的文件修改时间，和Etag
然后，进行资源更新判断。服务器根据浏览器传过来的文件修改时间，判断自浏览器上一次请求之后，文件是不是没有被修改过；根据Etag，判断文件内容自上一次请求之后，有没有发生变化
情形一：若两种判断的结论都是文件没有被修改过，则服务器就不给浏览器发index.html的内容了，直接告诉它，文件没有被修改过，你用你那边的缓存吧—— 304 Not Modified，此时浏览器就会从本地缓存中获取index.html的内容。此时的情况叫协议缓存，浏览器和服务器之间有一次请求交互。
情形二：若修改时间和文件内容判断有任意一个没有通过，则服务器会受理此次请求，之后的操作同①
服务端：
服务端通过If-Modified-Since（Last-Modified）和If-None-Match（Etag）这两个属性的值来判断缓存是否失效的。
Last-Modified/If-Modified-Since
Last-Modified/If-Modified-Since要配合Cache-Control使用。
Last-Modified：响应资源的最后修改时间。
If-Modified-Since：当缓存过期时，发现资源具有Last-Modified声明，则在请求头带上If-Modified-Since（值就是Last-Modified）。服务器收到请求后发现有头If-Modified-Since则与被请求资源的最后修改时间进行比对。若最后修改时间较新，说明资源又被改动过，则响应HTTP 200整片资源内容（写在响应消息包体内）;若最后修改时间较旧，说明资源无新修改，则响应HTTP 304，告知浏览器继续使用所保存的cache。
Etag/If-None-Match
Etag/If-None-Match也要配合Cache-Control使用。
Etag：资源在服务器的唯一标识（生成规则由服务器决定）。Apache中，ETag的值，默认是对文件的索引节（INode），大小（Size）和最后修改时间（MTime）进行Hash后得到的。
If-None-Match：当缓存过期时，发现资源具有Etage声明，则在请求头带上If-None-Match（值就是Etag）。服务器收到请求后发现有头If-None-Match 则与被请求资源的相应校验串进行比对，决定返回200或304。
https://www.cnblogs.com/dojo-lzz/p/5515839.html
http://www.alloyteam.com/2012/03/web-cache-2-browser-cache/
https://www.cnblogs.com/chengxs/p/10396066.html
6.cookies机制和session机制
7.HTTP优化方案
8.不同版本的HTTP区别
9.HTTP1.1引入分块传输编码提供的好处
10.长连接与短链接的区别，以及应用场景
11.常见web攻击
12.站内跳转与外部重定向的区别
13.304缓存原理
14.HTTP2.0
15.HTTP报文
1.什么是HTTP协议
超文本传输协议，客户端和服务端之间数据传输的格式规范
2.HTTP协议的特点
(1) 支持客户端/服务端模式
(2) 简单快速：客户向服务器请求服务时，只需传送请求方法和路径
(3) 灵活：HTTP允许传输任意类型的数据对象，正在传输的类型由Content-type加以标记
(4) 无连接：限制每次连接只处理一个请求，服务器处理完客户的请求，并收到客户的应答后，即断开连接（节省传输时间）Keep-Alive
(5) 无状态：对事务处理没有记忆能力；（返回请求数据后，缺少状态意味着如果后续处理需要前面的信息，则它必须重传）cookie、session
3.HTTP协议的请求方式
(1) GET：请求访问已被URI识别的资源（可通过URL传参给服务器）
(2) POST：传输数据给服务器（与get方法类似）
(3) PUT：传输文件（报文主体中包含文件内容，保存到对应的URI位置）
(4) DELETE：删除文件（与put相反，删除对应URI位置文件）
(5) HEAD：获得报文首部（与get类似，只是不返回报文主体，一般用于验证URI是否有效）
(6) OPTIONS：查询相应URI支持的HTTP方法
4.GET与POST请求的区别
(1) GET重点从服务器上获取资源；POST重点向服务器发送数据
(2) GET请求数据是通过URL请求，（？连接，多个请求数据间用&连接）POST将数据封存在请求实体中发送给服务器，这个过程用户不可见
(3) GET传输的数据量小，因为URL长度限制，但效率较高；POST可以传输大量数据，所以上传文件时只能用POST方式
(4) GET不是安全的，因为URL是可见的，可能泄漏私密信息；POST较GET安全性较高
(5) GET方式只支持ASCII字符，向服务器传输的中文字符可能会乱码；POST支持标准字符集，可以正确传递中文字符
5.常见的HTTP协议状态码
(1) 1XX：信息性状态码（服务端收到请求）
(2) 2XX：成功状态码（请求成功）
(3) 3XX：重定向状态码（需要进行附加操作以完成请求）
(4) 4XX：客户端错误状态码（服务器无法处理请求）
(5) 5XX：服务器错误状态码（服务器处理请求出错）
---------------------------------------------------------------
200请求成功
202已经接受请求，但未处理完成
203非授权信息
204请求成功处理但没有资源可以返回
206客户端只请求资源的一部分，服务端成功的执行了这部分的GET请求；响应报文中包含由Content-Range指定范围的实体内容
301永久性重定向（请求的资源已被分配了新的URI，以后使用资源都使用新的URI，如指定的路径的最后忘记添加斜杠‘/’就会产生301状态码）
302临时重定向（请求的资源已经被分配了新的URI，希望用户本次使用新的URI访问）服务器返回的头部信息中包含一个Location字段，内容是重定向到的url
303与302功能相似，该状态码表示请求对应资源存在着另一个URI，应使用GET方法定向获取请求的资源
304服务端执行了get请求,但文件未变化;所请求的资源未修改
307临时重定向，与302类似，不被强制使用GET
当301,302,303响应状态码返回时，几乎所有浏览器都会把POST改成GET，并删除请求报文内的主体，之后请求会自动再次发送
301、302标准是禁止将POST方法改成GET方法
https://www.cnblogs.com/cswuyg/p/3871976.html
400客户端请求语法错误
401请求需要认证
403服务端拒绝执行此请求（从未授权的发送源IP地址试图访问）
404服务器无法找到对应的资源
500服务器内部错误
503服务器正忙（处于超负荷或正在进行停机维修，现无法处理请求）
6.HTTP协议的组成
(1) 请求报文
① 请求行：请求方法、URI、HTTP版本信息
② 请求首部字段
③ 请求内容实体
(2) 响应报文
① 状态行：状态码、状态码的原因语句、HTTP版本
② 响应首部字段
③ 响应内容实体
7.HTTP协议首部字段
a、通用首部字段（请求报文与响应报文都会使用的首部字段）
- Date：创建报文时间
- Connection：连接的管理
- Cache-Control：缓存的控制
- Transfer-Encoding：报文主体的传输编码方式
b、请求首部字段（请求报文会使用的首部字段）
- Host：192.168.200.134:8580 请求资源所在服务器
- Accept：application/json, text/plain, 客户端接收哪些类型的信息
- Accept-Charset：iso-8859-1,gb2312 客户端可接收的字符集
- Accept-Encoding：gzip, deflate 可接受的内容编码
- Accept-Language：zh-CN,zh;q=0.9 可接受的自然语言
- Connection:Keep-Alive 连接的管理
- User-Agent：Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.132 Safari/537.36 浏览器，操作系统的属性
c、响应首部字段（响应报文会使用的首部字段）
- Accept-Ranges：可接受的字节范围
- Location：令客户端重新定向到的URI
- Server：HTTP服务器的安装信息
-
Cache-Control:no-cache
-
Expires:Thu, 01 Jan 1970 00:00:00 GMT 过期日期和事件
-
Pragma:no-cache
- Last-Modified 文档最后改动时间
- Set-Cookie：JSESSIONID=8B68C5C102868ED288C4942002E9E688; Path=/qeditor; HttpOnly 设置和页面关联的cookie
- Access-Control-Allow-Headers:X-Requested-With, Content-Type
- Access-Control-Allow-Methods:GET,POST,OPTIONS
- Access-Control-Allow-Origin:*
d、实体报头（实体 = 实体报头 + 实体正文）
- Allow：资源可支持的HTTP方法
- Content-Type：实体主类的类型
- Content-Encoding：实体主体适用的编码方式
- Content-Language：实体主体的自然语言
- Content-Length：实体主体的的字节数
- Content-Range：实体主体的位置范围，一般用于发出部分请求时使用
8.HTTP1.0，HTTP1.1，HTTP2.0
-
HTTP1.0，当建立连接后，客户端发送一个请求，服务器返回一个信息后就关闭连接，浏览器下次请求时又要建立连接；HTTP1.1引入持续连接概念，客户端可以连续发送多个请求，不用等待每一个响应的到来
