清除 JavaScript 中的缓存

IT技术 javascript caching
2021-01-31 20:58:30

如何使用 JavaScript 清除浏览器缓存?

我们部署了最新的 JavaScript 代码,但无法获取最新的 JavaScript 代码。

编者按:本题在以下地方半重复,以下第一题的答案可能是最好的。这个公认的答案不再是理想的解决方案。

如何强制浏览器重新加载缓存的 CSS/JS 文件?

如何强制客户端刷新 JavaScript 文件?

动态重新加载本地 Javascript 源 / json 数据

6个回答

您可以调用window.location.reload(true)重新加载当前页面。它将忽略任何缓存的项目并从服务器检索页面、CSS、图像、JavaScript 等的新副本。这不会清除整个缓存,但具有清除您所在页面的缓存的效果。

但是,您最好的策略是按照其他各种答案中提到的方式对路径或文件名进行版本控制。此外,请参阅Revving Filenames: don't use querystring因为不用?v=n作版本控制方案的原因。

我怎么没想到,坦克你
2021-03-16 20:58:30
但是通过更改文件名来加速...这不会让您保留所有以前的版本吗?否则你会从搜索引擎那里得到很多失败的尝试以及不阅读旧版本(或书签/链接图像)的内容
2021-03-18 20:58:30
哇谢谢!这也适用于从 cache.manifest 文件加载的 HTML5 应用程序缓存。我有一个没有从内存中删除的旧清单,所以一个缓存了它的浏览器不会显示更新的文件。我在 javascript 控制台中输入了这个,并且工作正常。谢谢!
2021-03-21 20:58:30
不幸的是,不推荐使用 Reload(true)
2021-03-21 20:58:30
@Manuel 它只会禁止从您调用 location.reload(true) 的确切 url 的缓存中访问页面。它永远不会从缓存中清除原始页面,因为它只是将时间戳附加到新请求,并且如果此页面有其他异步调用,这些请求将不会禁用其缓存行为。例如。如果您使用加载一些 html 的 reload(true) 刷新页面,并且该页面有一个脚本可以进行第二次 ajax 调用以在同一页面上显示更多 html,则第二个请求将不会禁用其缓存。
2021-03-24 20:58:30

您无法使用 javascript 清除缓存。一种常见的方法是将修订号或上次更新的时间戳附加到文件中,如下所示:

myscript.123.js

或者

myscript.js?updated=1234567890

缓存了整个 HTML 后,如何清除缓存?由于缓存的HTML,即使添加版本号也不会影响。请帮助
2021-03-13 20:58:30
如果我不能清除缓存项,那么为什么MDN 说我可以?我错过了什么?我尝试了 MDN 所说的但没有运气。
2021-04-04 20:58:30
但是请注意,当文件具有查询字符串时,许多代理不会缓存文件。凯文哈坎森的回答
2021-04-05 20:58:30

尝试更改 JavaScript 文件的 src?由此:

<script language="JavaScript" src="js/myscript.js"></script>

对此:

<script language="JavaScript" src="js/myscript.js?n=1"></script>

此方法应强制您的浏览器加载 JS 文件的新副本。

那么文件名也需要更改吗?或者只是需要更改的 src 路径?
2021-03-19 20:58:30
除了与众不同之外,它什么都不做。它可能是 ?12345 或 ?Kyle
2021-04-08 20:58:30
n=1 有什么作用?
2021-04-09 20:58:30
我得到了你的答复
2021-04-10 20:58:30

除了每小时或每周缓存之外,您可以根据文件数据进行缓存。

示例(在 PHP 中):

<script src="js/my_script.js?v=<?=md5_file('js/my_script.js')?>"></script>

甚至使用文件修改时间:

<script src="js/my_script.js?v=<?=filemtime('js/my_script.js')?>"></script>
另外,MD5 是整个文件处理器密集型的吗?我正在考虑永远这样做 css 和 js 文件,但我不想看到服务器速度因此受到影响。
2021-03-13 20:58:30
使用校验和是一个好主意,但应该正确完成。计算每个文件的每个请求将显着影响您的性能。查询字符串也不适合缓存,请参阅其他答案。正确的用法是将校验和(一部分?)或版本号附加到文件名并使用这个新名称代替(您可以使用构建脚本在部署时自动执行此操作)。参见 gruntrevusemin
2021-03-28 20:58:30
我可以验证我理解正确吗?:使用选项 1,当文件更改时,md5 校验和哈希值更改,然后更改 url。浏览器看到一个新的 url 并启动文件的新加载。服务器会忽略附加到 url 的获取数据。如果真是这样,那就太他妈狡猾了。
2021-04-03 20:58:30

您还可以强制每小时重新加载代码,就像这样,在 PHP 中:

<?php
echo '<script language="JavaScript" src="js/myscript.js?token='.date('YmdH').'">';
?>

或者

<script type="text/javascript" src="js/myscript.js?v=<?php echo date('YmdHis'); ?>"></script>
@GMsoF 只是一个额外的 get 参数,用于(在这种情况下)告诉浏览器它是一个“不同”的文件。这样浏览器将丢弃缓存的版本并加载这个版本。这通常与文件的“上次修改日期”一起使用。我希望这是有道理的 ;-)
2021-03-24 20:58:30
嗨,“v”和“令牌”是什么意思?
2021-04-10 20:58:30