12期前端冲刺必备指南-HTTP/HTTPS/HTTP2/DNS/TCP/经典题

前言

你们好啊，我是吒儿👦，天天努力一点点💪，就能升职加薪💰当上总经理出任CEO迎娶白富美走上人生巅峰🗻，想一想还有点小激动呢😎。

这是个人第12期文章内容✍，但愿可以把每一处知识点，说明白，（固然，若是哪一处不了解，能够在评论区进行探讨哦！）⏰，计时开始！

若是您发现本文有帮助，请您点赞，收藏，评论，留下您学习的脚印👣，我很乐意谈论😃

学习阅读这篇文章内容仍是须要一点前端网络基础的，至少你用过接口，了解事后端啥的。（也了解过一点网络知识，但不怎么会懂的学习者）

学习Http协议过重要了，了解Http协议，能够了解Web应用程序先后端的交互等

HTTP

什么是网络中的HTTP，HTTPS，HTTP2，DNS，TCP，CDN等等，您是否是听得一头雾水呢？小朋友您是否是有不少问号？😧

Web创建在HTTP协议上通讯的

那咱们先从HTTP协议开始，HTTP协议：

特色：1.简单快速，2.灵活，3.无链接，4.无状态（HTTP是一种不保存状态，无状态协议-从HTTP/1.1 虽然是无状态协议，但为了实现保持状态功能，引入了 Cookie 技术，有了它就能够管理状态了）。（记住咯）

HTTP报文：请求报文，响应报文

请求报文：

1. 请求行：请求方法，请求URL，HTTP协议以及版本；
2. 请求头，通知服务器有关于客户端请求的信息
3. 空行，发送回车符和换行符

响应报文：

1. 状态行
2. 响应头
3. 空行
4. 响应体

HTTP方法：

主要GET方法获取数据，POST方法传输资源

PUT方法更新资源，DELETE方法删除资源，HEAD方法得到报文首部

固然做为程序员经常使用到的HTTP状态码：

描述到这里应该大部分人也是了解这部分比较的是吧？那么接下来我来添加一些内容。

让咱们了解web网络基础，咱们知道咱们是使用HTTP协议访问web的，那么你知道咱们在网页浏览器中的地址栏中输入URL时，web页面是若是呈现的吗？

第一步👣，浏览器根据请求的url交给dns域名解析，找到真实的Ip，向服务器发起请求。

第二步👣，服务器交给后台处理后，返回响应的数据，浏览器接收文件。

第三步👣，浏览器对加载到的资源（根据web浏览器地址栏中指定的url，web浏览器从web服务器获取文件资源等信息）进行解析，创建相应的内部数据结构。

第四步👣，浏览器载入解析到的资源文件，进行页面渲染，呈现出web页面。

so，就算你不了解其运做原理，也是可以看到web页面的。

客户端经过指定的访问地址获取服务器资源，服务器使用HTTP协议进行通讯，将资源传递给客户端。

在浏览器地址栏内输入URL以后，信息会被送往某处，而后从某处得到的回复，内容就会显示在web页面上。

so，HTTP协议是超文本传输协议，是用于从万维网服务器传输超文本到本地浏览器的传输协议。

HTTP是基于TCP/IP协议通讯协议来传递数据的，主要是客户端和服务器端之间的通讯格式，不涉及数据包传输。

那么什么是网络基础TCP/IP

网络基础TCP/IP

固然说到网络基础TCP/IP，就要了解一下TCP/IP协议族啦！

一般使用的网络是在网络基础TCP/IP协议族的基础上运做的，so，加上刚刚所说的，HTTP就是它内部的一个子集（子集？数学概念）

协议就是定义规则，双方要定义好规则，事先肯定，才能相互通讯，网络基础TCP/IP是互联网相关的各种协议族的总称。

在图解HTTP中，TCP/IP协议族是分4层：应用层，传输层，网络层和数据链路层（分层的）。

利用TCP/IP协议族进行网络通讯：

经过分层顺序与对方进行通讯，发送端（客户端）从应用层往下走，接收端（服务器端）从链路层往应用层上走。

即：客户端，应用层（HTTP客户端）➡，传输层（TCP）➡，网络层（IP）➡，链路层（网络）➡；服务器端，应用层（HTTP服务器端），⬅传输层（TCP），⬅网络层（IP），⬅链路层（网络）。

从发送端到接收端，发送HTTP请求流程：

发送端，每经过一层增长首部，接收端，每经过一层删除首部。发送端发起HTTP请求，从发送端：应用层，HTTP数据（HTTP报文）➡，接收TCP首部到传输层，即TCP首部包含HTTP数据➡，接收IP数据包到网络层，即IP首部里包含TCP首部，TCP首部包含HTTP数据➡，接收网络架构到链路层，即以太网首部包含IP首部，IP首部里包含TCP首部，TCP首部包含HTTP数据。在发送端是这样的传输。

