如何按照请求的顺序处理 jquery ajax 请求

How to process jquery ajax requests in the order they were requested

本文关键字：请求 jquery ajax 顺序处理 何按照      更新时间：2023-09-26

我正在制作一个java servlet页面，用于检查域名列表，并通过jquery ajax请求检查每个名称。 它工作正常，除了结果被无序地附加到 DOM 中。 按请求顺序处理请求的最佳方法是什么，但也像长轮询效果一样异步处理。我是javascript的新手。

这是我用于请求的代码：

$.ajax({
    async:true,
    type:'GET',
    url:servlet,
    success:function(data){
        $('p').append(data+"<br>");
    }, 
});

我正在考虑向java servlet发送一个序列号，它将通过JSON返回它，但我想知道是否有更简单的方法。

我要做的是提前为响应创建容器，然后围绕它绑定回调（实际上不像 bind（） 函数那样绑定）。

例如，假设您有一个类似于 <div id="container"></div> 的容器，您可以执行以下操作：

function makeRequest(something) {
    var target = $("<div></div>");
    $("#container").append(target);
    $.get("", {something: something}, function(data) {
        target.html(data);
    });
}

就灵活性而言，这是一个相当糟糕的例子，但它应该说明这一点。 它在发出请求之前将div 添加到容器中，然后使用该div 将响应推送到其中。 这意味着div 将按发出请求的顺序附加。 您可以将这个想法扩展到使用样式来使其看起来像div 在填充它们之前不存在，或者您可以在其中显示"正在加载"消息。

（此外，something参数的数据传递相当糟糕，但希望您明白这一点。

我猜你的问题是浏览器向服务器发送尽可能多的 AJAX 请求，服务器会尽可能多地回答它们。 服务器很可能只是比其他服务器更快地响应某些请求，因此尽管请求是按顺序发送的，但您会将它们弄乱顺序。

解决此问题的方法是按顺序发送查询，以确保返回的答案是顺序的。 本质上，执行一个 AJAX 调用，在该调用成功后，您启动第二个 AJAX 调用，依此类推......

您可以对发送到服务器的请求进行排序，缓存结果，并仅按顺序添加它们

next_to_request = 0;
next_to_append = 0;
results = [];
function reqToServer(){
  var e = next_to_request++;
  $.ajax({
    async:true,
    type:'GET',
    url:servlet,
    success:function(data){
        results[e] = data;
    }, 
  }); 
function loadAnswers(){
   if (results[next_to_request]){
     data = results[next_to_request];
     next_to_request++;
     $('p').append(data+"<br>");
   }
}
setTimeout(100, loadAnswers);

这有一个不同的线程来显示结果，并且仅以正确的顺序显示。

从 Ajax 函数本身中取出成功函数，并将成功函数链接起来，它们将按顺序触发，如果一个请求尚未完成，它将等待它完成，然后再触发下一个请求。

一个非常简单的方法是这样做：

var firstOne = $.ajax({
    async:true,
    type:'GET',
    url:servlet
}); 
var SecondOne = $.ajax({
    async:true,
    type:'GET',
    url:servlet
}); 
firstOne.done(function(data){
    $('p').append(data+"<br>");
    SecondOne.done(function(data){
        $('p').append(data+"<br>");
    }); 
});

对于更高级的方法，学习承诺如何运作是个好主意！

这比顺序发送 ajax 请求要快得多，在下一个请求开始之前等待最后一个请求完成，因为这将在浏览器可用时发送所有请求，并且链接 done（） 函数将等待任何未完成的请求，只需执行完成的请求，当它们按照您放入的顺序到达它们时立即执行， 然后内容将以正确的顺序附加。如果做很多 ajax 调用，使用 promise 和 $.when/$.then 会让你通过迭代等构建一个更合理的函数。

相关文章：