區間上的Ajax

Question

我在執行滯後和腳本時遇到了問題。

我有以下代碼：

$(function(){ 
    $("#results").html("Loading work order queue..."); 
    setInterval("showWorkOrders();", 15000) 
}); 

function showWorkOrders() 
{ 
     $.ajax({ 
      url: '/ajax/job_queue_ajax.php', 
      type: 'POST', 
      cache: false, 
      data: 'update=true', 
      success: function(data) 
      { 
       $("#results").html(data); 
       $('span#ref_msg').html(''); 
      }, 
      error: function() 
      { 
       a = new customModal('ajax'); 
       $("#results").html("<font class='msgDivError'>"+a.ajaxError+"</font>"); 
       $('span#ref_msg').html(''); 
      } 
    }); 
} 

我的後端PHP（只是一個例子）：

$SQL = MySQL_query("SELECT * FROM table") 
    while($data = MySQL_fetch_array($SQL)) 
    { 
     //// OUTPUTS A TABLE WITH INFORMATION 
    } 

現在，這件事有很多滯後但執行（需要很長的時間加載），並且有時會因爲加載時間過長而創建腳本錯誤。如果我延長刷新間隔，事情會變得更好（滯後），並且我不會收到執行錯誤。我需要一個短暫的時間間隔來滿足我的需求，但我無法弄清楚這樣做的有效方式。有關如何改善這一點的任何建議？

此外，而在於有清涼的頁面後，瀏覽器變到它鎖定點極其緩慢...

Answer 1

我會用setTimeout，而不是解決它：

$(function(){ 
    $("#results").html("Loading work order queue..."); 
    showWorkOrders(); 
}); 

function showWorkOrders() 
{ 
     $.ajax({ 
      url: '/ajax/job_queue_ajax.php', 
      type: 'POST', 
      cache: false, 
      data: 'update=true', 
      success: function(data) 
      { 
       $("#results").html(data); 
       $('span#ref_msg').html(''); 
         setTimeout("showWorkOrders();", 5000) 
      }, 
      error: function() 
      { 
       a = new customModal('ajax'); 
       $("#results").html("<font class='msgDivError'>"+a.ajaxError+"</font>"); 
       $('span#ref_msg').html(''); 
         setTimeout("showWorkOrders();", 5000) 
      } 
    }); 
} 

這意味着，它等待做一個新的Ajax請求之前，前一個可以採取多麼漫長就是了5秒。在再次嘗試之前仍然等待5秒鐘。

Answer 2

試試這個。僅在服務器響應後纔開始下一個請求。

$(function(){ 
    $("#results").html("Loading work order queue..."); 
    showWorkOrders(); 
}); 

function showWorkOrders() 
{ 
     $.ajax({ 
      url: '/ajax/job_queue_ajax.php', 
      type: 'POST', 
      cache: false, 
      data: 'update=true', 
      success: function(data) 
      { 
       $("#results").html(data); 
       $('span#ref_msg').html(''); 
      setTimeout(showWorkOrders, 15000); 

      }, 
      error: function() 
      { 
       a = new customModal('ajax'); 
       $("#results").html("<font class='msgDivError'>"+a.ajaxError+"</font>"); 
       $('span#ref_msg').html(''); 
       setTimeout(showWorkOrders, 15000) 
      } 
    }); 
} 

Answer 3

而不是間隔的Ajax，我會建議完成後的下一個Ajax。

由於ajax請求需要花費不確定的時間完成，因此我建議您在第一個請求完成時使用setTimeout()等來觸發下一個ajax請求，這樣您就不會一次發送多個ajax請求因此每個後續的Ajax調用都會從前一個Ajax調用完成時的已知時間開始。

你可能想解決，爲什麼你的服務器是這麼長時間來響應請求，但你也可以擴展爲Ajax調用超時如果你的服務器有時需要很長的時間來作出迴應：

function showWorkOrders() 
{ 
     $.ajax({ 
      timeout: 15000, 
      url: '/ajax/job_queue_ajax.php', 
      type: 'POST', 
      cache: false, 
      data: 'update=true', 
      success: function(data) 
      { 
       $("#results").html(data); 
       $('span#ref_msg').html(''); 
       setTimeout(showWorkOrders, 5000); 
      }, 
      error: function() 
      { 
       a = new customModal('ajax'); 
       $("#results").html("<font class='msgDivError'>"+a.ajaxError+"</font>"); 
       $('span#ref_msg').html(''); 
       setTimeout(showWorkOrders, 5000); 
      } 
    }); 
} 

$(function(){ 
    $("#results").html("Loading work order queue..."); 
    showWorkOrders(); 
});