接着发送端的链路层传送到接收端的链路层，就是经过每一层会删除首部，so，传输过来的HTTP数据，（以太网首部👉IP首部👉TCP首部👉HTTP数据），从发送端到接收端，接收端往上走每一层删除首部（即链路层到应用层），so，接收端的链路层到网络层删除首部后（P首部👉TCP首部👉HTTP数据），一次类推，到接收端的应用层就剩下HTTP数据。

那么有人说，在计算机网络的七层协议呢？是的有七层，不过都不会影响的，说一说七层协议，顺带讲讲。

在主机上：应用层，表示层，会话层，传输层；在网络上：网络层，链路层，物理层。

以上能够一部分一部分进行学习掌握的知识点。

HTTP 中 GET 与 POST 的区别

在网上冲浪时，看到《99%的人都理解错了HTTP中GET与POST的区别》这篇文章。

说GET和POST有一个重大区别，GET产生一个TCP数据包；POST产生两个TCP数据包。

在GET请求，浏览器会把http header和data一并发送出去，服务器响应200，而对于POST，浏览器发送header，服务器响应100 continue，浏览器再发送data，服务器响应200。

而后看到这篇文章《据说『99% 的人都理解错了 HTTP 中 GET 与 POST 的区别』？？》结论是，关于『GET 发一个包，POST 发两个包』的知识 99% 大概是从这篇文章中得来的《XMLHttpRequest (XHR) Uses Multiple Packets for HTTP POST?》能够本身查看哦！（多多提出本身思考，不断问为何，去扩展本身知识点的边缘）

一个TCP链接能发多少个HTTP请求

so，一个tcp链接里到底能发几个http呢？😉，应该是tcp链接不断开，就能够一直发送请求，不断开就能够随便发，HTTP2的话能够一个链接里并行，HTTP/1.1不行的。（开了Pipelining就能够了吧，http1.1的，可是 Pipelining 默认在浏览器是不开的）

（感受应该和网络情况相关，不会存在必定一种比另外一种快）

一个 TCP 链接后是否会在一个 HTTP 请求完成后断开？

在 HTTP/1.0 中，一个服务器在发送完一个HTTP响应后，会断开TCP连接。但这样请求会从新创建和端口TCP链接，代价过大。

若是某服务器对Connection: keep-alive 的 Header 进行了支持。表示完成这个HTTP请求后，不用断开HTTP请求使用TCP的TCP链接，能够被重复使用，以后发送HTTP请求就不用从新创建TCP链接了。

维持链接好处多多，那么在HTTP/1.1 就把 Connection 头写进标准，除非关闭，不然会维持一段时间的TCP链接，默认状况下链接TCP不会断开，只有在请求报头中声明Connection: close 才会在请求完成后关闭链接。

若是维持链接，一个 TCP 链接是能够发送多个 HTTP 请求的。

一个 TCP 链接中 HTTP 请求发送能够一块儿发送么?

在PiPelining来解决这个问题：（Pipelining 是什么）

如图：

这一问题解决后，下面了解一下IP,TCP,和DNS(先简单说明一下，还可能再加深)

IP,TCP,和DNS

说到IP，TCP，DNS这三个协议，固然在网络通讯中，层次有涉及到因此要说一下不然就忘记了。

TCP/IP 是一类协议系统，它是用于网络通讯的一套协议集合

tcp的首部格式

首部格式

负责传输的IP协议，IP协议（位于网络层），几乎全部使用网络的系统都用到了IP协议，IP协议的做用就是把各类数据包传送给对方，须要确保两个重要的条件，IP地址（说明节点被分配到的地址，IP可换）和MAC地址（指网卡所属的固定地址，MAC地址基本上不会换）。

经过MAC地址使用ARP协议进行通讯，（而ARP是一种用于解析地址的协议，经过通讯方的IP地址就能够反查对应的MAC地址）。ARP协议用于在通讯双方须要经过多台计算机和网络设备中转才能到达对方，这个过程当中须要采用ARP协议进行中转时，利用下一站中转设备的MAC地址来搜索下一个中转地址。（若是快递公司，您做为寄快递的人，只知道本身的快递件送到了快递公司，这快递过程当中，您没法了解掌握快递的过程细节）

就是说发送端向往某个IP地址发送数据包（快递包）就会经过ARP协议进行中转把数据包发往MAC地址（路由器）某个中转站，而后接着到达下一个中转地址（由上一个中转地址搜索（送往）下一个中转地址），最后到达接收端。

数据包：

