小白说的啥？那实操一下和响应报文具体长什么样子

有点抽象？不知道小白说了什么？那就动手吧，使用wireshark抓包，看看猫片中的请求消息和响应消息是什么样子的。

请求消息

GET /cmaskboss/164203142_30_1.enhance.webmask HTTP/1.1
Host: upos-sz-staticks3.bilivideo.com
Connection: keep-alive
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.150 Safari/537.36
Accept: */*
Origin: https://www.bilibili.com
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: https://www.bilibili.com/
Accept-Encoding: identity
Accept-Language: zh-CN,zh;q=0.9
Range: bytes=0-16

上面第一行的GET是请求方法，/cmaskboss/164203142_30_1.enhance.webmask是URL，HTTP/1.1是协议版本。接下来从Host开始到Range的最后一行，都是Headers。

响应消息

HTTP/1.1 206 Partial Content
Content-Type: application/octet-stream
Content-Length: 17
Connection: keep-alive
Server: Tengine
ETag: "92086de1e6d1d4791fb950a0ac7e30ba"
Date: Sat, 30 Jan 2021 09:31:31 GMT
Last-Modified: Sun, 04 Oct 2020 01:54:28 GMT
Expires: Mon, 01 Mar 2021 09:31:31 GMT
Age: 1018695
Content-Range: bytes 0-16/353225
Accept-Ranges: bytes
X-Application-Context: application
x-kss-request-id: 75bcbfa8ab194e3c825e89c81a912692
x-kss-BucketOwner: MjAwMDAyMDEwNw==
X-Info-StorageClass: -
Content-MD5: kght4ebR1HkfuVCgrH4wug==
X-Cache-Status: HIT from KS-CLOUD-JH-MP-01-03
X-Cache-Status: HIT from KS-CLOUD-TJ-UN-14-13
X-Cache-Status: HIT from KS-CLOUD-LF-UN-11-25
Access-Control-Allow-Origin: https://www.bilibili.com
Access-Control-Allow-Headers: Origin,X-Requested-With,Content-Type,Accept,range
X-Cdn-Request-ID: 7e2c783ca7d392624118593ec1dc66bc

与请求消息类似，HTTP/1.1 是协议版本，206 是状态码，Partial Content 是状态描述符。接下来从Content-Type到X-Cdn-Request-ID的最后一行是header信息。

消息信息解读

其实在浏览器中按F12就可以看到上面的抓包信息。你应该使用wireshark的原因可能只是安装X更好。按F12查看响应数据如下图所示。

1.请求数据

2.响应数据

3.请求 URL URL 是什么？

URL 代表统一资源定位器。作用是告诉用户Web上某个资源的地址。这个资源可以是HTML页面、CSS文档、图片或者猫等。上面我们请求的猫片的URL在这里细分，可以分成几个部分。

指示 URL 的协议部分是 http 还是 https，使用 // 作为分隔符。上面的 URL 表示网页使用的是 HTTPS 协议，而上面提到的 X 影子乐园使用的是 ftp 协议的下载链接。

域名是 upos-sz-staticks3.bilivideo.com。在发送请求之前，它会将 IP 解析到 DNS 服务器。如果已经知道IP，可以跳过DNS解析步骤，直接使用IP作为域名。

域名有时会跟一个端口，域名之间用:分隔。端口不是 URL 的必要部分。当 url 为 时，默认端口为 80

当 URL 为 时，默认端口为 443，以上两种都可以省略端口号。上面的 URL 实际上省略了 443 端口号。

从域名的第一个/到最后一个/，是虚拟目录的一部分。虚拟目录也不是 URL 的必要部分，在这种情况下，虚拟目录是 /cmaskboss/

从域名的最后一个/到?，是文件名部分；如果没有?，则为域名最后一个/到#的文件名部分；如果没有？和#，然后从域名的最后一个/开始到结束，就是文件名部分。此示例中的文件名是 164203142_30_1.enhance.webmask，文件名不是 URL 的必需部分。

URL和URI之间的区别

其实，一直有误会。很多人认为 URI 是 URL 的子集，其实应该反过来。URL 是 URI 的子集。简单解释一下。

假设“小白”（URI）是一个资源，“在迪丽巴的怀里”表示一个位置。如果你想找到（定位）小白，那么你可以去“在帝一巴的怀里”找到小白，而“在帝一巴的怀里/小白”就是我们常说的网址。而“帝一巴怀里的/小白”（URL）显然是“小白”（URI）的一个子集，毕竟“小白”也有可能是“牛一飞怀里的/小白”（其他URL）。

4.请求方法

HTTP 定义了一组请求方法来指示要对给定资源执行的操作。指示要对给定资源执行的所需操作。虽然它们也可以是名词，但这些请求方法有时被称为 HTTP 动词。每个请求方法实现不同的语义。

这次在B站猫片的请求中使用了GET，意思是获取。但实际上，HTTP 定义了多种请求方法来满足各种需求。除了 Get，还有 POST、HEAD、OPTIONS、PUT、DELETE、TRACE 和 CONNECT。

各个常用请求方法的具体功能如下：

得到

请求指定页面信息，返回消息体（body）+头信息（header）。

头：

HEAD和GET的本质是一样的，不同的是HEAD只返回头信息（header），而不返回消息体（body）。不要认为它没有用。和 GET 和 POST 一样，在 http/1.0 时就存在，是三长老之一。主要的意思

邮政

向服务器提交数据。这种方式应用比较广泛，目前几乎所有的提交操作都是靠这个来完成的。POST和GET是最常用的，但最大的区别是POST每次调用都可能修改数据，是非幂等的，而GET类似于只读，是幂等的。

放：

这种方法比较少见。POST 在 HTTP 规范中是非幂等的，多次调用会产生不同的结果。例如，如果由于网络原因或其他原因多次创建用户，则会创建多个用户。而PUT id/xiaobai会创建一个id为xiaobai的用户，多次调用结果相同，所以PUT是幂等的。不过为了避免精神负担，实战中也使用POST代替PUT。

删除：

删除资源。基本上，这也很少见。一般情况下，如果是删除操作，也会使用 POST 来代替。

选项：什么是选项

用于获取当前 URL 支持的方法。如果请求成功，会在 HTTP 响应头中带上各种“Allow”头，表明一个请求在对应的服务器中支持哪种请求方式。例如下图：

这里有两点需要注意

期权可以称为网络协议中的老实人。就像老实人刚刚谈了个女朋友，每次牵手都问“我可以牵你的手吗？”“我可以牵你吗？” ，只有在得到承诺后才会开始。我几乎被这种诚实的气质感动得流下了眼泪。

什么时候需要使用选项

在跨域的情况下（记住这个词，后面会解释），浏览器会在发起复杂请求之前自动发起选项请求。跨域共享标准规范要求，对于那些可能对服务器数据产生副作用的HTTP请求方法（尤其是GET以外的HTTP请求，或者具有某些MIME类型的POST请求），浏览器必须首先使用options方法发起一个preflight request，从而知道服务器是否允许跨域请求。在服务器确认许可之前，不会发起实际的 HTTP 请求。

这里提到了两个关键词：

什么是简单请求和复杂请求。

有些请求不会触发 CORS 预检请求，这样的请求通常称为“简单请求”，而触发预检的请求是“复杂请求”。

1.简单请求

Content-Type 只有以下三个请求中的任何一个 XMLHttpRequestUpload 对象都没有注册任何事件监听器；请求中没有使用 ReadableStream 对象。

2.复杂请求

可以看出，由于上述请求在获取B站资源的请求头中包含Access-Control-Request-Headers:range，而该范围不在简单请求条件2中提到的头的范围内，所以这是一个复杂的请求，所以触发一个预检选项请求。

什么是跨域

刚才提到了一个词叫跨域，那么什么是跨域呢？在理解跨域之前，我们首先要了解一个概念：同源性。所谓同源，就是域名、协议、端口相同。

看不懂也没关系，举个例子吧。

需要注意的是，虽然 localhost 和 127.0.0.1 都指向本地机器，但它们并不属于同一个源。

非同源网页调用就是我们所说的跨域。在浏览器同源策略的限制下ttl传输中过期是什么意思，当一个XHR请求被发送到不同的来源时，浏览器认为该请求是不可信的，并禁止该请求，表现为请求后的异常响应。

期权会带来什么问题

可以看出，复杂请求的条件其实很容易满足，一旦满足复杂请求的条件，浏览器会发送两个请求（一个预检选项，一个复杂请求），这次选项又回来了第四次（One RTT），这显然会导致延迟和不必要的网络资源浪费ttl传输中过期是什么意思，并且在高并发的情况下可能会给服务器带来严重的性能消耗。

如何优化选项

在每个复杂请求之前调用一次选项，这实际上是非常不必要的。因为大部分时间都是同一个请求，短时间内得到的结果是不会改变的，能不能通过浏览器缓存保存这个查询呢？

Access-Control-Max-Age 是优化过程中使用的一个Header。它的作用是每次请求options方法，服务端返回并调用支持的方法（Access-Control-Allow-Methods）和headers（Access-Control-Allow-Headers），告诉你它正在接收是在Access-Control-Max-Age时间（单位是秒）中支持，那么在这段时间内，就不再需要使用options来请求了。特别是当Access-Control-Max-Age的值为-1时，表示缓存被禁用，每个请求都需要发送一个预检请求，即使用OPTIONS请求进行检测。

5.状态码 什么是状态码？

HTTP 状态码通常被称为 HTTP 状态码。当用户访问一个网页时，浏览器会向该网页所在的服务器发送一个请求。服务器会根据请求做出响应，状态码是响应的一部分，代表请求的结果。所有状态码的第一个数字代表响应的一般含义，第二个和第三个数字组合可以代表更具体的原因。如果请求失败，通过这个状态码，可以初步判断请求失败的原因。以下是五种状态码的含义。

状态码流程

您可以根据以下流程图了解各种状态码之间的关系。

常见状态码介绍

这是最常见的状态码。表示请求已经成功，数据正常返回。而且虽然B站猫电影里的反应是成功的，但不是200，而是206。为什么，让我们继续看。

这个状态码就是上面B站请求的响应结果。服务器已成功处理部分 GET 请求。在 B 站或迅雷看视频等 HTTP 下载工具使用这种类型的响应来从断点恢复上传或将大文档分解为多个下载段以同时下载。

6. 标头内容长度

Content-Length 是 HTTP 消息长度，以十进制数表示。Content-Length 标头指示数据包中消息的当前实际大小（以字节为单位）。如果消息文本是 gzip 压缩的，Content-Length 指的是压缩后的大小，而不是原始大小。

一般情况下，不需要手动设置Content-Length。大多数语言的网络库都会自动打包。但是，如果在某些特殊情况下，Content-Length 与要发送的消息的实际大小不一致，就有些问题了。

范围

视频播放需要支持用户调整播放进度，并允许用户选择直接跳到中间部分开始播放。为了实现这个功能，使用 HTTP Range Requests 协议来指定需要获取的视频片段。Request Header 中的 range 头用于指定要请求的文件的开始和结束位置。

连接长连接和短连接

Connection: keep-alive header 可能同时出现在 http1.1 的 Request Header 和 Reponse Header 中。Request Header 中的 Connection: keep-alive 头是告诉服务端，客户端要以长连接的形式进行通信。Response Header 中的 Connection: keep-alive 标头是服务器告诉客户端我的服务器支持长连接形式的通信。如果长连接不能使用，会返回Connection:close，相当于告诉客户端“我不支持长连接，你死定了，老老实实用短连接吧”。