同时Ajax多个请求

Question

最近我开发了一个项目，我在一个aspx页面上发送了多个ajax请求。 我还放了一个计时器，这个请求发生间隔5秒。 一切似乎都很好，直到突然响应混乱。 我知道我可以用一个请求做同样的事情，但我想知道为什么会这样。 我环顾了互联网，但我还没找到任何解决方案。 我现在实际上采用了这种编码风格，比如使用多个结果发出一个请求，但我想知道并且我真的想知道如何制作多个ajax请求，响应不会混淆。 这是我的示例代码：

 $(document).ready(function () {
        var a = setInterval("request1()", 5000);
        var b = setInterval("request2()", 5000);
    });

function request1() {

        $.ajax({
            url: 'ajaxhandler.aspx?method=method1' ,
            beforeSend: function (xhr) {
                xhr.overrideMimeType('text/plain; charset=utf-8');
            },
            success: function (data) {
                  alert(data);
            }

        });
    }


function request2() {

        $.ajax({
            url: 'ajaxhandler.aspx?method=method2' ,
            beforeSend: function (xhr) {
                xhr.overrideMimeType('text/plain; charset=utf-8');
            },
            success: function (data) {
                  alert(data);
            }

        });
    }

Answer 1

如果您需要按顺序发生请求，则不应使用AJAX（第一个“a”用于“异步”）。

要解决此问题，您可以在回调中调用request2（）以获取第一个请求的“成功”。

function request1() {
    $.ajax({
        url: 'ajaxhandler.aspx?method=method1' ,
        beforeSend: function (xhr) {
            xhr.overrideMimeType('text/plain; charset=utf-8');
        },
        success: function (data) {
              request2();
        }

    });
}

Answer 2

下面的函数将接受JSON请求的URL数组，并在完成所有请求后使用一组结果调用回调。 它可以很容易地适应非JSON使用。

我们的想法是在传入的响应到达时将其存储到数组中，然后只有在所有结果都进入时才调用回调。这种方法是批量更新DOM并避免为每个节点设置计时器的好方法。更新。

function multi_getJSON(urls, callback)
{
    // number of ajax requests to wait for
    var count = urls.length;

    // results of individual requests get stuffed here
    var results = [];

    // handle empty urls case
    if(count === 0)
    {
        callback(results);
        return;
    }

    urls.forEach(function(url, index)
    {
        $.getJSON(url, function(data)
        {
            results[index] = data;
            count = count - 1;

            // are we finished?
            if(count === 0)
            {
                callback(results);
            }
        });
    });
}

Answer 3

这不是JavaScript的错误，因为你在同一时间调用单个页面而搞砸了。 如果您的两个AJAX文件有两个服务器端页面，那就没关系了。 尝试创建两个不同aspx文件你不同的methods把他们召集起来。

但这不是一个好习惯。 为什么不将方法作为参数发送并在aspx文件中为不同的方法设置条件？ 然后，如果您同时使用两个（或更多）方法，则只需通过一次调用将两者都发送到服务器。 您将为呼叫保存HTTP标头和呼叫延迟。

function requestAll() {

        $.ajax({
            url: 'ajaxhandler.aspx' ,
            data: ['method1', 'method2'],
            beforeSend: function (xhr) {
                xhr.overrideMimeType('text/plain; charset=utf-8');
            },
            success: function (data) {
                  alert(data);
            }

        });
    }

Answer 4

如前所述，您不能保证结果返回的顺序。但是如果有必要能够确定这一点，您可以设想为每个异步请求创建一个唯一的标识符，然后相应地对传入的响应进行排序。 。

我看到这样的解决方案有用的一个例子是在击键时执行动作（例如onkeyup）。 在执行此类操作时，您可能希望对时间戳，版本号或类似信息进行编码，以便您可以保证某种顺序。 如果用户试图搜索“test”，则可能在“te”的响应之前返回“tes”的自动完成响应。 如果您只是覆盖自动填充数据，那么这显然不是所需的行为，因为您可能会显示当前搜索令牌的错误结果。

对时间戳（或唯一ID，计数器，版本号，密钥等）进行编码将允许您检查此项以验证您是否拥有最新响应，或者如果您需要保证订单，则按时间戳对结果进行排序等