Ajax on interval

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를 사용하여 해결할 : 이것은 새로운 아약스 요청을하기 전에, 이전 그러나 오래가 원하는 걸릴 수 5 초를 대기하는 의미

$(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) 
      } 
    }); 
} 

. 다시 시도하기 전에 아직 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를 제안합니다.

완료하려면 아약스 요청에 시간이 너무 오래 걸리기 때문에 첫 번째 완료시 setTimeout() 등을 사용하여 다음 아약스 요청을 트리거하는 것이 좋습니다. 이와 같이 한 번에 여러 개의 아약스 요청을 수행 할 필요가 없습니다. 이후의 각 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(); 
});