灏天阁

前端应该了解的Http知识

· Yin灏

一. Response header 常用字段

拿一个飞猪的请求为例子,看 http 的字段 image.png

1. cache-control (强缓存常用、更早以前用 expires)

image.png

Cache-Control 用于控制缓存的行为。

1)相关取值

no-cache 和 no-store 的区别

  1. no-cache: 表示客户端在使用缓存副本之前必须先确认其有效性,需要向服务器发送请求验证缓存是否过期。例如:Cache-Control: no-cache
  2. no-store: 表示禁止缓存,所有请求和响应都不会被缓存。例如:Cache-Control: no-storepublic/private 的区别
  3. max-age: 指定资源的最大有效期,单位是秒
  4. public: 表示响应可以被公共缓存缓存(代理服务器也可以缓存)
  5. private: 表示响应只可以被客户端缓存 (不允许代理服务器缓存)
HTTP/1.1 200 OK
Content-Type: image/jpeg
Cache-Control: max-age=3600, private

2)cache-control: max-age 和 expires 的区别

  • expires: 过期时间为一个绝对时间,比如 “Expires: Fri, 10 Apr 2020 12:34:56 GMT”。不够灵活,因为依赖于客户端的时间准确性,有局限性。
  • max-age: 单位是秒,指定一个秒数来表示缓存时间。
  • 同时包含 expires 和 cache-control:max-age 的时候,max-age 的优先级更高。(http1.0 不支持的情况会忽略 max-age)
  • 如果浏览器支持 HTTP/1.1 或更高版本,建议使用 max-age3

关联 - http 缓存涉及到的设置 [掘金 cache-control 字段值详解]https://juejin.cn/post/6844903751493369870")

2. ETag (弱缓存常用、更早以前用 Last-modified)

1) 相关使用

  • 用于标识资源的唯一标识符,服务器可以生成并返回给客户端。例如:
HTTP/1.1 200 OK Content-Type: image/jpeg
ETag: "b-Ck1VqNd45QIvq3AZd8XYQLvEhtA"
  • 和 Request-header 的搭配 搭配 If-None-Match。服务端根据这个值判断是否有更新
GET /example.jpg HTTP/1.1
Host: example.com
If-None-Match: "b-Ck1VqNd45QIvq3AZd8XYQLvEhtA"

2) 和 Last-Modified 区别

  • 更早以前服务端用 Last-modified(绝对时间),客户端 request header 用 if-modified-since(绝对时间)。都是用的服务端时间。
  • ETag 比 Last-modified 更精确,因为 Last-modified 只支持 1 秒的精度,而 ETag 可以区分 1 秒内的多次修改2
  • 如果响应同时包含 Last-modified 和 ETag,那么 ETag 优先级更高。Etag 在 http1.1 后支持1

3) Etag 如何生成

一般生成 ETag 的原理是使用一种能够把资源的内容或状态转换成一个唯一字符串的函数,例如哈希函数1 2 3。哈希函数是一种能够把任意长度的输入转换成固定长度的输出的函数,而且具有抗冲突性,即很难找到两个不同的输入有相同的输出3。这样,当资源的内容或状态发生变化时,ETag 也会相应地变化,从而能够标识资源的版本。

例如,如果一个资源的内容是Hello World,可以使用 MD5 哈希函数生成 ETag,得到"b-Ck1VqNd45QIvq3AZd8XYQLvEhtA"。如果资源的内容变成Hello World!,则 ETag 也会变成"b-9aX0rXqXx9nEfmNzlHx8R7mjQ"

3. user-agent

代理人 => 用户代理软件的应用类型、操作系统、软件开发商以及版本号。 (js 中的话用 navigator 对象在前端获取)

4. keep-alive

HTTP/1.1 使用了 Keep-Alive 技术,允许在同一个 TCP 连接上复用多个请求和响应。减少重新建立连接的开销,提升性能。

  • 可以和 http2.0 的多路复用、Http 1.1 的管道化结合对比,参见下文[http1.0vs1.1](#二. http1.0 和 http1.1 的区别)

5. host 字段

Host 头字段是 HTTP 1.1 中引入的一个字段,用于指定服务器的主机名或域名,以便服务器可以支持多个域名和网站共享同一个 IP 地址。(在以前服务端主要通过收到的请求的 Ip 地址来确定请求的目标网站或应用。)

1)在有 Host 字段以前,服务端区别客户端

  1. 使用不同的 IP 地址:每个网站或应用分配一个不同的 IP 地址,服务器根据接收到请求的 IP 地址来确定请求的目标网站或应用。这种方式在 IPv4 地址资源有限的情况下可能不太实际,因为 IPv4 地址资源已经相对紧缺。
  2. 使用不同的端口号:每个网站或应用分配一个不同的端口号,服务器根据请求的端口号来确定请求的目标网站或应用。例如,一个网站可以使用默认的 HTTP 端口 80,另一个网站可以使用非默认的端口 8080。这种方式可以实现多个网站或应用共享同一个 IP 地址,但需要在客户端访问时指定非默认的端口号。
