3

我目前有以下代码，它将运行一堆 ajax 请求（40-50），然后再次执行它们。（所以基本上永远做他们）

代码：

 $(document).ready(function () {
        window.setInterval(function () {
            $('div.env').each(function (index, item) {
                var vm = $(item).text();                    
                var env = "http://localhost:56656/HTML" + vm + ".htm";
                $.ajax(env, {
                    async: false,
                    URL: env,
                    type: "GET",
                    dataType: "html",
                    success: function (data) {
                        //alert("Colouring");
                        var style = $(data).filter('div').attr('style');
                        var styleObj = {};
                        $.each(style.split(';'), function () {
                            var rule = this.split(':');
                            styleObj[$.trim(rule[0])] = $.trim(rule[1]);
                        });

                        $(item).css('background', styleObj.background);

                    },
                    error: function () {

                        $(item).css('background', '#f00');
                    }
                });

            });

        }, 10000);
    });

如您所见，我目前正在使用超时，它在 IE 上运行特别慢，有时在 chrome 上运行缓慢。当我说慢时，我的意思是所有 ajax 请求都将完成，然后屏幕将刷新更新。在 IE 上一直都是这种情况，偶尔在 Chrome 上也是如此。理想情况下，我希望 ajax 执行它的请求，更新然后执行下一个 ajax 请求。

有更好的方法来不断地执行 AJAX 请求吗？

提前谢谢你，詹姆斯

4

4 回答 4

2

您可能想使用Caolan 的异步库。您的代码可能如下所示（async.js当然包括在内）：

$(document).ready(function () {
    function call() {
        var calls = [];
        $('div.env').each(function (index, item) {
            calls.push(function(callback) {
                $.ajax({
                    // DO NOT USE async: false!!!!
                    // some ajax settings
                    complete : function() {
                        callback();
                    }
                });
            });
        });
        async.parallel(calls, function() {
            /* This will fire when every call finishes.
               You may want to add timeout here, or else
               you will end up flooded with requests. */
            call();
        });
    };
});

您应该根据需要对其进行调整（async也可以处理错误，阅读文档）。你说你想让他们一个接一个地开火，所以用.async.series而不是async.parallel.

顺便说一句，这段代码：

$.ajax({
    async: false

纯粹的邪恶！！！阻止所有其他脚本甚至整个浏览器！！！这可能是您的“慢闪”问题的原因。

于 2012-07-10T14:20:34.007 回答
0

不确定在您的情况下是否可行，但 Websocket/长轮询解决方案（如 SignalR 或 Node.Js + Socket.IO）通常比连续轮询工作得更好。

于 2012-07-10T14:31:41.087 回答
0

您应该使用setTimeout()代替setInterval()并执行以下操作：

  • 如果请求失败，做任何你想做的事:)
  • 如果请求成功，请调用setTimeout()
于 2012-07-10T14:38:42.647 回答
0

我认为这是一个架构问题，而不是其他任何问题。

我建议重建结构以将数组发送到服务器，并将响应组合到一个 html 页面或json 对象中

这样做的原因显然是引用，无论你做什么，40-50 个并发 ajax 请求肯定总是很慢，因为即使你的 ajax 成功处理程序（你绑定到成功的函数）在 10 毫秒内完成（它由于其复杂性，肯定不在 IE 上），40 个请求意味着至少 400ms 独占时间，导致客户端性能问题。在你的情况下，

async: false

甚至将请求时间添加到该独占时间，因此如果您的请求在 10 毫秒内完成（极不可能），您将使用另外 400 毫秒的客户端独占时间。

因此，在客户端搜索解决方案并不是一个真正的选择。

于 2012-07-10T14:56:51.653 回答