我知道了MAC地址进行通讯过程当中是使用ARP协议的了，可是这是用在通讯双方不多在同一局域网内的状况。

TCP协议用于保证可靠性，位于传输层，提供字节流服务

字节流服务是将大块数据分割成以报文段位单位的数据包进行管理（主要是为了方便传输）。

而这里确保数据可靠性送达，这里就是咱们常说的TCP协议采用了三次握手，用于保证数据准确无误的送到目的地。（TCP创建链接—三次握手，TCP释放链接—四次挥手(待会说)）

三次握手,四次挥手

握手过程当中使用了TCP标志，SYN（synchronize）同步信号和ACK（acknowledgement）确认信号。

描述过程是：（三次握手）

第一次握手：发送端，把标有SYN的数据包发给到 接收端，等待对方接收。

第二次握手：接收端接收后，发送标有 SYN/ACK 的数据包给以示传达确认信息。

第三次握手：发送端收到后，在传回带ACK标识的数据包给 接收端，握手接收。

发送端，把标有SYN的数据包发给到 接收端，接收端收到后，发送标有 SYN/ACK 的数据包给 发送端，发送端收到后，发送标有 ACK的数据包给 接收端。

如图：（SYN、ACK 是 TCP 封包中的 控制位元 ）

描述过程是：四次挥手

一般咱们习惯记忆域名，可是机器间互相指认ip地址，域名与ip地址之间是一一对应的，它们之间的转换工做称为域名解析，域名解析是须要由专门的域名解析服务器来完成。

so，这就须要DNS服务来负责域名解析。

DNS服务来负责域名解析

负责域名解析的 DNS 服务,就是经过域名查询到具体的 IP。

当客户机提出查询请求时，会在本地计算机中的缓存中查找，若是在本地没法获取查询信息，就将查询请求发给DNS服务器。

开始，客户机将域名查询请求发送到本地DNS服务器，在该服务器管理的区域的记录中查找，若是找到该记录，就利用此记录进行解析，若是没有区域信息能够知足查询要求，不能在本地找到客户机查询的信息，将请求发送到根域名DNS服务器，用于负责解析客户机请求的根域部分，将包含下一级域名信息的DNS服务器地址返回给客户机的DNS服务器地址，最后在目标域名的DNS服务器上找到相应的IP地址信息。

DNS服务是位于应用层的协议，提供域名到IP地址之间的解析服务。（DNS服务能够加上对域名购买，解析服务的了解，更加容易理解一些，这就是一部不经过IP地址访问，而是使用主机名或域名来访问对方的计算机），它提供经过域名查找IP地址，也能够逆向从IP地址查找域名。

流程详解，就是发送端向DNS发送把某域名下的IP地址告知个人请求，DNS接收到后，把对应的IP地址返回到发送端，发送端经过Ip地址能够向web服务器发送访问请求。

so，根据上述总结，我能够描述HTTP协议的通讯过程：

HTTP协议的通讯过程

客户端（浏览器）在地址栏访问某域名网页，向DNS要求发送给对应的IP地址，浏览器经过域名在网页请求某域名下的页面资源，HTTP协议会生成对目标web服务器的HTTP的请求报文。TCP协议就是将HTTP请求报文分割成报文段，可靠地传给对方。经过（数据包中转站）IP协议负责的地方，搜索对方某MAC地址路由器，一边中转一边传送。到达对方服务器（某Ip地址），TCP协议负责从对方接收接收过来的报文段，重组到达按序号以原来的顺序，HTTP协议就对web服务器请求的内容进行处理。

这个过程就是从应用层，传输层，网络层，链路层之间的传递。

在这里讲到客户端发送HTTP请求给服务器端的请求报文是什么？

由于上面说到就讲一下请求报文，那么请求报文是以下图总体：

这是客户端的请求报文，那么服务器端也有，是接收后结果以响应报文形式返回：

用表格，描述GET用于获取资源：

说明	描述
请求	GET /index.html HTTP/1.1
响应	返回index.html的页面资源

so，HTTP报文用于HTTP协议交互的信息，报文是由多行数据构成的字符串文本。大体分报文首部和报文主体两块。

报文的结构

请求报文和响应报文的结构（找了以下图片进行解释）

固然若是还不够清晰，再次找了几张图片：

请求头

请求体

状态行

响应头部

响应体

到了这里，上面有一些知识点就是在地址栏中输入的url，URL应该比较常说，它是同一资源定位符，用英文是（Uniform Resource Locator）。url就是输入地址栏的网页地址。

URI

说到url，咱们要了解一下URI,它是同一资源标识符。了解一下绝对URI的格式。

URI通常都是定位互联网上的资源，保证在互联网上任意位置的资源进行访问（HTTP协议使用URI让客户端定位到资源）。以下图：

