Question

这真的非常接近我的问题：concurrent ajax calls

当用户点击按钮时，我想发出请求。用户可以多次单击该按钮，每次都会创建一个新的XMLHttpRequest。 每个请求都可以启动，处理和完成，与存在的呼叫数量以及其他呼叫的状态无关。

我的问题是最新请求仅在上一次结束后才开始。我找到了几个使用JQuery推迟和承诺的解决方案，或使用数组来存储调用，但要么我不理解答案，要么他们不能解决我的问题。

这是我用来创建请求的函数的简化形式

library.flush = function (action, info, method) {
try {        
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function () {
        try {
            if (xhr.readyState == 3) {
                method.onProcess();
            }
            else if (xhr.readyState == 2) {
                method.onReady();
            }
            else if (xhr.readyState == 1) {
                method.onStart();
            }
            else if (xhr.readyState == 4) {
                method.onDone();
            }
        }
        catch (e) {
            console.log("library.flush: xhr.onreadystatatechange error");
            console.log(e.message);
        }
    };
    method.onBeforeStart();
    xhr.open("POST", action, true);
    xhr.send(data);
}
catch (e) {
    console.log("library.flush: main error");
    console.log(e.message);
}
};

说实话，我甚至不知道我尝试做的事情是否可行，但我想这并不会让人感到伤心。

这就是我调用library.flush的方式

if (!Date.now) {
Date.now = function() { return new Date().getTime(); }
}

$(".quickPost").keyup(function (e) {
if (e.keyCode == 13) {
    console.log("KeyUp fired");
    var data = {};
    data.URL = $('#quickDownload').val();
    data.type = $('#quickType').attr('value');
    if (!data.URL) {
        return;
    }
    this.blur();
    var events = {
        onBeforeStart: function () {
        },
        onStart: function () {
            console.log("Start " + Date.now());
        },
        onReady: function () {
            console.log("Ready " + Date.now());
        },
        onProcess: function (text) {
            console.log("Process");
        },
        onDone: function () {
            console.log("Done " + Date.now());
        }
    };
    library.flush('download', data, events);
}
});

这就是我的Firebug控制台的样子

KeyUp fired //BEGIN REQUEST 1
Start 1425752652632 //REQUEST 1
POST {URL} //REQUEST 1
Ready 1425752655237 //REQUEST 1
6 Process //REQUEST 1
KeyUp fired //BEGIN REQUEST 2
Start 1425752655822 //REQUEST 2
POST {URL} //REQUEST 2
18 Process //REQUEST 1
KeyUp fired //BEGIN REQUEST 3
Start 1425752658950 //REQUEST 3
POST {URL} //REQUEST 3
7 Process //REQUEST 1
Done 1425752661221 //REQUEST 1
Ready 1425752666305 //REQUEST 2
35 Process //REQUEST 2
Done 1425752675168 //REQUEST 2
Ready 1425752677345 //REQUEST 3
28 Process //REQUEST 3
Done 1425752684975 //REQUEST 3

如何进行并发和独立的Ajax调用？

0 个答案: