setInterval& AJAX

时间:2015-11-29 16:17:43

标签: javascript jquery ajax

我有这个简单的聊天工具来更新聊天室:

setInterval (loadLog, 2500);
function loadLog(){
    //Scroll height before the request
    var oldScrollHeight = document.getElementById("chatMessages").scrollHeight - 20;
    $.ajax({
        url: "/includes/chat/log.html",
        cache: false,
        success: function(html){
            //Insert chat log into the #chatMessages div
            $("#chatMessages").html(html);
            var newScrollHeight = document.getElementById("chatMessages").scrollHeight - 20;
            if(newScrollHeight > oldScrollHeight){
                //Autoscroll to bottom of div
                $("#chatMessages").animate({scrollTop: newScrollHeight}, 'normal');
            }
        },
    });
}

大约每2.5秒执行一次。但是我想节省带宽...

我改变了:

cache: false

cache: true

现在它不能每2.5秒可靠地执行一次。 (也许每个后续请求都比前一个要求更长?也许不是,它的行为很奇怪)

我的研究一无所获。请帮忙! < 3

1 个答案:

答案 0 :(得分:1)

如果启用缓存,浏览器将缓存上次调用服务器的响应,并且不会进行后续调用。这是预期的,这是cache: true属性的设计目标。如果要减少带宽使用,可以考虑使用推送技术而不是定期轮询。这可以使用HTML5 WebSockets来实现。在这种情况下,只要发生更新,服务器就会将通知推送到客户端,而不是客户端每2.5秒轮询一次服务器。显然,这只适用于支持WebSockets的浏览器,因此如果您需要支持旧浏览器,则可能需要在使用它们之前进行功能检测。