如何防止缓存我的 Javascript 文件？ [复制]答案

【问题标题】：How to prevent caching of my Javascript file? [duplicate]如何防止缓存我的 Javascript 文件？ [复制]
【发布时间】：2011-11-16 19:31:41
【问题描述】：

我有一个简单的 html：

<html>
<body>
<head>
<meta charset="utf-8">
<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>
<script src="test.js"></script>
</body>
</html>

在 test.js 中，我更改了一个 Javascript 函数，但我的浏览器正在缓存这个文件。如何禁用脚本 src 的缓存？

【问题讨论】：

我向脚本源添加了时间戳，但仍有几个用户需要触发 F5 或 Ctrl+F5 才能获取新脚本。怎么样？（内联网不是万维网）

标签： javascript caching

【解决方案1】：

向src添加随机查询字符串

您可以通过在每次进行更改时增加查询字符串来手动执行此操作：

<script src="test.js?version=1"></script>

或者，如果您使用的是服务器端语言，您可以自动生成：

ASP.NET：

<script src="test.js?rndstr=<%= getRandomStr() %>"></script>

更多关于缓存清除的信息可以在这里找到：

https://curtistimson.co.uk/post/front-end-dev/what-is-cache-busting/

【讨论】：

另一种解决方案是使用某种内部版本号（例如自开始以来的提交数，或修订号/提交哈希）。这样，您将利用服务器端语言自动执行此操作，但在没有真正改变时不会失去缓存的优势。但这需要如前所述：版本控制（或其他一些更改跟踪）和服务器端处理。
@Tadeck 更好的是，使用内容的散列值，以便在需要时更新。可能会生成一个新版本，但 JS 可能不会改变。 ASP.NET Bundling and Minification 内置了这个。curtistimson.co.uk/front-end-dev/what-is-cache-busting/#_hashed
你们都错了！
@SébastienGarcia-Roméo 这是一个有效的选项。这是我在链接帖子curtistimson.co.uk/post/front-end-dev/what-is-cache-busting 中提出的选项之一
这个解决方案的一个令人讨厌的方面是 Chrome 会将其视为一个新文件。例如，如果您设置了断点，您将在下次重新加载时丢失所有断点。

【解决方案2】：

<script src="test.js?random=<?php echo uniqid(); ?>"></script>

编辑：或者您可以使用文件修改时间，以便将其缓存在客户端上。

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

【讨论】：

你最好把 "LastWriteTimeUTC" unix-timestamp 放在那里，这样只要脚本没有改变它就会保持缓存。
简单但很好的解决方案，谢谢。
uniqid() 每次都会生成新的文件名。我认为，更好的方法是filemtime 函数。这只会在文件被修改时更改文件版本，这就是我们在代码中进行更改并要求客户端清除缓存时的问题。

【解决方案3】：

Configure your webserver 为脚本发送缓存控制 HTTP 标头。

HTML 文档中的虚假标题：

不像真正的 HTTP 标头那样受支持
应用于 HTML 文档，而不是它链接到的资源

【讨论】：

【解决方案4】：

您可以将 queryString 附加到您的 src 并仅在您发布更新版本时更改它：

<script src="test.js?v=1"></script>

这样浏览器将使用缓存的版本，直到指定新版本（v=2，v=3...）

【讨论】：

【解决方案5】：

您可以将随机（或日期时间字符串）作为查询字符串添加到指向您的脚本的 url。像这样：

<script type="text/javascript" src="test.js?q=123"></script>

每次刷新页面时，都需要确保 'q' 的值发生变化。

【讨论】：