Как обновить HTML без перезагрузки страницы каждый раз, когда я получаю новую запись базы данных - PullRequest
Новая
       18

Как обновить HTML без перезагрузки страницы каждый раз, когда я получаю новую запись базы данных

1 голос
/ 24 апреля 2019

Я настраиваю сервер node.js, который постоянно проверяет базу данных mongo на наличие новых записей. Если появляется новая запись, сайт html должен обновляться без перезагрузки и с данными из базы данных.

Я уже могу получать данные каждый раз, когда создается новая запись, но я не могу обновить сайт. Я посмотрел некоторые возможные инструменты, такие как ajax или Reaction.js, но я просто не могу найти идеальное решение (или даже решение), как это могло бы работать.

Подключение к Mongodb и получение данных 

MongoClient.connect('mongodb://192.168.128.128:27017/familientag', function(err, client) {
  if (err) {
    console.error('An error occurred connecting to MongoDB: ', err);
  } else {
    const db = client.db("familientag")
    const collection = db.collection('data');
    console.log("Connected successfully to server");

    const changeStream = collection.watch();
    changeStream.on('change', next => {
      console.log(next.fullDocument['name']);
      // Here I receive the data "_id" and "name"
    });
  }
});

Мой index.ejs 

<!DOCTYPE html>
<html>
    <head>
        <title>Dies ist ein Test</title>
    </head>
    <body>
        <div id="target">
        </div>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script>
            $.ajax({
                type: 'GET',
                url: '/test',
                success: function(data) {
                    var html = data;
                    $('#target').html(html);
                }
            });
        </script>
    </body>
</html>

индекс вызова 

app.get('/index', function (req, res) {
  res.render('index');
});

Я ожидаю увидеть имя на сайте индекса каждый раз, когда новый набор данных будет прочитан из БД без перезагрузки окна.

1 Ответ

2 голосов
/ 24 апреля 2019

Использование открытой розетки должно помочь вам. Вы можете либо передать новые данные в тело сокета, либо просто вызвать интерфейс пользователя для запроса данных из API.

Я бы порекомендовал взглянуть на socket.io: https://socket.io/, чтобы начать работу очень быстро. Это гибкая структура сокетов для узлов с блестящими документами.

Pusher - отличный вариант, если вы хотите самостоятельно управлять меньшим количеством сокетов. Поставляется с собственным интерфейсом. https://pusher.com/

...