Ajax内部的Ajax在循环中

Ajax inside ajax in loop

本文关键字：Ajax 循环 内部      更新时间：2023-09-26

我有代码（结构）：

for (var x = 0; x < array1.length; x++){
(function(x) {
    $.ajax({
    url : "http://someurl1.ru/"+array1[x]+"/",
    async: false,
    success : function(someresult1){
        array2.length = 0;
        array3.length = 0;
        var br = someresult1.split('<br>');
        for (var b = 0; b < br.length-1; b++){
            var space = br[b].split(" ");
            array2.push(space[0]);
            array3.push(space[1]);
        }
        for (var v = 0; v < array2.length; v++){
        (function(v) {
            $.ajax({
            url : "http://someurl2.ru/"+array2[v]+"_"+array3[v]+"/",
            async: false,
            success : function(someresult2){
                if(JSON.stringify(someresult2).search(some_array[x]) != -1){
                $.ajax({
                url : "http://someurl3.ru/"+array2[v]+"/"+array3[v]+"/"+some_another_array[x]+"",
                async: false,
                success : function(someresult3){
                    array4.push(someresult3);
                }
                });
                }
            }
            });
            })(v);
        }
    }
    });
})(x);
}

我需要在请求中激活async，因为它冻结了我的页面，降低了程序的工作速度。有一些关于程序工作的解释：

1. Take first element of array1.
2. Creating link and sending request.
3. Taking result and doing some stuff with it.
4. Creating link and sending request.
5. Taking result and doing some stuff with it.
6. Creating link and sending request.
7. Taking result.
8. AND ONLY NOW we take second element of array1 and doing the same.

我需要在循环中同步/连续的ajax请求（带有"等待"结果）。

我刚刚重新构造了请求URL的方式和回调的类型。如果有什么不对劲，请提醒我。尽管如此，我并没有改变程序的动作和风格。我真的很懒，不想让它变得更好。

例如，我制作了一个函数来消耗每个array1项，而不是循环，array2也是如此。当在其中一个数组中完成一个请求时，下一个请求会启动（如果存在），否则在array1中不执行任何操作，而在array2中，它只回调到array1，用consume函数执行下一个数组项请求。

var len = array1.length; // Memorize array1 length
function consume(i) {
    var xhr = new XMLHttpRequest(); // Request
    xhr.open("GET",  "http://someurl1.ru/" + array1[i] + "/" , true);
    xhr.onreadystatechange = function() {
        if(this.readyState === 4) {
            // Status 200 is success
            if(this.status === 200) {
                // `this` invokes the `xhr` object
                // Your success block is here
                successCallback(i, this.responseText);
                // Consume next array1 items if length isn't ranged
            }else{
                // Error block is here; can be 403, 404, 500+, ... etc.
            }
        }
    }
    xhr.send()
}
consume(0);
function consume2(i, array2, array3, arrayLen, callback) {
    var xhr = new XMLHttpRequest(); // Request
    xhr.open("GET",  "http://someurl2.ru/" + array2[i] + "_" + array3[i] + "/", true);
    xhr.onreadystatechange = function() {
        if(this.readyState === 4) {
            // Status 200 is success
            if(this.status === 200) {
                // Your success block is here
                if(JSON.stringify(xhr.responseText).search(some_array[i]) !== -1){
                    var xhr2 = new XMLHttpRequest(); // Request
                    xhr2.open("GET", "http://someurl3.ru/" + array2[i] + "/" + array3[i] + "/" + some_another_array[i], true);
                    xhr2.onreadystatechange = function() {
                        if(this.readyState === 4) {
                            // Status 200 is success
                            if(this.status === 200) {
                                // Your success block is here
                                array4.push(xhr2.responseText);
                                // Consume next array2 items
                                if(i < len)
                                    consume2(++ i)
                                ;else
                                    callback()
                            }else{
                                // Error block is here; can be 403, 404, 500+, ... etc.
                            }
                        }
                    };
                    xhr2.send()
                }
            }else{
                // Error block is here; can be 403, 404, 500+, ... etc.
            }
        }
    }
    xhr.send()
}
function successCallback(f, data) {
    array2.length = 0;
    array3.length = 0;
    var br = someresult1.split('<br>');
    for (var b = 0; b < br.length; b++){
        var space = br[b].split(" ");
        array2.push(space[0]);
        array3.push(space[1]);
    }
    consume2(0, array2, array3, array2.length, function() {
        if(f < len)
            consume(++ f)
    })
}

我会更新这段代码，但我不明白你肯定想用它做什么。

相关文章：