web页面性能优化系列（附录）其他必会的基础知识

叁歲伎倆 2022-04-16 04:42 198阅读 0赞

## **001：即建立TCP链接** ##

1，根据域名解析IP获取IP地址  
2，TCP|IP三次握手

1,根据域名解析IP获取IP地址—发生在互联层

**DNS解析IP**

`A:`浏览器会先解析我们输入的`url`地址，浏览器会先搜索自身的`DNS`缓存，看自身的缓存中是否有对应的条目，而且没有过期，如果有且没有过期则解析到此结束。

`B:`如果浏览器自身的缓存里面没有找到对应的条目，那么Chrome会搜索操`作系统自身`的`DNS缓存`,如果找到且没有过期则停止搜索解析到此结束。

`C:`如果在Windows系统的DNS缓存也没有找到，那么`尝试读取hosts文件`（位于`C:\Windows\System32\drivers\etc`），看看这里面有没有该域名对应的IP地址，如果有则解析成功。（此步骤就是本地的`虚拟服务器环境`，比如计算机`本地的apache服务`，比如`xampp`）

`D:`如果在`hosts`文件中也没有找到对应的条目，浏览器就会发起一个DNS的系统调用，就会向本地配置的首选DNS服务器发起基于互联网的域名解析请求，直到获取至服务器的IP地址。

简单来说域名解析的流程：（浏览器缓存→系统缓存→路由器缓存（如有）→ISP DNS缓存（网络服务商）→从根域名服务器（中国没有）递归搜索）

**注：特殊解析情况（看看即可）**

如果经过以上的4个步骤，还没有解析成功，那么会进行如下步骤（以下是针对`Windows`操作系统）：

`A：`操作系统就会查找`NetBIOS name Cache`（`NetBIOS`名称缓存，就存在客户端电脑中的），那这个缓存有什么东西呢？凡是最近一段时间内和我成功通讯的计算机的计算机名和Ip地址，就都会存在这个缓存里面。什么情况下该步能解析成功呢？就是该名称正好是几分钟前和我成功通信过，那么这一步就可以成功解析。

`B:`如果第5步也没有成功，那会查询`WINS` 服务器（是`NETBIOS`名称和IP地址对应的服务器）。

`C:`如果第6步也没有查询成功，那么客户端就要进行广播查找。

`D:`如果第7步也没有成功，那么客户端就读取`LMHOSTS`文件（和`HOSTS`文件同一个目录下，写法也一样）

`宣告失败：`如果以上都没有解析成功，那就无法跟目标计算机进行通信。只要这8步中有一步可以解析成功，那就可以成功和目标计算机进行通信。

# TCP|IP三次握手四次挥手 #

发生在传输层

**–TCP标志位：**

*  TCP共有6个标志位，分别是：
 *  SYN(synchronous),建立联机。
 *  ACK(acknowledgement),确认。
 *  PSH(push),传输。
 *  FIN(finish),结束。
 *  RST(reset),重置。
 *  URG(urgent),紧急。
 *

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTYwNzQy_size_16_color_FFFFFF_t_70]  
**三次握手**

在TCP/IP协议中，TCP协议提供可靠的连接服务，采用三次握手建立一个连接。

`第一次握手：`建立连接时，客户端发送`syn包(syn=j)`到服务器，并进入`SYN_SEND`状态，等待服务器确认；

`第二次握手：`服务器收到`syn`包，必须确认客户的`SYN（ack=j+1）`，同时自己也发送一个`SYN包（syn=k）`，即`SYN+ACK`包，此时服务器 进入`SYN_RECV`状态；

`第三次握手：`客户端收到服务器的`SYN＋ACK`包，向服务器发送确认包`ACK(ack=k+1)`，此包发送完毕，客户端和服务器进入 `ESTABLISHED`状态，完成三次握手。 完成三次握手，客户端与服务器开始传送数据.

**实例:**

IP 192.168.1.116.3337 > 192.168.1.123.7788: S3626544836:3626544836
    IP 192.168.1.123.7788 > 192.168.1.116.3337: S 1739326486:1739326486 ack3626544837
    IP 192.168.1.116.3337 > 192.168.1.123.7788: ack 1739326487,ack 1

**第一次握手：**`192.168.1.116`发送位码`syn＝1`,随机产生`seqnumber=3626544836`的数据包到`192.168.1.123,192.168.1.123`由`SYN=1`知道`192.168.1.116`要求建立联机;

**第二次握手:** `192.168.1.123`收到请求后要确认联机信息，向1`92.168.1.116`发送`acknumber=3626544837,syn=1,ack=1,`随机产生`seq=1739326486`的包;

\*\*第 三次握手：`** 192.168.1.116`收到后检查`ack number`是否正确，即第一次发送的`seq number+1`,以及位码`ack`是否为`1`，若正确，`192.168.1.116`会再发送`ack` `number=1739326487`,`ack=1`，`192.168.1.123`收到后确认`seq=seq+1,ack=1`则连接建立成功。

图解：  
一个三次握手的过程（图1，图2）  
![在这里插入图片描述][20181117013226414.png]

（图1）  
![在这里插入图片描述][201811170132412.png]

第一次握手的标志位（图3）  
我们可以看到标志位里面只有一个同步位，也就是在做请求(SYN)  
![在这里插入图片描述][20181117013325816.png]

第二次握手的标志位（图4）  
我们可以看到标志位里面有两个确认位和同步位，也就是在做应答(SYN + ACK)  
![在这里插入图片描述][20181117013340958.png]

第三次握手的标志位（图5）  
我们可以看到标志位里面只有一个确认位，也就是再做再次确认(ACK)  
![在这里插入图片描述][20181117013405163.png]

一个完整的三次握手也就是 请求---应答---再次确认

**四次挥手**

由于TCP连接是`全双工`的，因此`每个方向都必须单独进行关闭`。这个原则是当一方`完成它的数据发送任务后就能发送一个FIN`来终止这个方向的连接。收到一个 `FIN只意味着这一方向上没有数据流动`，一个TCP连接在收到一个`FIN后仍能发送数据。`首先进行关闭的一方将执行主动关闭，而另一方执行被动关闭。  
`（1）`客户端`A`发送一个FIN，用来关闭客户A到服务器B的数据传送

（2）服务器`B`收到这个FIN，它发回一个`ACK`，确认序号为收到的序号加1，和SYN一样，一个FIN将占用一个序号。

（3）服务器`B`关闭与客户端`A`的连接，发送一个FIN给客户端`A`（报文段6）。

（4）客户端`A`发回ACK报文确认，并将确认序号设置为收到序号加1（报文段7）。

**1．为什么建立连接协议是三次握手，而关闭连接却是四次握手呢？**

