如何在完全缓存使用的情况下手动触发F5键并重新加载页面

Question

我们有一个网页,经常通过单击F5或Ctrl-R重新加载,以便查看是否有新数据到达.

此页面中的所有图像都具有永久缓存标头,因此不应由浏览器重新加载.

但是当用户按下F5时,大多数浏览器都会检查每个缓存条目的请求和if-modfied-since标头.我们的HTML页面从不缓存,但图像应该缓存很长时间,并且不需要询问图像是否被修改.这是一个无用的请求,我们想要摆脱它.

我们的页面上有一个重新加载图标,但用户仍然会使用键盘重新加载(我也愿意).

所以我尝试触发F5和Ctrl-R键并像这样手动重新加载(顺便说一句,我们使用的是jquery):

<img src="someimg.png" />
<a id="reload" href="mypage.html">Reload</a>    
<script type="text/javascript">
function loading() {
    window.location.href = $('#reload').attr("href"); 
    return false;
}

function isF5(e) {
    return e.which == 116;
}
function isCtrlR(e) {
    return e.ctrlKey &amp;&amp; e.which == 82;
}

function triggerReloadKeys(e) {
    if (isF5(e) || isCtrlR(e)) {
        $('#reload').click();
    }
}
$(document).bind("keydown", triggerReloadKeys);
$('#reload').click(loading);

someimg.png总是带有持久缓存指令.

我的第一个答案是告诉我不要接管用户浏览器,如果他愿意,让他刷新.你是对的,但在高峰时间我们的速度高达5000页/秒.甚至更多的图像因为每个人都在不断地重新加载页面.我们只想缩减请求数量,无论它们有多快.(我知道我无法触发菜单栏中的浏览器刷新按钮,但我现在不关心它).

我们在减少App中的请求数量方面非常成功,因为我们没有任何重新加载按钮或F5但是每个人都被迫使用我们自己的HTML重新加载链接.

可能的是一起禁用F5键,如下所示:

function triggerReloadKeys(e) {
    if (isF5(e) || isCtrlR(e)) {
        return false;
    }
}

我不知道是否甚至可以触发F5并强制重新加载,同时仍然使用缓存并模仿单击页面上另一个链接的行为.

有任何想法吗？

Answer 1

我猜你还没有得到答案.

这就是我在我的网站上使用的内容:

var ctrlDown = false;
var ctrlKey = 17, f5Key = 116, rKey = 82;

$(document).keydown(function( e ) {
    if( e.keyCode == f5Key )
    {
        //F5 pressed. Copy your code here or try
        //window.location   = window.location;
        //It will avoid if-modified-since requests.
        e.preventDefault( );
    }

    if( e.keyCode == ctrlKey )
        ctrlDown = true;
    if( ctrlDown && ( e.keyCode == rKey ) )
    {
        //Ctrl + R pressed. Do whatever you want
        //or copy the same code here that you did above
        e.preventDefault( );
    }

}).keyup(function(e) {
    if (e.keyCode == ctrlKey)
        ctrlDown = false;
});

希望对你有效.