GET /path/to/resource HTTP/1.1
Host: www.example.com

2) 一个 IP 可以对应多个 host

PS: IP 和 Host 是可以多对多的。一个 IP 地址可以对应多个 Host,这就是所谓的虚拟主机(Virtual Host)的概念。虚拟主机允许在同一个 IP 地址下托管多个不同域名的网站或应用。当客户端发送 HTTP 请求时,请求头中的 Host 字段会指定客户端要访问的目标域名。服务器通过解析请求头中的 Host 字段来获取到客户端请求的目标域名,并根据域名来确定请求要被转发到哪个虚拟主机进行处理。虚拟主机服务器会根据请求中的域名来匹配对应的网站或应用,并返回相应的内容给客户端。

这种方式可以让多个网站或应用共享同一个 IP 地址,从而节省 IP 地址资源,并且使得托管多个域名的网站或应用在同一个服务器上变得更加灵活和方便。这也是在现代 web 服务器中普遍使用的方式。

二. 常见状态码

缓存

  1. 200 OK:请求成功。命中强缓存也是返回 200
  2. 304 Not Modified:表示客户端缓存的资源没有发生变化,可以继续使用缓存的资源。这是一个常见的状态码,表示客户端发送了条件请求(例如使用 If-Modified-Since 或 If-None-Match 头字段)并且缓存的资源没有发生变化,服务器返回 304 状态码,告诉客户端继续使用缓存的资源,无需返回实际的响应内容。命中弱缓存

重定向(关注 SEO 影响)

  1. 301 Moved Permanently:表示请求的资源已永久移动到新的 URL。这种状态码常用于网站重定向,当用户访问一个已经被永久移动的 URL 时,服务器会返回 301 状态码,并在响应中包含新的 URL,客户端会自动重定向到新的 URL。 SEO 影响:搜索引擎会将原始 URL 的权重和排名转移到新的 URL 上。搜索引擎会将旧的 URL 视为过时,并将新的 URL 视为有效的页面。,一般来说对 SEO 的影响会较小,因为搜索引擎会保留原始 URL 的权重和排名,并将其转移到新的 URL 上
  2. 302 Found:表示请求的资源临时移动到了新的 URL。这种状态码常用于网站重定向,与 301 状态码不同的是,302 状态码表示请求的资源只是临时移动到了新的 URL,客户端在接收到 302 响应后会继续使用原始 URL 进行访问。 SEO 影响:搜索引擎会认为新的 URL 只是临时的,不会将其视为有效的页面。因此,如果网站使用 302 重定向来临时重定向页面,对 SEO 的影响可能较大,因为搜索引擎不会将权重和排名转移到新的 URL 上,而是继续使用原始 URL 进行索引和排名。

访问权限

  1. 403 Forbidden:表示客户端没有权限访问请求的资源。这是一个常见的状态码,表示客户端没有足够的权限访问请求的资源,例如未授权的访问或权限不足等情况。
  2. 401 Unauthorized:表示客户端请求需要身份验证。这是一个常见的状态码,表示客户端访问请求的资源需要进行身份验证,例如需要提供有效的用户名和密码等。

错误

  1. 404 Not Found:表示请求的资源不存在。
  2. 500 Internal Server Error:表示服务器在处理请求时发生了内部错误。这

三. http1.0 和 http1.1 的区别

HTTP/1.1 和 HTTP/1.0 的区别有很多,其中一些主要的区别是:

  • 持久连接(keep-alive): HTTP/1.1 支持持久连接(keep-alive),即一个 TCP 连接可以发送多个请求和响应,而不需要每次重新建立连接
  • HTTP/1.1 支持管道化: 即在一个连接上可以同时发送多个请求,而不需要等待每个响应返回 (PS:但是响应必须按照请求的顺序返回,可能导致队头阻塞,即如果某个请求的耗时长,会影响后续的请求)
  • HTTP/1.1 支持分块传输编码,即可以将响应分成多个块发送,而不需要提前知道响应的长度 。
  • HTTP/1.1 支持更多的方法(如 PUT, DELETE, OPTIONS 等)和头部(如 Host, ETag, If-Modified-Since 等),以提供更丰富的功能和控制 。

