使用缓存的location.reload

5

如果您对这个问题有更好的标题,请随意编辑。

最长一段时间,我总是使用 location.reload() 来重新加载页面 - 这是最合理的事情,对吧?

但是我最近注意到它并不等同于 F5,就像我最初想的那样,而更像 Ctrl+F5。当我只想重新加载页面时,所有图像和其他链接文件都将再次从服务器请求。

我发现我可以使用 location.replace(location.href) 来实现我想要的效果:重新加载页面,但从缓存中检索链接文件。

这是理想的吗?有比这更好的方法吗?我是否忽略了该方法可能存在的任何缺陷?

(注意:我已经在链接文件(如脚本)上附加了 filemtime 作为查询字符串,以进行缓存破坏管理)


window.location.reload(false); 将从缓存中重新加载... - Drewness
如果为假或未指定,则浏览器可能从其缓存中重新加载页面。请注意使用了“可能”和“页面” - 它没有提到“将会”或链接的文件。 - Niet the Dark Absol
好的,我明白了。从“最佳实践”的角度看待这个问题并不是最好的方式,因为我们需要考虑到“功能性”方面的情况... - Drewness
1个回答

4

回答我自己的问题,有一个很大的陷阱:当位置包含一个哈希时,浏览器会跳转到该哈希而不是重新加载页面。

我实施的解决方案如下:

reload = (function() {
    var m = location.search.match(/[?&]__hash=([^&]+)/);
    if( m) location.hash = unescape(m[1]);
    return function() {
            var h = location.hash;
            if( h == "") {
                    location.replace(location.href);
            }
            else {
                    var s = location.search;
                    s = s.replace(/[?&]__hash=[^&]+/,'');
                    s += (s == "" ? "?" : "&")+"__hash="+escape(h);
                    location.replace(location.pathname+s);
            }
    };
})();

假设服务器端没有使用$_GET['__hash'],这样就可以安全使用。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接