带有清除缓存的 window.location.reload [重复]

Posted

技术标签:

【中文标题】带有清除缓存的 window.location.reload [重复]【英文标题】:window.location.reload with clear cache [duplicate] 【发布时间】:2011-08-08 23:11:38 【问题描述】:

我想使用 javascript 重新加载页面,但我也想清除缓存,因此在页面刷新时,页面会包含来自服务器的所有内容的最新版本。 除 IE 以外的其他浏览器都没有获取最新的内容。

IE9 有什么解决方案吗?

【问题讨论】:

当用户坐在代理后面时,可能会发生丑陋的事情。为确保页面重新加载,只需在您的 url 中添加一个随机 val。 window.location.href = window.location.href 1) 我保存了一个带有 DIV 的 html 页面 - MainDIV 里面有很多 DIVS。 2)当我将 HTML 分配给这个 DIV 时,我如何清除 DIV 中的任何内容并分配保存的 Div 值? 3)您对如何解决此要求有想法吗? 【参考方案1】:

您可以通过几种方式做到这一点。一,只需将此元标记添加到您的head

<meta http-equiv="Cache-control" content="no-cache">

如果您想从缓存中删除文档,expires 元标记应该可以通过将其 content 属性设置为 -1 来删除它,如下所示:

<meta http-equiv="Expires" content="-1">

http://www.metatags.org/meta_http_equiv_cache_control

此外,IE 应该为您提供主页的最新内容。如果您在使用外部文档(如 CSS 和 JS)时遇到问题,请在您的 URL 末尾添加一个虚拟参数,当前时间以毫秒为单位,这样它就不会相同了。这样 IE 和其他浏览器将始终为您提供最新版本。这是一个例子:

<script src="mysite.com/js/myscript.js?12345">

更新 1

阅读 cmets 后,我意识到您想以编程方式擦除缓存,而不是每次都擦除。你可以做的是在 JS 中有一个函数,比如:

eraseCache()
  window.location = window.location.href+'?eraseCache=true';

然后,假设在 php 中,您执行以下操作:

<head>
<?php
    if (isset($_GET['eraseCache'])) 
        echo '<meta http-equiv="Cache-control" content="no-cache">';
        echo '<meta http-equiv="Expires" content="-1">';
        $cache = '?' . time();
    
?>
<!-- ... other head HTML -->
<script src="mysite.com/js/script.js<?= $cache ?>"
</head>

这未经测试,但应该可以工作。基本上,如果调用您的 JS 函数,它将重新加载页面,但会在 URL 的末尾添加一个 GET 参数。然后,您的站点将有一些用于查找此参数的后端代码。如果存在,它会添加元标记和包含时间戳的缓存变量,并将其附加到您遇到缓存问题的脚本和 CSS。

更新 2

元标记确实不会在页面加载时删除缓存。因此,从技术上讲,您需要在 JS 中运行 eraseCache 函数,一旦页面加载,您需要再次加载它以进行更改。您应该能够使用服务器端语言解决此问题。您可以运行相同的 eraseCache JS 函数,但不需要添加元标记,您需要添加 HTTP 缓存标头:

<?php
    header("Cache-Control: no-cache, must-revalidate");
    header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
?>
<!-- Here you'd start your page... -->

此方法无需重新加载页面即可立即工作,因为它会在页面加载之前以及运行任何内容之前擦除缓存。

【讨论】:

如果我错了,请纠正我,但元缓存控制标签会阻止正在加载的页面的缓存。它不会清除已经保存在客户端浏览器中的缓存。 此外,将时间(以毫秒为单位)添加到 src 属性的末尾将永远不允许缓存该 javascript 文件...这是不可取的。我从 coure06 希望能够通过请求清除浏览器缓存的问题中得到它 - 不是永久确保文件永远不会被缓存。也许一个组合解决方案是使用包含的 GET 参数创建指向同一页面的链接,这将强制 javascript 包含附加当前时间。 只是继续添加 cmets,因为我认为显然有新事物。根据某些事件将毫秒添加到文件路径不会像想象的那样容易,因为在这完成一次之后 - 文件路径永远不会回到 myscript.js 因为浏览器只会切换回缓存的文件。 我想我不明白。 expires 将使当前页面的缓存过期。它应该把它全部抹掉,IE 会抓住一切新鲜的东西。他并不是说他想删除每个站点和每个页面的用户缓存,只是为了重新加载页面。 对于“更新 1”:不起作用,因为 page.html 和 page.html?eraseCache=true 是单独的缓存条目(缓存是查询字符串感知的)。 “更新 2”也不起作用,因为您正在从服务器提供“擦除缓存”标头,但您要解决的整个问题是正在提供页面来自缓存并且没有访问服务器!【参考方案2】:

