ajax - 延迟 GET 直到所有 POST 方法都完成，而不是刚刚开始

Question

我在 jQuery 记录插入过程中遇到了两个问题，我希望这个很棒的 SO 社区可以帮助我解决至少一个这些问题。这些是问题:

问题 1 - 间歇性服务器延迟

第一个问题是我的 Ubuntu 10.04 服务器在向 mySQL 数据库执行 POST 数据时似乎出现间歇性的 4.5 秒延迟。大多数 POST 命令都在正常的毫秒数内执行，但是当发生延迟时，它似乎总是大约 4.5 秒。这不是一个繁忙的公共(public)服务器，所以它不应该是服务器负载的问题。这些简短的视频演示了我要解释的内容:

Video 1 Video 2

我已经在 serverfault 上发布了一个问题并且正在等待来自该论坛的一些输入，这可能更适合这个问题 1。

问题 2 - jQuery POST 和 GET 方法的计时

我试图解决的真正问题是在所有对 POST 的调用都完成 之前阻止对 GET 的调用。目前，我已经实现了$.when.apply 来延迟发送GET。这是相关代码:

function(){
  $.when.apply(undefined, InsertTheAPPs()).done(function (){
    $.ajax({
      url: sURL + "fileappeal/send_apps_email",
      success: function() {
        var m = $.msg("my message",
        {header:'my header', live:10000});
        setTimeout(function(){
          if(m)m.setBody('...my other message.');
        },3000);
        setTimeout(function(){
          if(m)m.close(function(){
              window.location.replace(sURL+'client/view');
          });
        },6000);
        $('#ajaxShield').fadeOut(1000);
      },
      error: function(){
          $.msg("error message",
          {header:'error header', live:10000});
      }
    });
  });
}

我的问题是由于问题 1 中的上述延迟引起的。GET 方法在所有 POST 方法都开始，但我需要 GET 方法等待所有 POST 方法都结束。这是我需要帮助的问题。基本上，这里发生的错误是在所有记录都完全插入 mySQL 数据库之前发送了我的确认电子邮件。

这里是 jQuery $.each 循环的代码。这是不仅需要开始，而且还必须在对上面的 fileappeal/send_apps_email 进行 ajax 调用之前结束的代码:

function InsertTheAPPs(){
  $('input[name=c_maybe].c_box').each(function(){
    var jqxhrs = [];
    if($(this).prop('checked')){
      var rn = $(this).prop('value');
      jqxhrs.push(
        $.ajax({
          url: sURL + 'fileappeal/insert_app',
          type:"POST",
          dataType: 'text',
          data: {'rn': rn},
          error: function(data) {console.log('Error:'+rn+'_'+data);}
        })
      )
    return jqxhrs;
    }
  });
}

有人对我如何解决服务器延迟问题以及如何在所有 POST 方法完成之前阻止对 GET 的调用有任何建议吗？谢谢。

Answer 1

您的帖子有一个小问题。解决后，这篇文章应该可以帮助您完成代码:jQuery Deferred - waiting for multiple AJAX requests to finish

您在 .each 中返回，但函数本身不返回任何内容。所以你的延迟没有得到等待的ajax调用数组。而且，由于您的 jqhrs 是在每个内部定义的，因此范围是每个 c_box 的每次迭代。您的方法应如下所示:

function InsertTheAPPs(){
    var jqxhrs = [];

    $('input[name=c_maybe].c_box').each(function(){         
        if($(this).prop('checked')){ 
            var rn = $(this).prop('value'); 
            jqxhrs.push(
                $.ajax({
                    url: sURL + 'fileappeal/insert_app',
                    type:"POST",
                    dataType: 'text',
                    data: {'rn': rn},
                    error: function(data) {console.log('Error:'+rn+'_'+data);}
                })
            )
        }
    });

    return jqxhrs;
} 

您还可以使您的代码更简单。由于您只想知道是否检查了某些内容，您可以使用 jquery 伪类过滤器 :checked 例如:

function InsertTheAPPs(){
    var jqxhrs = [];

    $('input[name=c_maybe].c_box').filter(':checked').each(function(){         
        var rn = $(this).prop('value'); 
        jqxhrs.push(
            $.ajax({
                url: sURL + 'fileappeal/insert_app',
                type:"POST",
                dataType: 'text',
                data: {'rn': rn},
                error: function(data) {console.log('Error:'+rn+'_'+data);}
            })
        )
    });

    return jqxhrs;
} 

您可以将 :checked 上的过滤器组合到主过滤器中，例如 $('input[name=c_maybe].c_box:checked') 但我把它留了下来以长格式真正展示正在发生的事情。