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

我正在开发一款使用大量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 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是异步的

但我需要这些来排队。在运行时，我也不知道在什么时候触发了什么调用，因为这都依赖于用户操作。因此，我不能在

保存

请求之后调用

检查

请求，因为我不知道用户是否触发了需要调用

检查

请求的操作

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

---

因此，我希望这些调用是异步的（不冻结UI等），但在执行顺序方面是“同步的”。

如果您使用的是jQuery的

$.ajax（）

或

$.post（）

或

$.get（）

，请使用回调来启动下一个调用！例如：

console.log("AJAX start: Save Game");
$.post("save-game.php", function(){
    console.log("AJAX finish: Save Game");
    console.log("AJAX start: Check");
    $.post("check.php", function(){
        console.log("AJAX finish: Check");
        // Iterate from here using a recursive function! :P
    });
});

您可以通过以下方式进行迭代：

function saveCheckGame()
{
    console.log("AJAX start: Save Game");
    $.post("save-game.php", function(){
        console.log("AJAX finish: Save Game");
        console.log("AJAX start: Check");
        $.post("check.php", function(){
            console.log("AJAX finish: Check");
            saveCheckGame();
        });
    });
}

---

一种方法是使用第一个请求的回调来启动下一个请求

更干净的解决方案是在回调中设置一个事件，并在触发事件时运行第二个请求

在第一个请求回调中

$( document ).trigger( "request1Finished" );

附加事件处理程序

$( document ).on( "request1Finished", function() {
    // run next request
});

您可以找到一个有趣的aspects异步ajax调用。但我认为您应该考虑<代码> jQuery。它具有等待和执行的能力。您可以在上找到更多详细信息

---

阅读和阅读。这个博客包含了一个关于延迟承诺的好例子。

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

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

我认为最好为自己创建一个add to queue函数，如下所示：

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);

---

对在第一个请求的回调中设置下一个请求。这是因为ajax请求的异步性质…使用ajax调用返回的

承诺。您可以根据需要并行、顺序或组合运行任何数字。使用回调将在代码中引入您可能不想要的依赖项。正如更新版本和Praveen Kumars下面的注释所表明的那样：我基本上想要一个检查请求，如果当前正在运行请求。如果不是，则触发请求，如果是，则请求应等待所有其他操作完成。我不能这样做，因为调用是由用户交互触发的。这可能是许多不同的地方。因此，这些调用必须保持独立。@JohannesKlauß那么，您可以使用
$.ajaxComplete
方法检查AJAX调用是否完成，然后继续下一个调用吗？不太可能，因为我不知道是否有下一个调用。我基本上需要一个请求来检查当前是否有正在运行的请求。如果不是，则触发请求，如果是，则请求应等待所有其他操作完成。啊！Grr。。。我放弃了。我需要想一个办法来做到这一点！：）几个月前，这给了我一段艰难的时光，这个解决方案为我解决了它，很高兴我能帮上忙！