Question

我有一个位于不同位置的NGINX配置。它们都返回一个单独的index.html。 index.html与每个部署一起生成。它们包含用于文件的JavaScript文件的script标签，文件名中包含内容哈希，以清除缓存。

我的问题是，在部署之后，某些必需的脚本正在404中，因为下载的index.html在JS文件名中具有旧的内容哈希。 index.html的交付方式似乎有问题，因为它是客户端下载的index.html的旧版本。

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

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

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

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

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

Answer 1

要使高速缓存清除策略适用于链接资产（JavaScript文件等），请按照您描述的方式，确保浏览器始终具有index.html的全新副本。

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

add_header Cache-Control "no-store";

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

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

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

注意：我对try_files并不熟悉，但是您需要确保，如果try_files在内部重定向到另一个位置块，则该最终位置块会添加正确的标头。