index.html (Apache) 的正确缓存清除

来自 Competa IT 档案； Bastiaan Dressen 于 2018 年 2 月 22 日首次发表。

部署 JavaScript 应用程序的一种方法是使用一些构建工具（如 Webpack）构建简化版本，并将构建作为静态资源放置在 Web 服务器上。

该构建通常有一个 index.html，它是主要入口点，包含对 JavaScript 和 CSS 文件的引用。

这些引用的文件通常在其文件名中包含哈希。造成这种情况的原因不同，但主要是为了区分不同的构建。

那么问题是什么？

浏览器似乎积极缓存 index.html，因此在手动清除浏览器缓存之前不会注意到服务器上的新版本。

在某些情况下，用户无法执行此手动清除。

示例： index.html 指向几个在其各自文件名中包含哈希的文件，例如。应用-cf7653dd.js

服务器上的新文件（部署后）不会被注意到，因为 index.html 的缓存版本仍然指向 app-faa65436.js（包含旧哈希的 app.js 文件）

好的，那么解决方案是什么？

将 apache 配置为不缓存 index.html。所有其他文件都可能被缓存。

因为新版本的 JS 和 CSS 文件包含一个唯一的哈希值，它可能会随着新的构建而改变，所以这些文件名的改变可以实现开箱即用的缓存破坏。

下面的说明是需要添加到 Apache 配置中的内容。

 <Directory "PATH_TO_DIRECTORY_OF_INDEX.HTML"> <Files "index.html"> FileETag 无 标题看不见的 ETag 标头集 Cache-Control "max-age=0, no-cache, no-store, must-revalidate" 标头集 Pragma "no-cache" 标头集过期“星期三，1984 年 1 月 11 日 05:00:00 GMT” </Files> </Directory>