使用setInterval的Ajax Heartbeat，同时防止多个调用

I wish to make an AJAX call using jQuery as a "heartbeat" in the background so that my web application can check for new data. For example every 10 seconds.

我希望在后台使用jQuery作为“心跳”进行AJAX调用，以便我的Web应用程序可以检查新数据。例如每10秒。

I have seen on other posts that it is possible to use setInterval() to call a method which does the call every X number of milliseconds.

我在其他帖子上看到，可以使用setInterval（）来调用每隔X毫秒执行调用的方法。

However, what happens if my AJAX call takes more than 10 seconds? I still want it to complete the last request and I don't want another call to be instigated when there is already one in progress. This could result in the same information being placed on to the page twice!

但是，如果我的AJAX调用超过10秒钟会发生什么？我仍然希望它完成最后一个请求，并且我不希望在已经有一个正在进行的情况下发起另一个呼叫。这可能导致相同的信息被放置到页面两次！

What is the way to implement this for my method to wait for the original AJAX call to be completed, rather than simply "every 10 seconds", when the original one may not already be complete.

实现此方法的方法是什么，等待原始AJAX调用完成，而不是简单地“每10秒”，原始的AJAX调用可能尚未完成。

3 个解决方案

#1

try setting another timeout from your ajax success function:

尝试从ajax成功函数设置另一个超时：

function poll() {
    setTimeout( function() {
        $.ajax(.......).success( function(data) {
            poll();  //call your function again after successfully calling the first time.
        });
    }, 10000);
}

#2

Instead of using setInterval, call setTimeout() in the AJAX completion callback to start each call 10 seconds after the previous one finishes.

而不是使用setInterval，在AJAX完成回调中调用setTimeout（）以在前一个调用完成后10秒启动每个调用。

#3

instead of using setInterval, calculate the request time (usually using a unix timestamp in seconds), how much for 10 seconds, in the server side, use setTimeout the remaining time, so it will vary from user to user, on their ping time (or the business of the site)

而不是使用setInterval，计算请求时间（通常使用unix时间戳，以秒为单位），10秒内服务器端多少使用setTimeout剩余时间，因此它会因用户的ping时间而异（或网站的业务）

function heartbeat(){
  $.ajax({
    'url': '/where/',
    'success': function(data){
       setTimeout(heartbeat, parseInt(data) * 1000);
    }
  });
}
heartbeat(); // initialize it

in the server side, (like in PHP), you would do

在服务器端，（就像在PHP中），你会这样做

<?php
// do your stuff
echo (time() - (int)$time_requested) + 10; // it will vary per user, so if it takes 2 second, it will be 12, if it returns imediately, returns 10

#1