hash - 使用webpack chunkhash和缓存控制进行长期缓存

我正在使用webpack捆绑所有文件。在webpack中，我使用chunkhash，Md5Hash和清单来为我的每个文件生成唯一的chunkhash，这些文件可以通过浏览器下载。看起来像这样。

styles.3840duiel348fdjh385idfki.css
bundle.488503289dfksdlkor93lfui.js
vendor.sdkkfuuewkf892377rfkjdle.js
image.dkkdiiue9984ujjkfld003kfpp.png

这意味着浏览器可以缓存它们，并且如果不更改哈希值，它将使用缓存的版本。与此同时，例如，我可以只更改样式，仅更改哈希值，因此在部署应用程序时，浏览器将仅下载新样式。

问题是在我的服务器上，我使用以下命令：

Cache-Control: public max-age=31536000

这表示积极的缓存，除非URL，文件名更改，否则浏览器将使用缓存的版本一年。例如，当我更改样式时，我的哈希值已更改，浏览器应从服务器请求新样式。那是根据这篇文章（模式1）以及我发现的其他一些信息https://jakearchibald.com/2016/caching-best-practices/

我的问题是，当我更新某些内容（例如示例样式）时，样式的哈希值发生了更改，然后进行了部署。当我在页面上点击重新加载时，浏览器将不会请求新样式。它将服务器缓存的文件。我怎样才能解决这个问题？

我可以使用，Cache-Control: no-cache但这不是解决方案，因为浏览器每次必须检查服务器是否可以使用缓存版本。那就是每次有人访问该页面时都不需要的4个http请求。

查看更多