Как подгружать данные ajax с setInterval?

Здравствуйте, я делаю свой ajax запрос и получаю все свои данные, но мне нужно чтобы когда в бд появлялись новый записи, то на страницу автоматом подгружалась новая запись! Как это можно реализовать правильно?
Вот мой ajax:
window.onload = () => {
                $.ajax({
                    type: "GET",
                    url: "/feed/ajax",
                    dataType: 'json',
                    success: function (data) {
                        if (data) {
                            const feedC = document.querySelector('.itemFeed')

                            data.forEach((arrayItem) => {
                                if (typeof arrayItem === 'object') {


                                    const createFeedItem = document.createElement("div")
                                    const feedI = createFeedItem.className = 'feed__container'
                                    feedC.append(createFeedItem)


                                    createFeedItem.innerHTML = '<img src="../../assets/image/feed/' + arrayItem.image + '">' +
                                        '<div class="name_feed"><a href="feed/article/' + arrayItem.uid + '">'+ arrayItem.name +'</a></div>' +
                                        '</div>'


                                }
                            })
                        }
                    },
                    error: function (r) {
                        console.log(r)
                        alert("Ошибка ajax");
                    }
                });
        }
  • Вопрос задан
  • 143 просмотра
Пригласить эксперта
Ответы на вопрос 2
@eandr_67
web-программист (*AMP, Go, JavaScript, вёрстка).
Да, можно использовать и AJAX (посылая запросы раз в несколько секунд), но всё же для для таких задач есть специально предназначенные для этого механизмы:
https://learn.javascript.ru/network - пункты 10, 11, 12

AJAX-вариант - раз в 5 секунд:
let busy = false; // чтобы не накладывать запросы друг на друга
setInterval(function() {
  if (busy) { return; }
  busy = true;
  $.ajax({
    ...
    success: function (data) {
       ...
       busy = false;
    },
    error: function (r) {
       ...
       busy = false;
    }
  });
}, 5000);

Предложенный в комментариях вариант через setTimeout:
(function load() {
  $.ajax({
    ...
    success: function (data) {
       ...
       setTimeout(load, 5000);
    },
    error: function (r) {
       ...
       setTimeout(load, 5000);
    }
  });
})();
Ответ написан
XBEHOLI
@XBEHOLI
back-end developer
Обновлять body раз в 3 секунды. Читайте про setInterval, если не хотите юзать сокеты, но нагрузка будет большая
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Artezio Нижний Новгород
от 130 000 до 180 000 ₽
Intspirit Краснодар
от 80 000 до 150 000 ₽
Artezio Москва
от 160 000 до 220 000 ₽