同時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，計數器，版本號，密鑰等）進行編碼將允許您檢查此項以驗證您是否擁有最新響應，或者如果您需要保證訂單，則按時間戳對結果進行排序等