循环中与 ajax 的同步请求 - Synchronous request with ajax in a loop

Synchronous request with ajax in a loop

本文关键字：同步请求 ajax 循环 | 更新日期: 2023-09-27

我有一个包含ajax请求的for循环。请求正在按时工作。所以我无法及时到达请求的结果。如何在不使用任何库的情况下解决此问题？谢谢。

    var availables = document.getElementsByClassName("available");
    for(var i=0;i<availables.length;i++){
        var element = availables[i];
        var xmlhttp;
        if(window.XMLHttpRequest)
            xmlhttp = new XMLHttpRequest;
        else
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        xmlhttp.open("GET", "control.php?user=" + element.innerText, true);
        xmlhttp.send();
        xmlhttp.onreadystatechange = function(){
            if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
                var result = xmlhttp.responseText;
                console.log(result);
                element.setAttribute("class" , "result available " + result);
                if(result == "online")
                    element.innerHTML = "<a href='"http://twitter.com/" + element.innerText + "'">" + element.innerText + "</a>";   
            }
        }
    }

首先，我建议在执行xmlhttp.open和xmlhttp.send之前放置xmlhttp.onreadystatechange函数。它可能正在发送和返回，并且由于它是异步运行的，因此它会在您准备好状态更改函数之前返回可以定义/执行。类似的东西。

无论如何，您始终可以通过将 xmlhttp.open 中的最后一个参数设置为 false 来同步完成所有操作。这将使javascript在xmlhttp.send之后等待继续，但无论哪种方式，您仍然需要在打开和发送之前放置onreadystatechange。

    var availables = document.getElementsByClassName("available");
for(var i=0;i<availables.length;i++){
    var element = availables[i];
    var xmlhttp;
    if(window.XMLHttpRequest)
        xmlhttp = new XMLHttpRequest;
    else
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    xmlhttp.onreadystatechange = function(){
        if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
            var result = xmlhttp.responseText;
            console.log(result);
            element.setAttribute("class" , "result available " + result);
            if(result == "online")
                element.innerHTML = "<a href='"http://twitter.com/" + element.innerText + "'">" + element.innerText + "</a>";   
        }
    }
    xmlhttp.open("GET", "control.php?user=" + element.innerText, true);
  //xmlhttp.open("GET", "control.php?user=" + element.innerText, false); //If you want to do it synchronously
    xmlhttp.send();
}

xmlhttp.open("GET", "control.php?user=" + element.innerText, true)同步进行 ajax 调用是非常糟糕的做法，因为在 ajax 请求结束之前无法与应用程序交互。我认为在您的情况下，最好在前一个请求的onreadystatechange回调中发送每个下一个请求。