四. http1.1 和 http2 的区别

  • 多路复用(Multiplexing):HTTP 2.0 支持多路复用,允许在同一连接上同时传输多个请求和响应,消除了 HTTP 1.x 中的队头阻塞问题,提高了性能。
  • 二进制协议(Binary Protocol):HTTP 2.0 使用二进制格式对数据进行传输和解析,相较于 HTTP 1.x 中的文本格式,更加高效和节省带宽。
  • 头部压缩(Header Compression):HTTP 2.0 支持头部压缩,减小了请求和响应中的头部大小,降低了网络传输的开销。
  • 服务器推送(Server Push):HTTP 2.0 支持服务器推送,服务器可以在客户端请求之前主动推送资源,提高了性能和用户体验。
  • 优先级和依赖(Priority and Dependency):HTTP 2.0 支持请求和响应之间的优先级和依赖关系,可以更好地管理请求的处理顺序,提高了并发性和性能。

实现原理:

  • HTTP 1.1:基于文本格式,使用明文传输,没有强制要求使用 SSL/TLS 加密,没有内建的流控和优先级机制。
  • HTTP 2.0:基于二进制格式,使用二进制帧传输,要求使用 SSL/TLS 加密,内建了流控和优先级机制,允许客户端和服务器端推送数据。

HTTP 2.0 的实现原理主要包括以下几个方面:

  • 二进制帧传输:HTTP 2.0 使用二进制格式的帧来传输数据,将请求和响应划分为多个帧,并在一个连接上同时传输多个帧,从而实现了多路复用。
  • 头部压缩:HTTP 2.0 使用 HPACK 算法对 Header 进行压缩,减小了头部信息的传输大小。
  • 流控:HTTP 2.0 内建了流控机制,通过控制帧的流量窗口大小来防止发送方发送过多的数据导致接收方溢出。
  • 优先级:HTTP 2.0 支持对请求和响应设置优先级,可以在一个连接上同时处理多个请求/响应,并根据优先级进行处理。
  • 服务器推送:HTTP 2.0 允许服务器在一个响应中主动推送其他资源给客户端,减少了客户端请求的次数,提高了性能。

这些特性使得 HTTP 2.0 在性能上相对于 HTTP 1.1 有较大的优势,提供了更高的并发性能、更低的延迟和更高的效率。通过二进制帧传输、头部压缩、流控、优先级和服务器推送等特性,HTTP 2.0 在网络传输效率和性能方面相较于 HTTP 1.1 有了显著的提升。

需要注意的是,虽然 HTTP 2.0 在性能和功能上相对于 HTTP 1.x 有很大的优势,但它并不完全替代了 HTTP 1.x,因为很多网站和服务仍然在使用 HTTP 1.x,并且在使用 HTTP 协议时,服务器和客户端需要根据实际需求和支持情况选择合适的版本。

zhuanlan.zhihu.com/p/348307320

五. 支持 HTTP/2.

支持 Http2.0,需要确保客户端和服务器端都支持 HTTP/2.0。

  1. 客户端支持 HTTP/2.0:
  • 使用支持 HTTP/2.0 的最新版本的浏览器,如 Chrome、Firefox、Safari 等。
  • 确保浏览器和操作系统的版本支持 HTTP/2.0。HTTP/2.0 在一些旧版本的浏览器和操作系统中可能不被支持。
  • 确保在客户端发起的请求中使用 HTTPS 协议,因为 HTTP/2.0 只支持在 HTTPS 连接上进行。
  1. 服务器端支持 HTTP/2.0:
  • 使用支持 HTTP/2.0 的 Web 服务器,如 Nginx、Apache 等,并确保其已经配置为启用了 HTTP/2.0。
  • 更新服务器的软件版本,以确保支持 HTTP/2.0 的最新协议标准。
  • 配置服务器的 SSL/TLS 证书,启用 HTTPS 连接,因为 HTTP/2.0 只支持在 HTTPS 连接上进行。
  • 检查服务器的网络配置,确保没有任何代理、负载均衡或其他中间设备会对 HTTP/2.0 连接进行干扰或阻止。

需要注意的是,不同的 Web 服务器可能有不同的配置方式和参数,具体的步骤和方法可能会有所不同。在实际应用中,建议参考所使用的 Web 服务器的文档和配置指南,以确保正确地配置和启用了 HTTP/2.0 支持。

- Book Lists -