这是因为服务端的LISTEN状态下的SOCKET当收到SYN报文的建连请求后，它可以把ACK和SYN（ACK起应答作用，而SYN起同步作用）放在一个报文里来发送。但关闭连接时，当收到对方的FIN报文通知时，它仅仅表示对方没有数据发送给你了；但未必你所有的数据都全部发送给对方了，所以你不可以马上关闭SOCKET,也即你可能还需要发送一些数据给对方之后，再发送FIN报文给对方来表示你同意现在可以关闭连接了，所以它这里的ACK报文和FIN报文多数情况下都是分开发送的。

**2．为什么TIME\_WAIT状态还需要等2MSL后才能返回到CLOSED状态？**

这是因为虽然双方都同意关闭连接了，而且握手的4个报文也都协调和发送完毕，按理可以直接回到CLOSED状态（就好比从SYN\_SEND状态到ESTABLISH状态那样）；但是因为`我们必须要假想网络是不可靠的，你无法保证你最后发送的ACK报文会一定被对方收到，因此对方处于LAST_ACK状态下的SOCKET可能会因为超时未收到ACK报文，而重发FIN报文，所以这个TIME_WAIT状态的作用就是用来重发可能丢失的ACK报文。`

## 牵扯到的技术点详解 ##

**A:关于DNS的解释**

dns是domain name service的缩写，它的作用简单的说，可以理解为：将域名翻译成ip地址。互联网，或者服务器，是看不懂域名的，它们只懂IP地址，dns其实就是一个翻译，将服务器看不懂的语言翻译成它们看得懂的语言，这样用户在浏览器中输入域名，服务器就可以通过dns知道用户请求的是哪个网站，然后才将对应的网站内容返回给用户；  
而DNS缓存是指DNS返回了正确的IP之后，系统就会将这个结果临时储存起来。并且它会为缓存设定一个失效时间 (例如N小时)，在这N小时之内，当你再次访问这个网站时，系统就会直接从你电脑本地的DNS缓存中把结果交还给你，而不必再去询问DNS服务器，变相“加速”了网址的解析。  
当然，在超过N小时之后，系统会自动再次去询问DNS服务器获得新的结果。所以，当你修改了 DNS 服务器，并且不希望电脑继续使用之前的DNS缓存时，就需要手动去清除本地的缓存了。  
本地DNS迟迟不生效或者本地dns异常等问题，都会导致访问某些网站出现无法访问的情况，这个时候我们就需要手动清除本地dns缓存，而不是等待！  
为什么要清理DNS缓存？  
一般情况下，我们的电脑是不需要手动去清理DNS缓存的，不过有些时候，某些网站因域名DNS服务器地址变更，而我们的电脑还停留在历史访问的DNS缓存上，这样就会出现访问网站解析出错，需要手动去更新清除电脑DNS缓存。这样，当电脑重新访问某个存在DNS变更的网站时，能够重新获取到新的可用地址，从而可以正常访问。

**`tcp的解释`**

TCP(Transmission Control Protocol)网络传输控制协议，是一种面向连接的、可靠的、基于字节流的传输层通信协议，数据传输前建立连接的工作要经过三次握手，数据传输后断开连接的工作要经过四次挥手。

TCP/IP参考模型分为四个层次：`应用层`、`传输层`、`网络互连层`和`主机到网络层`。如图2-2所示。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTYwNzQy_size_16_color_FFFFFF_t_70 1]

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTYwNzQy_size_16_color_FFFFFF_t_70 2]

在TCP/IP参考模型中，去掉了OSI参考模型中的会话层和表示层（这两层的功能被合并到应用层实现）。同时将OSI参考模型中的数据链路层和物理层合并为主机到网络层。下面，分别介绍各层的主要功能。

**1、主机到网络层**

实际上TCP/IP参考模型没有真正描述这一层的实现，只是要求能够提供给其上层-网络互连层一个访问接口，以便在其上传递IP分组。由于这一层次未被定义，所以其具体的实现方法将随着网络类型的不同而不同。

**2、网络互连层**

网络互连层是整个TCP/IP协议栈的核心。它的功能是把分组发往目标网络或主机。同时，为了尽快地发送分组，可能需要沿不同的路径同时进行分组传递。因此，分组到达的顺序和发送的顺序可能不同，这就需要上层必须对分组进行排序。　　  
　　网络互连层定义了分组格式和协议，即IP协议（Internet Protocol）。　　  
　　网络互连层除了需要完成路由的功能外，也可以完成将不同类型的网络（异构网）互连的任务。除此之外，网络互连层还需要完成拥塞控制的功能。

**3、传输层**

在TCP/IP模型中，传输层的功能是使源端主机和目标端主机上的对等实体可以进行会话。`在传输层定义了两种服务质量不同的协议。即：传输控制协议TCP（transmissioncontrol protocol）和用户数据报协议UDP（user datagram protocol）。`　　  
　　  
　　`TCP协议是一个面向连接的、可靠的协议。`它将一台主机发出的字节流无差错地发往互联网上的其他主机。在发送端，它负责把上层传送下来的字节流分成报文段并传递给下层。在接收端，它负责把收到的报文进行重组后递交给上层。TCP协议还要处理端到端的流量控制，以避免缓慢接收的接收方没有足够的缓冲区接收发送方发送的大量数据。  
　　　　  
　　`UDP协议是一个不可靠的、无连接协议，`主要适用于不需要对报文进行排序和流量控制的场合。

**4、应用层**

TCP/IP模型将OSI参考模型中的会话层和表示层的功能合并到应用层实现。　　  
　　应用层面向不同的网络应用引入了不同的应用层协议。其中，有基于TCP协议的，如文件传输协议（File Transfer Protocol，FTP）、虚拟终端协议（TELNET）、超文本链接协议（Hyper Text Transfer Protocol，HTTP），也有基于UDP协议的。

常用状态码

`100` 客户端应当继续发送请求。这个临时响应是用来通知客户端它的部分请求已经被服务器接收，且仍未被拒绝。客户端应当继续发送请求的剩余部分，或者如果请求已经完成，忽略这个响应。服务器必须在请求完成后向客户端发送一个最终响应。

`101` 服务器已经理解了客户端的请求，并将通过Upgrade 消息头通知客户端采用不同的协议来完成这个请求。在发送完这个响应最后的空行后，服务器将会切换到在Upgrade 消息头中定义的那些协议。 　　只有在切换新的协议更有好处的时候才应该采取类似措施。例如，切换到新的HTTP 版本比旧版本更有优势，或者切换到一个实时且同步的协议以传送利用此类特性的资源。

`102` 由WebDAV（RFC 2518）扩展的状态码，代表处理将被继续执行。

`200` 请求已成功，请求所希望的响应头或数据体将随此响应返回。

`201` 请求已经被实现，而且有一个新的资源已经依据请求的需要而建立，且其 URI 已经随Location 头信息返回。假如需要的资源无法及时建立的话，应当返回 ‘202 Accepted’。

`202` 服务器已接受请求，但尚未处理。正如它可能被拒绝一样，最终该请求可能会也可能不会被执行。在异步操作的场合下，没有比发送这个状态码更方便的做法了。 　　返回202状态码的响应的目的是允许服务器接受其他过程的请求（例如某个每天只执行一次的基于批处理的操作），而不必让客户端一直保持与服务器的连接直到批处理操作全部完成。在接受请求处理并返回202状态码的响应应当在返回的实体中包含一些指示处理当前状态的信息，以及指向处理状态监视器或状态预测的指针，以便用户能够估计操作是否已经完成。

`203` 服务器已成功处理了请求，但返回的实体头部元信息不是在原始服务器上有效的确定集合，而是来自本地或者第三方的拷贝。当前的信息可能是原始版本的子集或者超集。例如，包含资源的元数据可能导致原始服务器知道元信息的超级。使用此状态码不是必须的，而且只有在响应不使用此状态码便会返回200 OK的情况下才是合适的。

`204` 服务器成功处理了请求，但不需要返回任何实体内容，并且希望返回更新了的元信息。响应可能通过实体头部的形式，返回新的或更新后的元信息。如果存在这些头部信息，则应当与所请求的变量相呼应。 　　如果客户端是浏览器的话，那么用户浏览器应保留发送了该请求的页面，而不产生任何文档视图上的变化，即使按照规范新的或更新后的元信息应当被应用到用户浏览器活动视图中的文档。 　　由于204响应被禁止包含任何消息体，因此它始终以消息头后的第一个空行结尾。

`205` 服务器成功处理了请求，且没有返回任何内容。但是与204响应不同，返回此状态码的响应要求请求者重置文档视图。该响应主要是被用于接受用户输入后，立即重置表单，以便用户能够轻松地开始另一次输入。 　　与204响应一样，该响应也被禁止包含任何消息体，且以消息头后的第一个空行结束。

`206` 服务器已经成功处理了部分 GET 请求。类似于 FlashGet 或者迅雷这类的 HTTP 下载工具都是使用此类响应实现断点续传或者将一个大文档分解为多个下载段同时下载。 　　该请求必须包含 Range 头信息来指示客户端希望得到的内容范围，并且可能包含 If-Range 来作为请求条件。 　　响应必须包含如下的头部域： 　　Content-Range 用以指示本次响应中返回的内容的范围；如果是 Content-Type 为 multipart/byteranges 的多段下载，则每一 multipart 段中都应包含 Content-Range 域用以指示本段的内容范围。假如响应中包含 Content-Length，那么它的数值必须匹配它返回的内容范围的真实字节数。 　　Date 　　ETag 和/或 Content-Location，假如同样的请求本应该返回200响应。 　　Expires, Cache-Control，和/或 Vary，假如其值可能与之前相同变量的其他响应对应的值不同的话。 　　假如本响应请求使用了 If-Range 强缓存验证，那么本次响应不应该包含其他实体头；假如本响应的请求使用了 If-Range 弱缓存验证，那么本次响应禁止包含其他实体头；这避免了缓存的实体内容和更新了的实体头信息之间的不一致。否则，本响应就应当包含所有本应该返回200响应中应当返回的所有实体头部域。 　　假如 ETag 或 Last-Modified 头部不能精确匹配的话，则客户端缓存应禁止将206响应返回的内容与之前任何缓存过的内容组合在一起。 　　任何不支持 Range 以及 Content-Range 头的缓存都禁止缓存206响应返回的内容。

`207` 由WebDAV(RFC 2518)扩展的状态码，代表之后的消息体将是一个XML消息，并且可能依照之前子请求数量的不同，包含一系列独立的响应代码。

`300` 被请求的资源有一系列可供选择的回馈信息，每个都有自己特定的地址和浏览器驱动的商议信息。用户或浏览器能够自行选择一个首选的地址进行重定向。 　　除非这是一个 HEAD 请求，否则该响应应当包括一个资源特性及地址的列表的实体，以便用户或浏览器从中选择最合适的重定向地址。这个实体的格式由 Content-Type 定义的格式所决定。浏览器可能根据响应的格式以及浏览器自身能力，自动作出最合适的选择。当然，RFC 2616规范并没有规定这样的自动选择该如何进行。 　　如果服务器本身已经有了首选的回馈选择，那么在 Location 中应当指明这个回馈的 URI；浏览器可能会将这个 Location 值作为自动重定向的地址。此外，除非额外指定，否则这个响应也是可缓存的。

`301` 被请求的资源已永久移动到新位置，并且将来任何对此资源的引用都应该使用本响应返回的若干个 URI 之一。如果可能，拥有链接编辑功能的客户端应当自动把请求的地址修改为从服务器反馈回来的地址。除非额外指定，否则这个响应也是可缓存的。 　　新的永久性的 URI 应当在响应的 Location 域中返回。除非这是一个 HEAD 请求，否则响应的实体中应当包含指向新的 URI 的超链接及简短说明。 　　如果这不是一个 GET 或者 HEAD 请求，因此浏览器禁止自动进行重定向，除非得到用户的确认，因为请求的条件可能因此发生变化。 　　注意：对于某些使用 HTTP/1.0 协议的浏览器，当它们发送的 POST 请求得到了一个301响应的话，接下来的重定向请求将会变成 GET 方式。

`302` 请求的资源现在临时从不同的 URI 响应请求。由于这样的重定向是临时的，客户端应当继续向原有地址发送以后的请求。只有在Cache-Control或Expires中进行了指定的情况下，这个响应才是可缓存的。 　　新的临时性的 URI 应当在响应的 Location 域中返回。除非这是一个 HEAD 请求，否则响应的实体中应当包含指向新的 URI 的超链接及简短说明。 　　如果这不是一个 GET 或者 HEAD 请求，那么浏览器禁止自动进行重定向，除非得到用户的确认，因为请求的条件可能因此发生变化。 　　注意：虽然RFC 1945和RFC 2068规范不允许客户端在重定向时改变请求的方法，但是很多现存的浏览器将302响应视作为303响应，并且使用 GET 方式访问在 Location 中规定的 URI，而无视原先请求的方法。状态码303和307被添加了进来，用以明确服务器期待客户端进行何种反应。

`303` 对应当前请求的响应可以在另一个 URI 上被找到，而且客户端应当采用 GET 的方式访问那个资源。这个方法的存在主要是为了允许由脚本激活的POST请求输出重定向到一个新的资源。这个新的 URI 不是原始资源的替代引用。同时，303响应禁止被缓存。当然，第二个请求（重定向）可能被缓存。 　　新的 URI 应当在响应的 Location 域中返回。除非这是一个 HEAD 请求，否则响应的实体中应当包含指向新的 URI 的超链接及简短说明。 　　注意：许多 HTTP/1.1 版以前的 浏览器不能正确理解303状态。如果需要考虑与这些浏览器之间的互动，302状态码应该可以胜任，因为大多数的浏览器处理302响应时的方式恰恰就是上述规范要求客户端处理303响应时应当做的。

`304` 如果客户端发送了一个带条件的 GET 请求且该请求已被允许，而文档的内容（自上次访问以来或者根据请求的条件）并没有改变，则服务器应当返回这个状态码。304响应禁止包含消息体，因此始终以消息头后的第一个空行结尾。 　　该响应必须包含以下的头信息： 　　Date，除非这个服务器没有时钟。假如没有时钟的服务器也遵守这些规则，那么代理服务器以及客户端可以自行将 Date 字段添加到接收到的响应头中去（正如RFC 2068中规定的一样），缓存机制将会正常工作。 　　ETag 和/或 Content-Location，假如同样的请求本应返回200响应。 　　Expires, Cache-Control，和/或Vary，假如其值可能与之前相同变量的其他响应对应的值不同的话。 　　假如本响应请求使用了强缓存验证，那么本次响应不应该包含其他实体头；否则（例如，某个带条件的 GET 请求使用了弱缓存验证），本次响应禁止包含其他实体头；这避免了缓存了的实体内容和更新了的实体头信息之间的不一致。 　　假如某个304响应指明了当前某个实体没有缓存，那么缓存系统必须忽视这个响应，并且重复发送不包含限制条件的请求。 　　假如接收到一个要求更新某个缓存条目的304响应，那么缓存系统必须更新整个条目以反映所有在响应中被更新的字段的值。

`305` 被请求的资源必须通过指定的代理才能被访问。Location 域中将给出指定的代理所在的 URI 信息，接收者需要重复发送一个单独的请求，通过这个代理才能访问相应资源。只有原始服务器才能建立305响应。 　　注意：RFC 2068中没有明确305响应是为了重定向一个单独的请求，而且只能被原始服务器建立。忽视这些限制可能导致严重的安全后果。  
`306` 在最新版的规范中，306状态码已经不再被使用。

`307` 请求的资源现在临时从不同的URI 响应请求。由于这样的重定向是临时的，客户端应当继续向原有地址发送以后的请求。只有在Cache-Control或Expires中进行了指定的情况下，这个响应才是可缓存的。 　　新的临时性的URI 应当在响应的 Location 域中返回。除非这是一个HEAD 请求，否则响应的实体中应当包含指向新的URI 的超链接及简短说明。因为部分浏览器不能识别307响应，因此需要添加上述必要信息以便用户能够理解并向新的 URI 发出访问请求。 　　如果这不是一个GET 或者 HEAD 请求，那么浏览器禁止自动进行重定向，除非得到用户的确认，因为请求的条件可能因此发生变化。

`400` 1、语义有误，当前请求无法被服务器理解。除非进行修改，否则客户端不应该重复提交这个请求。 　　2、请求参数有误。

`401` 当前请求需要用户验证。该响应必须包含一个适用于被请求资源的 WWW-Authenticate 信息头用以询问用户信息。客户端可以重复提交一个包含恰当的 Authorization 头信息的请求。如果当前请求已经包含了 Authorization 证书，那么401响应代表着服务器验证已经拒绝了那些证书。如果401响应包含了与前一个响应相同的身份验证询问，且浏览器已经至少尝试了一次验证，那么浏览器应当向用户展示响应中包含的实体信息，因为这个实体信息中可能包含了相关诊断信息。参见RFC 2617。  
`402` 该状态码是为了将来可能的需求而预留的。

`403` 服务器已经理解请求，但是拒绝执行它。与401响应不同的是，身份验证并不能提供任何帮助，而且这个请求也不应该被重复提交。如果这不是一个 HEAD 请求，而且服务器希望能够讲清楚为何请求不能被执行，那么就应该在实体内描述拒绝的原因。当然服务器也可以返回一个404响应，假如它不希望让客户端获得任何信息。

`404` 请求失败，请求所希望得到的资源未被在服务器上发现。没有信息能够告诉用户这个状况到底是暂时的还是永久的。假如服务器知道情况的话，应当使用410状态码来告知旧资源因为某些内部的配置机制问题，已经永久的不可用，而且没有任何可以跳转的地址。404这个状态码被广泛应用于当服务器不想揭示到底为何请求被拒绝或者没有其他适合的响应可用的情况下。

`405` 请求行中指定的请求方法不能被用于请求相应的资源。该响应必须返回一个Allow 头信息用以表示出当前资源能够接受的请求方法的列表。 　　鉴于 PUT，DELETE 方法会对服务器上的资源进行写操作，因而绝大部分的网页服务器都不支持或者在默认配置下不允许上述请求方法，对于此类请求均会返回405错误。

`406` 请求的资源的内容特性无法满足请求头中的条件，因而无法生成响应实体。 　　除非这是一个 HEAD 请求，否则该响应就应当返回一个包含可以让用户或者浏览器从中选择最合适的实体特性以及地址列表的实体。实体的格式由 Content-Type 头中定义的媒体类型决定。浏览器可以根据格式及自身能力自行作出最佳选择。但是，规范中并没有定义任何作出此类自动选择的标准。

407

与401响应类似，只不过客户端必须在代理服务器上进行身份验证。代理服务器必须返回一个 Proxy-Authenticate 用以进行身份询问。客户端可以返回一个 Proxy-Authorization 信息头用以验证。参见RFC 2617。  
　  
`408` 请求超时。客户端没有在服务器预备等待的时间内完成一个请求的发送。客户端可以随时再次提交这一请求而无需进行任何更改。

`409` 由于和被请求的资源的当前状态之间存在冲突，请求无法完成。这个代码只允许用在这样的情况下才能被使用：用户被认为能够解决冲突，并且会重新提交新的请求。该响应应当包含足够的信息以便用户发现冲突的源头。 　　冲突通常发生于对 PUT 请求的处理中。例如，在采用版本检查的环境下，某次 PUT 提交的对特定资源的修改请求所附带的版本信息与之前的某个（第三方）请求向冲突，那么此时服务器就应该返回一个409错误，告知用户请求无法完成。此时，响应实体中很可能会包含两个冲突版本之间的差异比较，以便用户重新提交归并以后的新版本。

`410` 被请求的资源在服务器上已经不再可用，而且没有任何已知的转发地址。这样的状况应当被认为是永久性的。如果可能，拥有链接编辑功能的客户端应当在获得用户许可后删除所有指向这个地址的引用。如果服务器不知道或者无法确定这个状况是否是永久的，那么就应该使用404状态码。除非额外说明，否则这个响应是可缓存的。 　　410响应的目的主要是帮助网站管理员维护网站，通知用户该资源已经不再可用，并且服务器拥有者希望所有指向这个资源的远端连接也被删除。这类事件在限时、增值服务中很普遍。同样，410响应也被用于通知客户端在当前服务器站点上，原本属于某个个人的资源已经不再可用。当然，是否需要把所有永久不可用的资源标记为’410 Gone’，以及是否需要保持此标记多长时间，完全取决于服务器拥有者。

`411` 服务器拒绝在没有定义 Content-Length 头的情况下接受请求。在添加了表明请求消息体长度的有效 Content-Length 头之后，客户端可以再次提交该请求。

`412` 服务器在验证在请求的头字段中给出先决条件时，没能满足其中的一个或多个。这个状态码允许客户端在获取资源时在请求的元信息（请求头字段数据）中设置先决条件，以此避免该请求方法被应用到其希望的内容以外的资源上。

`413` 服务器拒绝处理当前请求，因为该请求提交的实体数据大小超过了服务器愿意或者能够处理的范围。此种情况下，服务器可以关闭连接以免客户端继续发送此请求。 　　如果这个状况是临时的，服务器应当返回一个 Retry-After 的响应头，以告知客户端可以在多少时间以后重新尝试。

`414` 请求的URI 长度超过了服务器能够解释的长度，因此服务器拒绝对该请求提供服务。这比较少见，通常的情况包括： 　　本应使用POST方法的表单提交变成了GET方法，导致查询字符串（Query String）过长。 　　重定向URI “黑洞”，例如每次重定向把旧的 URI 作为新的 URI 的一部分，导致在若干次重定向后 URI 超长。 　　客户端正在尝试利用某些服务器中存在的安全漏洞攻击服务器。这类服务器使用固定长度的缓冲读取或操作请求的 URI，当 GET 后的参数超过某个数值后，可能会产生缓冲区溢出，导致任意代码被执行\[1\]。没有此类漏洞的服务器，应当返回414状态码。

`415` 对于当前请求的方法和所请求的资源，请求中提交的实体并不是服务器中所支持的格式，因此请求被拒绝。

`416` 如果请求中包含了 Range 请求头，并且 Range 中指定的任何数据范围都与当前资源的可用范围不重合，同时请求中又没有定义 If-Range 请求头，那么服务器就应当返回416状态码。 　　假如 Range 使用的是字节范围，那么这种情况就是指请求指定的所有数据范围的首字节位置都超过了当前资源的长度。服务器也应当在返回416状态码的同时，包含一个 Content-Range 实体头，用以指明当前资源的长度。这个响应也被禁止使用 multipart/byteranges 作为其 Content-Type。

`417` 在请求头 Expect 中指定的预期内容无法被服务器满足，或者这个服务器是一个代理服务器，它有明显的证据证明在当前路由的下一个节点上，Expect 的内容无法被满足。  
`421` 从当前客户端所在的IP地址到服务器的连接数超过了服务器许可的最大范围。通常，这里的IP地址指的是从服务器上看到的客户端地址（比如用户的网关或者代理服务器地址）。在这种情况下，连接数的计算可能涉及到不止一个终端用户。

`422` 从当前客户端所在的IP地址到服务器的连接数超过了服务器许可的最大范围。通常，这里的IP地址指的是从服务器上看到的客户端地址（比如用户的网关或者代理服务器地址）。在这种情况下，连接数的计算可能涉及到不止一个终端用户。  
422 请求格式正确，但是由于含有语义错误，无法响应。（RFC 4918 WebDAV）423 Locked 　　当前资源被锁定。（RFC 4918 WebDAV）

`424` 由于之前的某个请求发生的错误，导致当前请求失败，例如 PROPPATCH。（RFC 4918 WebDAV）

`425` 在WebDav Advanced Collections 草案中定义，但是未出现在《WebDAV 顺序集协议》（RFC 3658）中。

`426` 客户端应当切换到TLS/1.0。（RFC 2817）

`449` 由微软扩展，代表请求应当在执行完适当的操作后进行重试。

`500` 服务器遇到了一个未曾预料的状况，导致了它无法完成对请求的处理。一般来说，这个问题都会在服务器的程序码出错时出现。

`501` 服务器不支持当前请求所需要的某个功能。当服务器无法识别请求的方法，并且无法支持其对任何资源的请求。

`502` 作为网关或者代理工作的服务器尝试执行请求时，从上游服务器接收到无效的响应。

`503` 由于临时的服务器维护或者过载，服务器当前无法处理请求。这个状况是临时的，并且将在一段时间以后恢复。如果能够预计延迟时间，那么响应中可以包含一个 Retry-After 头用以标明这个延迟时间。如果没有给出这个 Retry-After 信息，那么客户端应当以处理500响应的方式处理它。 　　注意：503状态码的存在并不意味着服务器在过载的时候必须使用它。某些服务器只不过是希望拒绝客户端的连接。

`504` 作为网关或者代理工作的服务器尝试执行请求时，未能及时从上游服务器（URI标识出的服务器，例如HTTP、FTP、LDAP）或者辅助服务器（例如DNS）收到响应。 　　注意：某些代理服务器在DNS查询超时时会返回400或者500错误

`505` 服务器不支持，或者拒绝支持在请求中使用的 HTTP 版本。这暗示着服务器不能或不愿使用与客户端相同的版本。响应中应当包含一个描述了为何版本不被支持以及服务器支持哪些协议的实体。

`506` 由《透明内容协商协议》（RFC 2295）扩展，代表服务器存在内部配置错误：被请求的协商变元资源被配置为在透明内容协商中使用自己，因此在一个协商处理中不是一个合适的重点。

`507` 服务器无法存储完成请求所必须的内容。这个状况被认为是临时的。WebDAV (RFC 4918)  
`509` 服务器达到带宽限制。这不是一个官方的状态码，但是仍被广泛使用。

`510` 获取资源所需要的策略并没有没满足。（RFC 2774）

## 关于post和get的区别 ##

**基础的知识**

1,GET在浏览器回退时是无害的，而POST会再次提交请求。
    
    2,GET产生的URL地址可以被加到标签，而POST不可以。
    
    3,GET请求会被浏览器主动cache，而POST不会，除非手动设置
    
    4,GET请求只能进行url编码，而POST支持多种编码方式`。
    
    5,GET请求参数会被完整保留在浏览器历史记录里，而POST中的参数不会被保留。
    
    6,GET请求在URL中传送的参数是有长度限制的，而POST么有。
    
    7,对参数的数据类型，GET只接受ASCII字符，而POST没有限制。
    
    8,GET比POST更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息。
    
    9,GET参数通过URL传递，POST放在Request body中。
    
    10,get传送的数据量较小，不能大于2KB。post传送的数据量较大，一般被默认为不受限制。但理论上，IIS4中最大量为80KB，IIS5中为100KB。

**本质(最大区别)：**

`http`是基于`tcp/ip`协议的，所以`get，post`底层也是`tcp/ip`,都是`tcp`链接，所以`get`在请求体加数据和`post`在`url`加参数行得通，但有风险，强制这么干，`或许服务器存在接收不到数据的情况这或许就是浏览器之间存在差异的原因`

但是本质get/post都是tcp链接，并无区别，只不过http的规定和服务器限制导致常规的体现不同而已

## 一个灵魂区别: ##

get:会把请求头和数据一次发送，服务器响应200（成功返回数据）
    
    post：先发送请求头，服务器响应100，浏览器再发送数据，服务器再次响应200

`get:因为一步操作理论上来讲比2步来的快，性能好，所以get性能更好`，

雅虎团队曾想用get替换post提升性能但诸多浏览器差异，http规范升级等导致get和post的语义更加具体化，可能会存在各种坑

post:但是post的两次包的tcp在`验证数据完整性`有非常大优点

注意：貌似firefox中post就是发包一次

## **关于304** ##

客户端在请求一个文件的时候，发现自己缓存的文件有 Last Modified ，那么在请求中会包含 If Modified Since ，这个时间就是缓存文件的 Last Modified 。因此，如果请求中包含 If Modified Since，就说明已经有缓存在客户端。服务端只要判断这个时间和当前请求的文件的修改时间就可以确定是返回 304 还是 200 。  
对于静态文件，例如：CSS、图片，服务器会自动完成 Last Modified 和 If Modified Since 的比较，完成缓存或者更新。但是对于动态页面，就是动态产生的页面，往往没有包含 Last Modified 信息，这样浏览器、网关等都不会做缓存，也就是在每次请求的时候都完成一个 200 的请求。  
因此，对于动态页面做缓存加速，首先要在 Response 的 HTTP Header 中增加 Last Modified 定义，其次根据 Request 中的 If Modified Since 和被请求内容的更新时间来返回 200 或者 304 。虽然在返回 304 的时候已经做了一次数据库查询，但是可以避免接下来更多的数据库查询，并且没有返回页面内容而只是一个 HTTP Header，从而大大的降低带宽的消耗，对于用户的感觉也是提高。当这些缓存有效的时候，通过 Fiddler 或HttpWatch 查看一个请求会得到这样的结果：

第一次访问 200  
按F5刷新（第二次访问） 304  
按Ctrl+F5强制刷新 200  
下面用Fiddler来查看上面的访问请求过程  
第一次(首次)访问 200  
第二次F5刷新访问 304  
请求的头信息里多了 “If-Modified-Since",“If-None-Match”  
第三次 按Ctrl+F5强制刷新 200  
同第一次，不贴图了  
为什么要使用条件请求  
当用户访问一个网页时,条件请求可以加速网页的打开时间(因为可以省去传输整个响应体的时间),但仍然会有网络延迟,因为浏览器还是得为每个资源生成一条条件请求,并且等到服务器返回HTTP/304响应,才能读取缓存来显示网页.更理想的情况是,服务器在响应上指定Cache-Control或Expires指令,这样客户端就能知道该资源的可用时间为多长,也就能跳过条件请求的步骤,直接使用缓存中的资源了.可是,即使服务器提供了这些信息,在下列情况下仍然需要使用条件请求:

在超过服务器指定的过期时间之后  
如果用户执行了刷新操作的话  
在上节给出的图片中,请求头中包含了一个Pragma: no-cache.这是由于用户使用F5刷新了网页.如果用户按下了CTRL-F5 (有时称之为“强刷-hard refresh”),你会发现浏览器省略了If-Modified-Since和If-None-Match请求头,也就是无条件的请求页面中的每个资源.

避免条件请求  
通常来说,缓存是个好东西.如果你想提高自己网站的访问速度,缓存是必须要考虑的.可是在调试的时候,有时候需要阻止缓存,这样才能确保你所访问到的资源是最新的.

你也许会有个疑问:“如果不改变网站内容,我怎么才能让Fiddler不返回304而返回一个包含响应体的HTTP/200响应呢?”

你可以在Fiddler中的网络会话(Web Sessions)列表中选择一条响应为HTTP/304的会话,然后按下U键.Fiddler将会无条件重发(Unconditionally reissue)这个请求.然后使用命compare命令对比一下两个请求有什么不同,对比结果如下,从中可以得知,Fiddler是通过省略条件请求头来实现无缓存请求的:

Screenshot of Windiff of conditional and unconditional requests

如果你想全局阻止HTTP/304响应,可以这么做:首先清除浏览器的缓存,可以使用Fiddler工具栏上的Clear Cache按钮(仅能清除Internet Explorer缓存),或者在浏览器上按CTRL+SHIFT+DELETE(所有浏览器都支持).在清除浏览器的缓存之后,回到Fiddler中,在菜单中选择Rules > Performance > Disable Caching选项,然后Fiddler就会:删除所有请求中的条件请求相同的请求头以及所有响应中的缓存时间相关的响应头.此外,还会在每个请求中添加Pragma: no-cache请求头,在每个响应中添加`Cache-Control: no-cache`响应头,阻止浏览器缓存这些资源.

## http请求报文： ##

\--------最简单就是f12,随便打开随便看  
HTTP报文是在HTTP应用程序之间发送的数据块。  
HTTP报文是面向文本的，报文中的每一个字段都是一些ASCII码串，各个字段的长度是不确定的。HTTP有两类报文：请求报文和响应报文。  
一个HTTP请求报文由请求行（request line）、请求头部（header）、空行和请求数据4个部分组成，下图给出了请求报文的一般格式

＜request-line＞ 请求行  
＜headers＞ 请求头  
＜blank line＞ 空格  
＜request-body＞ 请求数据

**1.请求行**  
请求行由请求方法字段、URL字段和HTTP协议版本字段3个字段组成，它们用空格分隔。例如，GET /index.html HTTP/1.1。  
HTTP协议的请求方法有GET、POST、HEAD、PUT、DELETE、OPTIONS、TRACE、CONNECT。

HEAD就像GET，只不过服务端接受到HEAD请求后只返回响应头，而不会发送响应内容。当我们只需要查看某个页面的状态的时候，使用HEAD是非常高效的，因为在传输的过程中省去了页面内容。

列子：  
Request URL:[https://www.baidu.com/][https_www.baidu.com]  
Request Method:GET  
Status Code:200 OK  
Remote Address:172.31.1.246:8080

**2.请求头部**

请求头部由关键字/值对组成，每行一对，关键字和值用英文冒号“:”分隔。请求头部通知服务器有关于客户端请求的信息，典型的请求头有：  
User-Agent：产生请求的浏览器类型。  
Accept：客户端可识别的内容类型列表。  
Host：请求的主机名，允许多个域名同处一个IP地址，即虚拟主机。  
列子：  
Cache-Control:private, max-age=10  
Connection:Keep-Alive  
Content-Encoding:gzip  
Content-Type:text/html; charset=utf-8  
Date:Tue, 21 Feb 2017 03:05:37 GMT  
Expires:Tue, 21 Feb 2017 03:05:47 GMT  
Last-Modified:Tue, 21 Feb 2017 03:05:37 GMT  
Proxy-Connection:Keep-Alive  
Transfer-Encoding:chunked  
Vary:Accept-Encoding  
X-UA-Compatible:IE=10

**3.空行**  
最后一个请求头之后是一个空行，发送回车符和换行符，通知服务器以下不再有请求头。

**4.请求数据**  
请求数据不在GET方法中使用，而是在POST方法中使用。POST方法适用于需要客户填写表单的场合。与请求数据相关的最常使用的请求头是`Content-Type`和`Content-Length。`

## HTTP响应报文 ##

HTTP响应也由三个部分组成，分别是：`状态行`、`消息报头`、`响应正文`。

＜status-line＞  
＜headers＞  
＜blank line＞  
＜response-body＞

正如你所见，在响应中唯一真正的区别在于第一行中用状态信息代替了请求信息。状态行（status line）通过提供一个状态码来说明所请求的资源情况。

状态行格式如下：  
HTTP-Version Status-Code Reason-Phrase CRLF  
其中，HTTP-Version表示服务器HTTP协议的版本；Status-Code表示服务器发回的响应状态代码；Reason-Phrase表示状态代码的文本描述。状态代码由三位数字组成，第一个数字定义了响应的类别，且有五种可能取值。  
1xx：指示信息–表示请求已接收，继续处理。  
2xx：成功–表示请求已被成功接收、理解、接受。  
3xx：重定向–要完成请求必须进行更进一步的操作。  
4xx：客户端错误–请求有语法错误或请求无法实现。  
5xx：服务器端错误–服务器未能实现合法的请求。  
常见状态代码、状态描述的说明如下。  
200 OK：客户端请求成功。  
400 Bad Request：客户端请求有语法错误，不能被服务器所理解。  
401 Unauthorized：请求未经授权，这个状态代码必须和WWW-Authenticate报头域一起使用。  
403 Forbidden：服务器收到请求，但是拒绝提供服务。  
404 Not Found：请求资源不存在，举个例子：输入了错误的URL。  
500 Internal Server Error：服务器发生不可预期的错误。  
503 Server Unavailable：服务器当前不能处理客户端的请求，一段时间后可能恢复正常，举个例子：HTTP/1.1 200 OK（CRLF）。

例子：  
HTTP/1.1 200 OK Date: Sat, 31 Dec 2005 23:59:59 GMT Content-Type: text/html;charset=ISO-8859-1 Content-Length: 122 ＜html＞ ＜head＞ ＜title＞Wrox Homepage＜/title＞ ＜/head＞ ＜body＞ ＜!-- body goes here --＞ ＜/body＞ ＜/html＞

## 跨域： ##

违反了浏览器的同源策略：即限制请求非当前域名下的资源：同源：即协议（http/https），ip,端口  
常用跨域解决方案  
例如  
1、 通过jsonp跨域  
2、 document.domain + iframe跨域  
3、 location.hash + iframe  
4、 [window.name][] \+ iframe跨域  
5、 postMessage跨域  
6、 跨域资源共享（CORS）  
7、 nginx代理跨域  
8、 nodejs中间件代理跨域  
9、 WebSocket协议跨域

**什么是跨域？**  
`跨域是指一个域下的文档或脚本试图去请求另一个域下的资源`，这里跨域是广义的。  
广义的跨域：  
1.) 资源跳转： A链接、重定向、表单提交  
2.) 资源嵌入： 、

[http://www.domain.com:8000/a.js][http_www.domain.com_8000_a.js]  
[http://www.domain.com/b.js][http_www.domain.com_b.js] 同一域名，不同端口 不允许

[http://www.domain.com/a.js][http_www.domain.com_a.js]  
[https://www.domain.com/b.js][https_www.domain.com_b.js] 同一域名，不同协议 不允许

[http://www.domain.com/a.js][http_www.domain.com_a.js]  
[http://192.168.4.12/b.js][http_192.168.4.12_b.js] 域名和域名对应相同ip 不允许

[http://www.domain.com/a.js][http_www.domain.com_a.js]  
[http://x.domain.com/b.js][http_x.domain.com_b.js] 主域相同，子域不同 不允许  
[http://domain.com/c.js][http_domain.com_c.js]

[http://www.domain1.com/a.js][http_www.domain1.com_a.js]  
[http://www.domain2.com/b.js][http_www.domain2.com_b.js] 不同域名 不允许

**跨域解决方案**

1、 通过jsonp跨域 GET
    
    2、 document.domain + iframe跨域 
    
    3、 location.hash + iframe
    
    4、 window.name + iframe跨域
    
    5、 postMessage跨域 
    
    6、 跨域资源共享（CORS）
    
    7、 nginx代理跨域
    
    8、 nodejs中间件代理跨域
    
    9、 WebSocket协议跨域

**一、 通过jsonp跨域**

通常为了减轻web服务器的负载，我们把js、css，img等静态资源分离到另一台独立域名的服务器上，在html页面中再通过相应的标签从不同域名下加载静态资源，而被浏览器允许，基于此原理，我们可以通过动态创建script，再请求一个带参网址实现跨域通信。

`A:`原生实现：

服务端返回如下（返回时即执行全局函数）： `onBack({"status": true, "user": "admin"})`

`B:`jquery ajax：

$.ajax({
        url: 'http://www.domain2.com:8080/login',
        type: 'get',
        dataType: 'jsonp',  // 请求方式为jsonp
        jsonpCallback: "onBack",    // 自定义回调函数名
        data: {}
    });

`C:` vue.js：

this.$http.jsonp('http://www.domain2.com:8080/login', {
        params: {},
        jsonp: 'onBack'
    }).then((res) => {
        console.log(res); 
    })

后端node.js代码示例：

var querystring = require('querystring');
    var http = require('http');
    var server = http.createServer();
    
    server.on('request', function(req, res) {
        var params = qs.parse(req.url.split('?')[1]);
        var fn = params.callback;
    
        // jsonp返回设置
        res.writeHead(200, { 'Content-Type': 'text/javascript' });
        res.write(fn + '(' + JSON.stringify(params) + ')');
    
        res.end();
    });
    
    server.listen('8080');

**jsonp缺点：只能实现get一种请求。**

**二、 document.domain + iframe跨域**

此方案仅`限主域相同，子域不同`的跨域应用场景。  
实现原理：两个页面都通过js强制设置document.domain为基础主域，就实现了同域。  
1.）父窗口：([www.domain.com/a.html][www.domain.com_a.html])

2.）子窗口：([child.domain.com/b.html][child.domain.com_b.html])

**三、 location.hash + iframe跨域**

实现原理： a欲与b跨域相互通信，通过中间页c来实现。 三个页面，不同域之间利用iframe的location.hash传值，相同域之间直接js访问来通信。  
具体实现：A域：a.html -> B域：b.html -> A域：c.html，a与b不同域只能通过hash值单向通信，b与c也不同域也只能单向通信，但c与a同域，所以c可通过parent.parent访问a页面所有对象。

1.）a.html：([www.domain1.com/a.html][www.domain1.com_a.html])

2.）b.html：([www.domain2.com/b.html][www.domain2.com_b.html])

3.）c.html：([www.domain1.com/c.html][www.domain1.com_c.html])

**四、 [window.name][] \+ iframe跨域**

window.name属性的独特之处：name值在不同的页面（甚至不同域名）加载后依旧存在，并且可以支持非常长的 name 值（2MB）。  
1.）

a.html：([www.domain1.com/a.html][www.domain1.com_a.html]

var proxy = function(url, callback) {
        var state = 0;
        var iframe = document.createElement('iframe');

加载跨域页面

iframe.src = url;
           // onload事件会触发2次，第1次加载跨域页，并留存数据于window.name
     iframe.onload = function() {
        if (state === 1) {
            // 第2次onload(同域proxy页)成功后，读取同域window.name中数据
            callback(iframe.contentWindow.name);
            destoryFrame();
    
        } else if (state === 0) {
            // 第1次onload(跨域页)成功后，切换到同域代理页面
            iframe.contentWindow.location = 'http://www.domain1.com/proxy.html';
            state = 1;
        }
    };
    
    document.body.appendChild(iframe);

获取数据以后销毁这个iframe，释放内存；这也保证了安全（不被其他域frame js访问）

function destoryFrame() {
            iframe.contentWindow.document.write('');
            iframe.contentWindow.close();
            document.body.removeChild(iframe);
        }
    };

// 请求跨域b页面数据

proxy('http://www.domain2.com/b.html', function(data){
        alert(data);
    });

2.）proxy.html：([www.domain1.com/proxy][www.domain1.com_proxy]…

中间代理页，与a.html同域，内容为空即可。

3.）b.html：([www.domain2.com/b.html][www.domain2.com_b.html])

总结：通过iframe的src属性由外域转向本地域，跨域数据即由iframe的window.name从外域传递到本地域。这个就巧妙地绕过了浏览器的跨域访问限制，但同时它又是安全操作。

**五、 postMessage跨域**

postMessage是HTML5 XMLHttpRequest Level 2中的API，且是为数不多可以跨域操作的window属性之一，它可用于解决以下方面的问题：

a.） 页面和其打开的新窗口的数据传递
    
    b.） 多窗口之间消息传递
    
    c.） 页面与嵌套的iframe消息传递
    
    d.） 上面三个场景的跨域数据传递

用法：postMessage(data,origin)方法接受两个参数  
data： html5规范支持任意基本类型或可复制的对象，但部分浏览器只支持字符串，所以传参时最好用JSON.stringify()序列化。  
origin： 协议+主机+端口号，也可以设置为"\*"，表示可以传递给任意窗口，如果要指定和当前窗口同源的话设置为"/"。  
1.）a.html：([www.domain1.com/a.html][www.domain1.com_a.html])

2.）b.html：([www.domain2.com/b.html][www.domain2.com_b.html])

**六、 跨域资源共享（CORS）**

普通跨域请求：只服务端设置`Access-Control-Allow-Origin`即可，前端无须设置。  
带`cookie`请求：前后端都需要设置字段，另外需注意：所带`cookie`为跨域请求接口所在域的`cookie`，而非当前页。  
目前，所有浏览器都支持该功能(IE8+：IE8/9需要使用XDomainRequest对象来支持CORS）)，`CORS`也已经成为主流的跨域解决方案。

1、 前端设置：  
1.）原生ajax  
// 前端设置是否带`cookie`  
xhr.withCredentials = true;  
示例代码：  
var xhr = new XMLHttpRequest(); // IE8/9需用window.XDomainRequest兼容

// 前端设置是否带`cookie`

xhr.withCredentials = true;
    
    xhr.open('post', 'http://www.domain2.com:8080/login', true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.send('user=admin');
    
    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4 && xhr.status == 200) {
            alert(xhr.responseText);
        }
    };

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTYwNzQy_size_16_color_FFFFFF_t_70]: /images/20220416/0285e55e1c044c22928b2597715bc934.png
[20181117013226414.png]: /images/20220416/2d886837143c409ebf5209e9ffd87b99.png
[201811170132412.png]: /images/20220416/6b3efa78e0d74ff28c1ee1705d5bf368.png
[20181117013325816.png]: /images/20220416/7caa4125b0894c8481ab449a5a60e95e.png
[20181117013340958.png]: /images/20220416/ecc2272df5f2495d9d2b71ba4360dbbf.png
[20181117013405163.png]: /images/20220416/2b19d988d37f457691f9940ba55b7402.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTYwNzQy_size_16_color_FFFFFF_t_70 1]: /images/20220416/98a9f0c0cf554935ad3b5b20a572eeb2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTYwNzQy_size_16_color_FFFFFF_t_70 2]: /images/20220416/0db8adcb92184e0ebe1d942401702cbe.png
[https_www.baidu.com]: https://www.baidu.com/
[window.name]: http://window.name
[http_www.domain.com_8000_a.js]: http://www.domain.com:8000/a.js
[http_www.domain.com_b.js]: http://www.domain.com/b.js
[http_www.domain.com_a.js]: http://www.domain.com/a.js
[https_www.domain.com_b.js]: https://www.domain.com/b.js
[http_192.168.4.12_b.js]: http://192.168.4.12/b.js
[http_x.domain.com_b.js]: http://x.domain.com/b.js
[http_domain.com_c.js]: http://domain.com/c.js
[http_www.domain1.com_a.js]: http://www.domain1.com/a.js
[http_www.domain2.com_b.js]: http://www.domain2.com/b.js
[www.domain.com_a.html]: http://www.domain.com/a.html
[child.domain.com_b.html]: http://child.domain.com/b.html
[www.domain1.com_a.html]: http://www.domain1.com/a.html
[www.domain2.com_b.html]: http://www.domain2.com/b.html
[www.domain1.com_c.html]: http://www.domain1.com/c.html
[www.domain1.com_proxy]: http://www.domain1.com/proxy