我在 HTML 中放了什么来确保用户获得我的页面的最新版本，而不是旧版本？

Question

我有一个从 CDN 提供的大部分静态 HTML 网站（加上一些 AJAX 到服务器），并且确实希望用户的浏览器缓存所有内容，直到我更新任何文件然后我希望用户的浏览器获得新版本。

对于我网站上的所有类型的静态文件（HTML、JS、CSS、图像等），我该如何实现？（HTML 或其他地方的设置）。显然我可以告诉 CDN 让它的缓存过期，所以它是我正在考虑的客户端。

谢谢。

Answer 1

实现此目的的一种方法是使用 HTTPLast-Modified或ETag标头。在所提供文件的 HTTP 标头中，服务器将发送上次修改页面的日期（在Last-Modified标头中），或代表页面当前状态的随机 ID ( ETag)，或两者：

HTTP/1.1 200 OK
Content-Type: text/html
Last-Modified: Fri, 18 Dec 2015 08:24:52 GMT
ETag: "208f11-52727df9c7751"
Cache-Control: must-revalidate

如果标题Cache-Control设置为must-revalidate，它会导致浏览器缓存页面以及它收到的Last-Modified和ETag标题。在下一个请求中，它会将它们作为If-Modified-Sinceand发送If-None-Match：

GET / HTTP/1.1
Host: example.com
If-None-Match: "208f11-52727df9c7751"
If-Modified-Since: Fri, 18 Dec 2015 08:24:52 GMT

如果当前ETag页面与来自浏览器的页面匹配，或者如果页面自浏览器发送之日起没有被修改，则服务器将发送Not Modified一个空正文的标头而不是发送该页面：

HTTP/1.1 304 Not Modified

请注意，仅需要两种机制 (ETag或Last-Modified) 中的一种，它们都可以独立工作。

这样做的缺点是无论如何都必须发送请求，因此性能优势主要适用于包含大量数据的页面，但特别是在具有高延迟的互联网连接上，页面仍然需要很长时间才能加载。（不过它肯定会减少您的流量。）

Apache 会自动为静态文件生成一个ETag（使用文件的 inode 号、修改时间和大小）和一个Last-Modified标头（基于文件的修改时间）。我不知道其他网络服务器，但我认为它会类似。对于动态页面，您可以自己设置标题（例如通过将内容的 MD5 总和发送为ETag）。

默认情况下，Apache 不发送Cache-Control标头（默认为Cache-Control: private）。此示例.htaccess文件使 Apache 发送所有.html文件的标头：

<FilesMatch "\.html$">
    Header set Cache-Control "must-revalidate"
</FilesMatch>

另一种机制是通过发送使浏览器缓存页面Cache-Control: public，但动态改变 URL，例如通过附加文件的修改时间作为查询字符串 ( ?12345)。只有当您的页面/文件仅从您的 Web 应用程序中链接时，这才是真正可能的，在这种情况下，您可以动态生成指向它的链接。例如，在 PHP 中，您可以执行以下操作：

<script src="script.js?<?php echo filemtime("script.js"); ?>"></script>