javascript - 如何强制一个 AJAX 请求等待另一个 AJAX 请求完成？

Question

我正在开发一款使用大量 AJAX 调用来更新、保存、编辑游戏存档等的游戏。

问题是，随后启动的 AJAX 请求似乎没有像我想要的那样排队。

例如，我正在检查服务器端是否允许执行某项操作，因此我需要一个当前的游戏存档。保存游戏在之前发送，但检查请求在保存游戏请求完成之前执行。

所以我希望它是这样的:

AJAX start: Save Game
AJAX finish: Save Game
AJAX start: Check
AJAX finish: Check
AJAX start: Save Game
AJAX finish: Save Game

目前比较像这样:

AJAX start: Save Game
AJAX start: Check
AJAX finish: Save Game
AJAX start: Save Game
AJAX finish: Check
AJAX finish: Save Game

即使在时间上，AJAX 调用也会以正确的顺序触发。他们只需要等到上一个触发的调用结束。

有没有办法在全局范围内实现这一目标？因为大多数调用不知道其他请求。

我可以在没有 setInterval 的情况下完成这项工作吗？调用以检查请求是否完成？

更新:显然，我没有解决实际问题。我知道这是因为 AJAX 是异步的。

但我需要那些留在队列中。同样在运行时，我不知道什么时候触发了哪些调用，因为这完全取决于用户操作。所以我不能调用 check在 save 之后请求请求，因为我不知道用户是否触发了需要调用 check 的操作请求。

所以我需要一个全局实现，ajax 请求总是等待它们的执行，直到每个预先存在的请求都完成。

所以我希望这些调用是异步的(不卡住 UI 等)，但在它们的执行顺序方面是“同步的”。

Answer 1

有一个非常有用的 jquery 插件 ajaxQ允许您创建一个 ajax 请求队列

$.ajaxq ("MyQueue", {
    url: 'http://jsfiddle.net/echo/jsonp/',
    type: 'post',
    dataType: "jsonp"
});

在我看来，最好为自己创建一个添加到队列的函数，如下所示:

function AddRequest(name, url, postData) {
var jqXHR = $.ajaxq(name, {
    url: url,
    type: 'POST',
    contentType: "application/x-www-form-urlencoded",
    data: postData,
    beforeSend: function () {
        //do stuff
    },
    error: function (response) {
        //do stuff
    },
    complete: function (response) {
        //do stuff
    },
    success: function (response) {
        //do stuff
    }
});
}

然后你可以调用它:

var myurl = "http://www.example.com/myaction";
var postData = "myparam1=one&myparam2=two";
AddRequest('myAjaxQueue', myurl, postData);