我注意到一些浏览器（特别是 Firefox 和Opera）非常热衷于使用.css和.js文件的缓存副本，即使在浏览器会话之间也是如此。当您更新这些文件之一时，这会导致问题，但用户的浏览器继续使用缓存副本。
在文件更改时强制用户浏览器重新加载文件的最优雅的方法是什么？
理想情况下，该解决方案不会强制浏览器在每次访问页面时重新加载文件。
我发现John Millikin和da5id 的建议很有用。事实证明，有一个术语：自动版本控制。
我在下面发布了一个新答案，它结合了我的原始解决方案和约翰的建议。
SCdF建议的另一个想法是将虚假查询字符串附加到文件中。（一些 Python 代码，自动使用时间戳作为伪造的查询字符串，是由pi提交的。。）
但是，关于浏览器是否会缓存带有查询字符串的文件存在一些讨论。（请记住，我们希望浏览器缓存文件并在以后的访问中使用它。我们只希望它在文件发生更改时再次获取文件。）
这个解决方案是用 PHP 编写的，但它应该很容易适应其他语言。
原始.htaccess正则表达式可能会导致json-1.3.js. 解决方案是仅在末尾正好有 10 位数字时才重写。（因为 10 位数字涵盖了从 9/9/2001 到 11/20/2286 的所有时间戳。）
首先，我们在 .htaccess 中使用以下重写规则：
RewriteEngine on
RewriteRule ^(.*)\.[\d]{10}\.(css|js)$ $1.$2 [L]
现在，我们编写以下 PHP 函数：
/**
* Given a file, i.e. /css/base.css, replaces it with a string containing the
* file's mtime, i.e. /css/base.1221534296.css.
*
* @param $file The file to be loaded. Must be an absolute path (i.e.
* starting with slash).
*/
function auto_version($file)
{
if(strpos($file, '/') !== 0 || !file_exists($_SERVER['DOCUMENT_ROOT'] . $file))
return $file;
$mtime = filemtime($_SERVER['DOCUMENT_ROOT'] . $file);
return preg_replace('{\\.([^./]+)$}', ".$mtime.\$1", $file);
}
现在，无论您在何处包含 CSS，都将其更改为：
<link rel="stylesheet" href="/css/base.css" type="text/css" />
对此：
<link rel="stylesheet" href="<?php echo auto_version('/css/base.css'); ?>" type="text/css" />
这样，您就不必再次修改链接标签，用户将始终看到最新的 CSS。浏览器将能够缓存 CSS 文件，但是当您对 CSS 进行任何更改时，浏览器会将其视为新 URL，因此它不会使用缓存的副本。
这也适用于图像、网站图标和 JavaScript。基本上任何不是动态生成的。
一般来说，缓存是好的……所以有几种技术，这取决于您是在开发网站时自己解决问题，还是在生产环境中尝试控制缓存。
您网站的一般访问者将不会获得与您在开发网站时相同的体验。由于普通访问者访问该站点的频率较低（每个月可能只有几次，除非您是 Google 或 hi5 Networks），因此他们不太可能将您的文件缓存，这可能就足够了。
如果你想强制一个新版本进入浏览器，你总是可以在请求中添加一个查询字符串，并在进行重大更改时增加版本号：
<script src="/myJavascript.js?version=4"></script>
这将确保每个人都能获得新文件。它起作用是因为浏览器查看文件的 URL 以确定它是否在缓存中具有副本。如果您的服务器未设置为对查询字符串执行任何操作，它将被忽略，但该名称对于浏览器来说看起来就像一个新文件。
另一方面，如果您正在开发网站，您不希望每次保存对开发版本的更改时都更改版本号。那会很乏味。
因此，在您开发网站时，一个很好的技巧是自动生成查询字符串参数：
<!-- Development version: -->
<script>document.write('<script src="/myJavascript.js?dev=' + Math.floor(Math.random() * 100) + '"\><\/script>');</script>
向请求添加查询字符串是对资源进行版本控制的好方法，但对于简单的网站，这可能是不必要的。请记住，缓存是一件好事。
还值得注意的是，浏览器不一定会吝啬将文件保存在缓存中。浏览器有针对此类事情的策略，它们通常按照 HTTP 规范中规定的规则进行操作。当浏览器向服务器发出请求时，响应的一部分是一个Expires标头……一个告诉浏览器它应该在缓存中保留多长时间的日期。下次浏览器遇到对同一个文件的请求时，它会看到缓存中有一个副本，并查看到期日期来决定是否应该使用它。
不管你信不信，实际上是你的服务器使浏览器缓存如此持久。您可以调整您的服务器设置并更改Expires标头，但我上面写的小技巧可能对您来说是一种更简单的方法。由于缓存是好的，您通常希望将该日期设置为遥远的未来（“Far-future Expires Header”），并使用上述技术强制更改。
如果您对有关 HTTP 或如何发出这些请求的更多信息感兴趣，那么 Steve Souders 所著的“高性能网站”就是一本好书。这是对这个主题的一个很好的介绍。
用于Apache 的Google 的mod_pagespeed插件将为您进行自动版本控制。真的很滑
它在离开网络服务器的路上解析 HTML（适用于 PHP、Ruby on Rails、Python、静态 HTML——任何东西）并重写 CSS、JavaScript、图像文件的链接，以便它们包含一个 id 代码。它在修改后的 URL 处提供文件，并对它们进行很长的缓存控制。当文件更改时，它会自动更改 URL，因此浏览器必须重新获取它们。它基本上可以正常工作，无需对您的代码进行任何更改。它甚至会在出路时缩小您的代码。
我建议您使用实际 CSS 文件的 MD5 哈希值，而不是手动更改版本。
所以你的网址会是这样的
http://mysite.com/css/[md5_hash_here]/style.css
您仍然可以使用重写规则去除散列，但优点是现在您可以将缓存策略设置为“永久缓存”，因为如果 URL 相同，则意味着文件未更改。
然后，您可以编写一个简单的 shell 脚本来计算文件的哈希值并更新您的标签（您可能希望将其移动到一个单独的文件中以包含在内）。
每次 CSS 更改时只需运行该脚本即可。浏览器只会在您的文件被更改时重新加载它们。如果您进行了编辑然后撤消它，那么确定您需要返回哪个版本以便您的访问者不会重新下载是很容易的。
我不知道为什么你们/女孩们为了实施这个解决方案而付出这么多的痛苦。
如果获取文件的修改时间戳并将其作为查询字符串附加到文件中，您需要做的就是。
在 PHP 中，我会这样做：
<link href="mycss.css?v=<?= filemtime('mycss.css') ?>" rel="stylesheet">
filemtime()是一个 PHP 函数，它返回文件修改的时间戳。