在JavaScript中清除缓存

Question

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

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

编者注:这个问题在以下几个地方是半复制的,下面第一个问题的答案可能是最好的.这个已接受的答案不再是理想的解决方案.

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

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

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

Answer 1

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

但是,您最好的策略是对各种其他答案中提到的路径或文件名进行版本控制.另外,请参阅Revving Filenames:不要使用查询字符串,以免被?v=n用作版本控制方案.

Answer 2

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

myscript.123.js

要么

myscript.js?updated=1234567890

Answer 3

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

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

对此:

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

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

Answer 4

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

示例(在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>

Answer 5

您还可以强制在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>

Answer 6

window.location.reload(true)似乎已被 HTML5 标准弃用。在不使用查询字符串的情况下执行此操作的一种方法是使用Clear-Site-Data标题，这似乎是标准化的。

Answer 7

把它放在模板的末尾:

var scripts =  document.getElementsByTagName('script');
var torefreshs = ['myscript.js', 'myscript2.js'] ; // list of js to be refresh
var key = 1; // change this key every time you want force a refresh
for(var i=0;i<scripts.length;i++){ 
   for(var j=0;j<torefreshs;j++){ 
      if(scripts[i].src && (scripts[i].src.indexOf(torefreshs[j]) > -1)){
        new_src = scripts[i].src.replace(torefreshs[j],torefreshs[j] + 'k=' + key );
        scripts[i].src = new_src; // change src in order to refresh js
      } 
   }
}

Answer 8

这是我正在使用的最新项目的片段.

从控制器:

if ( IS_DEV ) {
    $this->view->cacheBust = microtime(true);
} else {
    $this->view->cacheBust = file_exists($versionFile) 
        // The version file exists, encode it
        ? urlencode( file_get_contents($versionFile) )
        // Use today's year and week number to still have caching and busting 
        : date("YW");
}

从视图来看:

<script type="text/javascript" src="/javascript/somefile.js?v=<?= $this->cacheBust; ?>"></script>
<link rel="stylesheet" type="text/css" href="/css/layout.css?v=<?= $this->cacheBust; ?>">

我们的发布过程会生成一个文件,其中包含当前版本的修订号.这通过URL编码该文件并将其用作缓存破坏程序来工作.作为故障转移,如果该文件不存在,则使用年份和周数,以便缓存仍然有效,并且每周至少刷新一次.

此外,这为在开发环境中的每个页面加载提供缓存清除,以便开发人员不必担心清除任何资源(javascript,css,ajax调用等)的缓存.

Answer 9

或者您可以通过服务器使用file_get_contets读取js文件,然后在头文件中将echo放入js内容

Answer 10

尝试使用这个

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

对此:

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