了解 NGINX 默认缓存

Question

我有一个不同位置的 NGINX 配置。他们都是return个人index.html。 index.htmls 是在每次部署时构建的。它们包括 JavaScript 文件的 script 标签，这些文件在文件名中带有内容哈希，以破坏缓存。

我的问题是，在部署之后，一些必需的脚本正在 404ing 因为下载的 index.html 在 JS 文件名中有旧的内容散列。好像是方式的问题，送的index.html，因为客户端下载的是老版本的index.html

这是我的 NGINX 配置中的示例位置：

location /my-route {
  try_files $uri /my-route/index.html;
}

当我检查响应 header 时，我看到所有 index.html 文件的 ETag。这还不足以确保所有 index.html 个文件的正确缓存行为吗？

我的下一个方法是添加一个 Cache-Control header。但我不知道它是否能解决我的问题，因为我无法确切解释为什么它是正确的解决方案（但我想了解它）。

location /my-route {
  add_header Cache-Control "must-revalidate";
  try_files $uri /my-route/index.html;
}

Answer 1

为了使 cache-busting 策略适用于链接资产（JavaScript 文件等），按照您描述的方式，您需要确保浏览器始终具有 index.html.

这是实现您需要的一种保守方法。为 HTML 文件设置一个 location 块，为文件名中包含内容哈希的其他资产设置一个单独的位置块。对于 HTML 个文件，您需要：

add_header Cache-Control "no-store";

对于文件名中包含内容哈希的资产，请使用：

add_header Cache-Control "max-age: 31536000";

要回答关于在 index.html 文件上发送 ETag 是否足够的问题，答案是否定的。如果没有 Cache-Control header ，浏览器会使用自己的算法来决定是从自己的缓存中检索还是使用 If-None-Match 请求 header 来验证他们已经存在的副本有。

注意：我不熟悉 try_files，但您需要确保如果 try_files 在内部重定向到不同的位置块，则该最终位置块添加正确的 headers.

Understanding NGINX default caching