如何防止我的 Javascript 文件缓存？

我有一个简单的 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 的缓存？

296118 次浏览
小开
最佳答案

将随机查询字符串添加到 src

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

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

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

ASP.NET:

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

更多关于缓存破坏的信息可以在这里找到:

Https://www.curtiscode.dev/post/front-end-dev/what-is-cache-busting

小开

您可以将 queryString 附加到 src，并且只有在发布更新版本时才更改它:

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

通过这种方式，浏览器将使用缓存版本，直到指定新版本(v = 2，v = 3...)

小开

可以将随机(或日期时间字符串)作为查询字符串添加到指向脚本的 URL。像这样:

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

每次刷新页面时，都需要确保‘ q’的值被更改。

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

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

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

配置您的 webserver 以发送脚本的缓存控制 HTTP 头。

HTML 文档中的虚假标题:

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

提交答案