如何限制ajax请求?

时间:2011-02-17 16:11:19

标签: javascript jquery

有几个div和处理程序在单击它们时发送ajax请求。我的问题是我不知道如何强迫我的处理程序不超过每30秒1个请求的限制。

感谢您的帮助!

3 个答案:

答案 0 :(得分:33)

优秀的Underscore.js有节流功能。您传入要阻止的处理程序并返回同一函数的速率限制版本。

var throttled = _.throttle(someHandler, 100);
$(div).click(throttled);

http://documentcloud.github.com/underscore/#throttle

这是我在自己的代码中使用的简化版本:

function throttle(func, wait) {
    var timeout;
    return function() {
        var context = this, args = arguments;
        if (!timeout) {
            // the first time the event fires, we setup a timer, which 
            // is used as a guard to block subsequent calls; once the 
            // timer's handler fires, we reset it and create a new one
            timeout = setTimeout(function() {
                timeout = null;
                func.apply(context, args);
            }, wait);
        }
    }
}

测试它的一个好方法是触发一堆滚动事件并观察你的处理程序登录到Firebug控制台:

document.addEventListener("scroll", throttle(function() {
    console.log("test");
}, 2000), false); 

这是一个版本,根据请求(需要jQuery)将div上的点击事件限制为每30秒一次:

$("div").click(throttle(function() {
    // ajax here
}, 30000));

答案 1 :(得分:18)

如果你想率限制,那么不幸的是,underscore.js提供的_.throttle方法不是你的解决方案。 Throttle将确保您的方法永远不会被调用超过X秒,因此所有后续函数调用将被忽略,直到该时间段过去。

如果你想限速,这样你就不会每秒调用你的函数超过X次,但是不要完全失去那些函数调用,那么你需要一个完全不同的解决方案。

我在https://gist.github.com/1084831

写了一个下划线扩展名

您可以在http://jsbin.com/upadif/8/edit#preview

看到一个有效的例子

答案 2 :(得分:11)

创建一个boolean canFireRequest,或者其他任何标志,并在每次ajax请求后将其设置为false。然后创建一个30秒的时间跨度,使其恢复为真;在每个新请求之前检查标志的值。

这是一个粗略的例子:

if ($(this).data('canFireRequest')) {
    // Ajax request goes here
    $(this).data('canFireRequest', false);
}

setTimeout(function() {
    $(this).data('canFireRequest', true)
}, 30000);