Ajax на интервале

У меня проблемы с задержкой и выполнением скрипта.

У меня есть следующий код:

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

Мой backend PHP (только пример):

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

Теперь все это выполняется, однако, с большим отставанием (занимает очень много времени для загрузки), а иногда создает ошибку сценария, потому что загрузка слишком долго. Если я продлеваю интервал обновления, все начинает становиться лучше (отставание остается), и я не получаю ошибку выполнения. Мне нужен короткий промежуток времени для того, что мне нужно, но я не могу найти эффективный способ сделать это. Любые предложения о том, как улучшить это?

Кроме того, через некоторое время, находясь на странице с обновлением, браузер становится очень медленным до того момента, когда он блокируется …

Я бы решил его использовать вместо 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) } }); } 

Это означало бы, что он ждет 5 секунд, прежде чем делать новый запрос ajax, предыдущий может занять сколько угодно времени. Все еще ждет 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, 15000); }, error: function() { a = new customModal('ajax'); $("#results").html("<font class='msgDivError'>"+a.ajaxError+"</font>"); $('span#ref_msg').html(''); setTimeout(showWorkOrders, 15000) } }); } 

Вместо Ajax на интервале я предлагаю следующий Ajax после завершения.

Поскольку для запроса ajax требуется неопределенное количество времени, я бы предположил, что вы запускаете следующий запрос ajax, когда первый завершает использование setTimeout() и так далее, так, чтобы у вас никогда не было нескольких запросов 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(); });