强制使用 Javascript 在 Chrome 中重新加载页面 [无缓存]

Force a reload of page in Chrome using Javascript [no cache]

本文关键字：加载 缓存 新加载 Javascript Chrome      更新时间：2023-09-26

我需要使用 JavaScript 重新加载页面，并确保它不会从浏览器缓存中提取，而是从服务器重新加载页面。[由于页面的元素在此期间会发生变化]

在IE和FF上，我发现以下代码工作正常;

window.location.reload(true);

但是，它不适用于Chrome或Safari。

我尝试了以下方法，但也无济于事;

window.location.replace(location.href);
document.location.reload(true);
document.location.replace(location.href);

这个问题有解决方案吗？

发现

调查后，我发现这个问题是HTTP协议处理;

  1. Chrome 发送包含 HTTP 字段的请求Pragma: no-cache
  2. 服务器使用Last-Modified: DATE1字段进行响应
  3. JS使用location.reload(true)强制从服务器而不是缓存重新加载
  4. Chrome 发送带有If-Modified-Since: DATE1字段的请求
  5. 服务器响应HTTP Status 304 Not Modified

服务器应用程序有过错，因为没有注意到动态页面内容中的状态更改，因此没有返回200。但是，Chrome/WebKit 是唯一在调用 JS location.reload(true)时发送If-Modified-Since字段的浏览器。

我想我会把我的发现放在这里，以防其他人遇到同样的问题。

您可以使用此技巧：

 $.ajax({
        url: window.location.href,
        headers: {
            "Pragma": "no-cache",
            "Expires": -1,
            "Cache-Control": "no-cache"
        }
    }).done(function () {
        window.location.reload(true);
    });

为了确保页面不会从缓存加载，您可以添加一些唯一编号进行查询：

window.location = location.href + '?upd=' + 123456;

您也可以使用日期代替123456

这是我为确保我的应用程序文件在 chrome 上强制重新加载而采取的措施：

    var oAjax = new XMLHttpRequest;
    oAjax.open( 'get', '/path/to/my/app.js' );
    oAjax.setRequestHeader( 'Pragma', 'no-cache' );
    oAjax.send();
    oAjax.onreadystatechange = function() {
        if( oAjax.readyState === 4 ) {
            self.location.reload();
        }
    }

尝试window.location = window.location

很棒的发现！我刚刚遇到了同样的问题，这真的有很大帮助！但是，除了您的发现之外，Chrome似乎总是发送一个get请求来获取location.reload（）...IE/FF 正在重复最后一个请求。

相关文章：