【5分钟前端】说人话的HTTP缓存机制

21 阅读4分钟

1. 协商缓存

协商缓存是一种缓存机制,它允许客户端和服务器之间协商资源是否需要重新获取。当客户端再次请求一个已经缓存的资源时,会向服务器发送一个带有特定验证信息的请求,询问服务器该资源是否有更新。如果服务器返回304 Not Modified状态码,则表示该资源没有更新,客户端可以继续使用本地缓存的版本;否则,服务器会返回最新版本的资源。

协商缓存过程中涉及两组HTTP头字段:Last-Modified/If-Modified-Since和ETag/If-None-Match。

  • Last-Modified/If-Modified-Since:当客户端第一次请求一个资源时,服务器会在响应头中添加Last-Modified字段,表示该资源最后修改时间。当客户端再次请求该资源时,会在请求头中添加If-Modified-Since字段,并将上次响应中的Last-Modified值作为该字段的值。服务器收到请求后,会比对If-Modified-Since和资源的最后修改时间,如果两者相同,则返回304状态码;否则返回最新版本的资源。
  • ETag/If-None-Match:与Last-Modified/If-Modified-Since类似,ETag/If-None-Match也是用于协商缓存。区别在于ETag是由服务器为每个资源生成的唯一标识符(通常是基于文件内容生成的哈希值),而不是基于时间来判断资源是否有更新。

这两组HTTP头字段可以同时使用,在实际应用中通常也是这样做。当两者都满足条件时(即If-Modified-Since等于最后修改时间且If-None-Match等于ETag),才会返回304状态码。

2. 强制缓存

强制缓存也是一种缓存机制,它允许客户端在一段时间内直接使用本地缓存的资源,而不需要再次向服务器发送请求。当客户端第一次请求一个资源时,服务器会在响应头中添加Cache-Control和Expires字段,用于指定该资源的缓存策略。

  • Cache-Control:用于指定资源的缓存策略。常见的取值包括max-age(表示资源可以被缓存多长时间)、no-cache(表示不使用强制缓存,每次都需要向服务器验证)和no-store(表示不使用任何形式的缓存)等。
  • Expires:用于指定资源过期时间。当客户端再次请求该资源时,会比对当前时间和Expires值,如果当前时间小于Expires值,则直接使用本地缓存;否则向服务器发送请求获取最新版本。

强制缓存可以有效减少客户端与服务器之间的通信量,提高网页加载速度。但是它也有一些局限性,例如无法保证客户端始终获取到最新版本的资源。因此,在实际应用中通常会结合协商缓存来使用。

总结

强制缓存和协商缓存都是用于提高网页加载速度和减少服务器压力的缓存机制。它们可以同时使用,也可以根据具体情况选择使用其中一种。

强制缓存适用于那些不经常变化的资源,例如图片、CSS文件和JavaScript文件等。当客户端第一次请求这些资源时,服务器会在响应头中添加Cache-Control和Expires字段,指定该资源的缓存策略。之后,在一段时间内(由max-age或Expires值指定),客户端再次请求该资源时会直接使用本地缓存,而不需要再次向服务器发送请求。

协商缓存适用于那些可能会发生变化的资源。当客户端再次请求一个已经缓存的资源时,会向服务器发送一个带有特定验证信息(如If-Modified-Since或If-None-Match字段)的请求,询问服务器该资源是否有更新。如果服务器返回304 Not Modified状态码,则表示该资源没有更新,客户端可以继续使用本地缓存的版本;否则,服务器会返回最新版本的资源。

总之,在实际应用中可以根据具体情况选择使用强制缓存、协商缓存或两者结合来提高网页加载速度。