浏览器缓存是否可以单独使用HTTP标头控制而不使用资产文件的哈希名称？

Question

我正在Webpack docs中阅读：

  

它的工作方式有一个缺陷：如果我们在部署新版本时不更改资源的文件名，浏览器可能会认为它尚未更新，客户端将获得它的缓存版本。

我很好奇，为了告知浏览器资产文件已经更改，是否必须将此机制用于资产的丑陋文件名main.55e783391098c2496a8f.js？

只能通过HTTP标头控制吗？标准中有多个HTTP标头用于控制浏览器缓存资产的方式，例如：

Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0
Date: Wed, 24 Aug 2020 18:32:02 GMT
Last-Modified: Tue, 15 Nov 2024 12:45:26 GMT
ETag: x234dff
max-age: 12345

那么我可以单独使用这些标题吗？或者我仍然需要打扰文件名main.55e783391098c2496a8f.js中的哈希部分？

Answer 1

当用户代理打开页面时，它必须始终获得正确的源代码版本。您有两种方法可以实现此目的：

• 设置Cache-Control，Expires和强验证器（ETag）响应标头。这样，您可以指示用户代理在每个页面加载时执行相对轻量级的条件请求
• 在源代码文件网址中嵌入版本，并设置Cache-Control和Expires响应标头。这样，您可以指示用户代理永久地使用特定版本缓存源代码

有关详细信息，请查看Ilya Grigorik的HTTP Caching article，HTTP conditional requests MDN page以及此StackOverflow answer有关资源重新验证的信息。