У меня проблема с автоматическим обновлением контента на веб-странице

Question

Я создаю веб-страницу, которая будет автоматически обновлять контент, чтобы всегда получать последние данные в базе данных.Это мой код в Javascript.

setInterval(function() {
    $("#status").load('refresh.php');
},1000);

В моем javascript я автоматически обновляю #status с помощью refresh.php каждую секунду.

Но когда я проверяю элемент моей веб-страницыи нажмите на сеть.Он также запрашивает (спамит) файл refresh.php каждую секунду, что я считаю плохой практикой.

Можете ли вы помочь мне, как это исправить?Или вы можете предложить лучший код ajax для автоматического обновления содержимого без чрезмерного запроса php-файла?

Answer 1

Этот код будет запрашиваться refresh.php позже при timeouts.min каждый раз, когда новое (запрошенное) значение #status равно текущему.Если значения отличаются, следующий таймаут снова будет timeouts.min.

var timeouts={
 min:1000, // min await timeout = 1s
 max:16000 // max await timeout = 16s
};
var currentTo = timeouts.min;

function setAutoRefresh( to ){
  setTimeout( function() {
    var current = $("#status").text();// or .html()
    $("#status").load('refresh.php', function() {
      // if we are load a new value
      if( current !== $("#status").text()) {
        currentTo = timeouts.min;
      // if loaded value are same to current
      } else {
        currentTo += timeouts.min; // or currentTo *= 2; for example
        if( currentTo > timeouts.max ){
          currentTo = timeouts.max;
        }
      }
      console.log('Next #status refresh after ' + currentTo + 'ms');
      // Set a new timeout
      setAutoRefresh( currentTo );
    });
  }, to);
}

// Set the first timeout
setAutoRefresh( timeouts.min );

Answer 2

Вам, вероятно, следует использовать для этого веб-сокет, получить последний статус в виде данных с сервера, а затем изменить только этот раздел страницы, используя javascript