reload() 应该接受一个参数,告诉它进行硬重新加载,即忽略缓存:

location.reload(true);

我无法保证它的可靠性,您可能需要进一步调查。


编辑 (2021):该参数从未标准化,在更现代的浏览器中已被弃用和删除。每季度添加一条描述这一事实的评论将无济于事。

【讨论】:

适用于 IE 和 FF,但不适用于 Chrome、Safari。有人知道如何在 Chrome、Safari 中实现这一点吗? 这是否也会强制重新加载引用的文件? (比如页面中嵌入的 JS 和 CSS 文件和图片?) 我正在开发一个 AngularJs 应用程序,我使用 window.location.reload(true);但它仍在使用缓存的 JS 脚本。 这对我有用 chrome window.location.href = window.location.href @Antonio 写答案时(10 年前)它曾经可以工作。它已被弃用和删除。 mozilla 文档实际上是部分错误的 - 它已为 MSIE 记录,例如:web.archive.org/web/20140619064920/http://blogs.msdn.com/b/…(请参阅bReloadSource【参考方案3】:

我编写了这个 javascript 脚本并将其包含在标题中(在加载任何内容之前)。它似乎工作。如果页面在一小时前加载或情况未定义,它将从服务器重新加载所有内容。 一小时的时间 = 3600000 毫秒可以在以下行中更改: 如果(改变 > 3600000)

关于, 伯克

<script type="text/javascript">
//<![CDATA[
function zeit()

    if(document.cookie)
    
        a = document.cookie;
        cookiewert = "";
        while(a.length > 0)
        
            cookiename = a.substring(0,a.indexOf('='));
            if(cookiename == "zeitstempel")
            
                cookiewert = a.substring(a.indexOf('=')+1,a.indexOf(';'));
                break;
            
            a = a.substring(a.indexOf(cookiewert)+cookiewert.length+1,a.length);
        
        if(cookiewert.length > 0)
        
            alter = new Date().getTime() - cookiewert;

            if(alter > 3600000)
               
                document.cookie = "zeitstempel=" + new Date().getTime() + ";";
                location.reload(true);
            
            else
            
                return;
            
        
        else
        
            document.cookie = "zeitstempel=" + new Date().getTime() + ";";
            location.reload(true);
        
    
    else
    
        document.cookie = "zeitstempel=" + new Date().getTime() + ";";
        location.reload(true);
    

zeit();
//]]>
</script>

【讨论】:

【参考方案4】:

在我的情况下 reload() 不起作用,因为 asp.net 控制行为。因此,为了解决这个问题,我使用了这种方法,尽管似乎可以解决。

self.clear = function () 
    //location.reload(true); Doesn't work to IE neither Firefox;
    //also, hash tags must be removed or no postback will occur.
    window.location.href = window.location.href.replace(/#.*$/, '');
;

【讨论】:

【参考方案5】:

我遇到了这个问题,我使用 javascript 解决了它

 location.reload(true);

你也可以使用

window.history.forward(1);

在用户退出应用程序后停止浏览器返回按钮。

【讨论】:

location.reload(true); 会放在 javascripts 文件中的什么位置? 是的,可以放在任何js文件中 @FedericoCapaldo 只需将它放在您希望重新加载用户页面时调用的任何函数中 试图在 service worker 中使用它到我的 pwa 应用程序中,它不会清除缓存并导致无限重新加载

以上是关于带有清除缓存的 window.location.reload [重复]的主要内容,如果未能解决你的问题,请参考以下文章

更改图像时清除 CATiledLayers 缓存

TYPO3:清除索引搜索缓存

.net带有参数的页面怎么进行缓存,缓存后可浏览正确页面

上传新版本代码时如何强制浏览器清除缓存

内存缓存和通配符

使用 MSW 和 Jest 时如何在请求之间的测试中清除 RTK 查询缓存?