HTTP 缓存是指在客户端或服务器端存储经常使用的 HTTP 资源的技术。当浏览器请求某个资源时，它会首先检查是否已经缓存了该资源的副本，如果有，则可以避免重新下载该资源，而是直接从缓存中获取资源，从而提高页面加载速度并减少带宽消耗。
HTTP 缓存有两种方式：强制缓存和协商缓存。
强制缓存是指浏览器在缓存期间不会向服务器发送请求，而是直接从本地缓存中获取资源。可以通过设置 Cache-Control 和 Expires 响应头来控制缓存的行为。例如，可以将 Cache-Control 设置为 max-age=3600，表示该资源可以缓存一小时，当过了一小时后，浏览器会向服务器发送请求，检查该资源是否有更新。
协商缓存是指浏览器在缓存期间会向服务器发送请求，询问该资源是否有更新，如果没有更新，则可以继续使用缓存中的资源。可以通过设置 ETag 和 Last-Modified 响应头来实现协商缓存。例如，当浏览器向服务器发送请求时，服务器会检查请求头中的 If-None-Match 和 If-Modified-Since 字段，如果它们与服务器端的 ETag 和 Last-Modified 值匹配，则服务器返回 304 响应，告诉浏览器可以继续使用缓存中的资源。
通过使用 HTTP 缓存，可以显著提高 Web 应用程序的性能，因为它可以减少页面加载时间和带宽消耗。同时，它也可以减轻服务器端的负担，因为它可以避免多次处理相同的请求。然而，缓存也可能会导致问题，例如缓存了过期的资源、缓存了错误的资源等，因此需要仔细地配置缓存策略，并在必要时进行清除缓存。
以下是一个强制缓存的例子1，设置 Cache-Control 响应头为 max-age=3600，表示该资源可以缓存一小时：
HTTP/1.1 200 OK
Content-Type: text/css
Cache-Control: max-age=3600
以下是一个协商缓存的例子2，设置 ETag 和 Last-Modified 响应头，当浏览器再次请求该资源时，会带上 If-None-Match 和 If-Modified-Since 请求头，服务器会通过比较这些值来判断资源是否有更新：
HTTP/1.1 200 OK
Content-Type: text/css
ETag: "abcde12345"
Last-Modified: Fri, 16 Apr 2021 12:34:56 GMT
// 浏览器再次请求该资源时，会带上以下请求头：
If-None-Match: "abcde12345"
If-Modified-Since: Fri, 16 Apr 2021 12:34:56 GMT
服务器是如何比较该资源是否更新的？
在例子2中，服务器可以通过比较客户端请求头中的 If-None-Match 和 If-Modified-Since 字段与服务器响应头中的 ETag 和 Last-Modified 字段来判断资源是否有更新。
当客户端发送请求时，如果缓存中存在该资源的副本，则会在请求头中包含 If-None-Match 和 If-Modified-Since 字段，分别对应上一次请求时服务器返回的 ETag 和 Last-Modified 值。例如，以下是客户端发送请求时的请求头：
GET /styles.css HTTP/1.1
Host: example.com
If-None-Match: "abcde12345"
If-Modified-Since: Fri, 16 Apr 2021 12:34:56 GMT
服务器收到请求后，会检查该资源的 ETag 和 Last-Modified 值是否与客户端请求头中的值相同。如果相同，则说明该资源没有更新，可以返回 304 Not Modified 响应，告诉客户端继续使用缓存中的资源。如果不同，则说明该资源已经更新，服务器会返回最新的资源内容，同时更新 ETag 和 Last-Modified 值。
当服务器返回 304 Not Modified 响应时，响应头中不包含响应体，只有状态码和一些元数据。例如，以下是服务器返回 304 响应时的响应头：
HTTP/1.1 304 Not Modified
Cache-Control: max-age=3600
ETag: "abcde12345"
Last-Modified: Fri, 16 Apr 2021 12:34:56 GMT
拓展
HTTP 请求头是在客户端向服务器发送 HTTP 请求时，用于描述请求信息的部分。下面列举了常见的 HTTP 请求头字段及其含义：
Accept：表示客户端能够接受的响应内容类型。Accept-Encoding：表示客户端支持的内容编码方式，例如 gzip、deflate 等。Accept-Language：表示客户端接受的语言类型和优先级，例如 en-US、zh-CN 等。Cache-Control：表示客户端希望服务器对响应进行缓存的控制方式。Connection：表示客户端与服务器的连接类型，例如 keep-alive。Content-Type：表示请求体中的数据类型。Cookie：表示客户端发送的 Cookie 信息。Host：表示请求的目标服务器地址和端口号。Referer：表示当前请求的来源页面地址。User-Agent：表示客户端的信息，例如浏览器类型和版本。
除了上面列出的常见的 HTTP 请求头字段之外，还有一些其他的字段，它们可能会根据特定的应用场景进行使用。在实际开发中，开发人员需要根据具体需求选择合适的请求头字段来完成特定的功能。
HTTP响应头字段及其含义：
Access-Control-Allow-Origin：表示允许跨域请求的源地址。Cache-Control：表示对响应进行缓存的控制方式。Content-Encoding：表示响应数据所采用的编码方式，例如 gzip、deflate 等。Content-Type：表示响应体中的数据类型。Cookie：表示服务器发送的 Cookie 信息。Expires：表示响应的过期时间。Last-Modified：表示资源最后修改时间。Location：表示重定向地址。Server：表示服务器类型和版本。Set-Cookie：表示服务器设置的 Cookie 信息。
除了上面列出的常见的 HTTP 响应头字段之外，还有一些其他的字段，它们可能会根据特定的应用场景进行使用。在实际开发中，开发人员需要根据具体需求选择合适的响应头字段来完成特定的功能。
