https://alexzitowolf.medium.com/the-5-most-important-http-headers-d9e9f94bb1f6

作为 Web 开发人员，要与远程 API 进行流畅通信，你需要识别这些最常见的 headers。

对于大多数 Web 开发人员而言，你工作的很大一部分将是构建与位于远程服务器上的 API 进行交互和响应的页面。你对 HTTP 协议了解得越多，就越能更好地利用这些 API 接口。

HTTP headers是键值对，让客户端（你的 Web 应用程序）将附加信息传递回服务器，并接受来自服务器的相同类型的日期。这个信息可以被认为是关于请求的“元”信息——它通常不属于负载本身（请求或响应的主体），但添加了关于请求的信息，比如它的来源或客户端请求的授权。

image.png

Chrome 开发工具中的 HTTP headers示例

出于这个原因，你应该熟悉许多基本的 HTTP headers - 随着你深入了解 Web 开发，这些对于理解绝对重要，问题是你何时会学习它们，而不是是否会学习。有一些headers更常被视为来自服务器的响应，称为服务器端headers，还有一些更常由客户端发送。我会尽量弄清楚每个标题是哪种类型。

首先，我们将查看你最常与之交互的 5 个headers：

  1. Authorization：此客户端headers传达用户的授权状态。这是一个带有用户授权状态的令牌。它与身份验证不同，身份验证与用户身份的实际验证有关。授权头通常用于发送服务器可以处理的令牌，以确定是否允许用户访问给定资源。
  2. Content-Type：这个客户端和服务器端headers告诉请求的接收者你的请求正文包含什么。例如，数据类型是 JSON、文本等……它非常常见，但经常被忽略，因为在大多数情况下，你已经知道期望接收的数据类型。
  3. Accept：此客户端headers确定你希望从服务器返回的数据类型，因此你的应用程序应该能够理解。将此信息提供给服务器会很有用，这样它就不会浪费时间处理来自无法接收给定数据类型的客户端的请求。
  4. Cookie：此客户端headers包含存储在用户浏览器cookie中的其他元数据。这些通常（但不仅限于）最初由服务器使用Set-Cookieheaders设置，可用于传达有关用户的任何类型的元数据，包括浏览历史记录或登录状态。
  5. Access-Control-Allow-Origin：这是一个服务器端headers，但由于它对你作为 Web 开发人员的工作非常重要，因此列在该列表中。根据称为 COR 的协议，它包含有关服务器接受的 Web 地址的信息。本质上，它是在它期望与之交互的客户端白名单中构建的服务器。如果你在客户端代码中看到引用“Cross-origin-request”的错误，则可能与此headers有关。有关 CORS 的更多信息，我推荐这篇文章。

有一些标题没有进入前 5 名，但理解起来还是很有用的。仔细看看这里。

  1. Content-length: 描述数据有效负载大小的服务器端headers（以字节为单位）
  2. Cache-control: 服务器 + 客户端headers，用于传达接收者应该如何缓存内容。
  3. Expire：响应被视为陈旧的日期/时间。
  4. Content-language: 描述面向观众的人类语言，以便用户根据自己的首选语言进行区分。

作为开发人员，你在生活中还会经常看到许多自定义headers。以下是我经常看到的一些列表：

  1. X-Total-Count:这是分页的_服务器端_headers，它为你提供查询返回的资源总数。通过这种方式，你可以反映有多少结果页面可供用户浏览。
  2. X-Server：这是一个服务器端headers，用于告诉客户端哪个服务器正在响应请求，通常在发生负载平衡的情况下，因此请求可能来自多个服务器之一。
  3. X-Powered-By：这个服务器端头传达了服务器的技术。如果安全是主要问题，通常不建议使用，但仍然常用。

资料来源：

  1. HTTP headers MDN
  2. Json 服务器：NPM