快速看到这里的朋友应该对HTTP了解还很不错呢。

GET和POST的区别？

来道常考面试题：GET和POST的区别？

1. GET在浏览器回退不会再次请求，POST会再次提交请求
2. GET请求会被浏览器主动缓存，POST不会，要手动设置
3. GET请求参数会被完整保留在浏览器历史记录里，POST中的参数不会
4. GET请求在URL中传送的参数是有长度限制的，而POST没有限制
5. GET参数经过URL传递，POST放在Request body中

HTTP四个版本

分别是HTTP1.0、HTTP1.一、HTTP/2，HTTP/3

HTTP1.0默认是短链接，每次与服务器交互，都须要新开一个链接。

HTTP1.1版本,默认持久链接，只要没有明确提出端口就一直保持，能够发送屡次HTTP请求，还有重点在于断点续传，利用HTTP消息头使用分块传输编码，将实体主体分块传输。

https协议如今部分网站都用这个。

在网络上，客户端和服务端交互，就有可能被挟持，须要用CA（公信机构）来帮客户端认定服务端是真实的。

这个时候就要去申请一份数字证书，数字证书里有证书持有者、证书有效期、服务器公钥等信息。

客户端用CA的公钥对证书解密（证书被CA机构的私钥解密，而后客户端用CA证书的公钥解密。）

流程以下图所示：

管线化和持久链接

仅在HTTP/1.1才支持管线化，在持久链接前提下，请求一次性打包传输过去，响应一次性打包传递回来。

管线化技术的出现，不用等待响应亦可直接发送下一个请求。

在HTTP1.1中全部连接默认都是持久链接，使用同一个TCP链接来发送和接收多个HTTP请求或响应。

持久链接（HTTP Persistent Connections，也称为 HTTP keep-alive 或 HTTP connection reuse）

好处：

1. 减小了 TCP 链接的重复创建和断开所形成的额 外开销
2. 减轻了服务器端的负载
3. Web 页面的显示速度提升了

Cookie了解一下

Cookie 技术经过在请求和响应报文中写入 Cookie 信 息来控制客户端的状态

跨域

什么是同源策略

同源策略是一种约定，它是浏览器最核心的安全功能，所谓同源是指"协议+域名+端口"三者相同。

跨域是请求能发出去，服务端能收到请求并正常返回结果，只是结果被浏览器拦截了。

解决跨域：

有 jsonp、iframe、cors、img、HTML5 postMessage等等。其中用到 html 标签进行跨域的原理就是 html 不受同源策略影响。但只是接受 Get 的请求方式，这个得清楚。

JSONP原理，利用js请求返回不须要域名，没有跨域问题，即利用 <script> 标签没有跨域限制的漏洞，网页能够获得从其余来源动态产生的 JSON 数据,不安全可能会遭受XSS攻击。

JSONP 使用简单且兼容性不错，可是只限于 get 请求。

<script src="http:=jsonp"></script>
<script>
    function jsonp(data) {
    	console.log(data)
	}
</script> 
复制代码

从输入URL到页面展现，这中间发生了什么？

从输入 URL 到页面展现完整流程示意图

输入url并回车，浏览器进程检查url，组装协议，构成完整的url，经过进程间通讯（IPC）把url请求发送给网络进程，接收到url请求后检查本地缓存是否缓存该请求资源，若是有,则将该资源返回给浏览器进程，若是没有，网络进程向web服务器发起http请求。

向web服务器发起http请求

1. 进行DNS解析，获取服务器ip地址，端口
2. 利用ip地址和服务器创建tcp链接
3. 构建请求头信息
4. 发送请求头信息
5. 服务器响应后，网络进程接收响应头和响应信息，并解析响应内容
6. 网络进程解析响应流程
7. 准备渲染进程
8. 传输数据、更新状态

Web服务器

1. 用单台虚拟主机实现多个域名
2. HTTP/1.1 规范容许一台 HTTP 服务器搭建多个 Web 站点

代理、网关、隧 道

来源于《图解HTTP》

代理：

来源于《图解HTTP》

网关：

来源于《图解HTTP》

隧道：

来源于《图解HTTP》

缓存：

来源于《图解HTTP》

有效期限：

来源于《图解HTTP》

web安全

1. 通讯使用明文可能会被窃听，存在通讯内容被窃听的风险
2. TCP/IP 可能被窃听的网络
3. 加密处理防止被窃听
4. 没法证实报文完整性，可能已遭篡改
5. 使用 HTTPS 通讯
6. HTTP+ 加密 + 认证 + 完整性保护 =HTTPS

参考文献

你猜一个 TCP 链接上面能发多少个 HTTP 请求

前端总结--网络

熬夜写了一篇HTTP总结

《图解HTTP》