Блог

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

     <input class="firebase" id="text1">
    <input class="firebase" id="text2">
    <input type="button" value="test" onclick="setData()">
  

Firebase, кажется, все настроено правильно. При нажатии кнопки отправки выполняется следующее:

     function setData()
    {
        docData = [];

        $('.firebase').each(function (index, value)
        {
            docData[$(this).attr('id')] = $(this).val();
        });

        console.log(docData);
        db.collection("test").doc("12345").set(Object.assign({}, docData));
    }
  

Пока это работает отлично, я вижу, как данные обновляются в режиме реального времени на моей консоли Firebase.

Тем не менее, я хотел бы, чтобы при обновлении документа firebase текстовые поля на странице для всех, кто просматривает страницу, автоматически обновлялись новыми значениями.

У меня нет узла.На моем веб-сайте установлен JS, и я даже не знаю, с чего начать его установку.

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

Если вы хотите оперативное обновление, просто используйте onSnapshot метод:

 db.collection("cities").doc("SF")
    .onSnapshot(function(doc) {
        console.log("Current data: ", doc.data());
    });
  

Для получения более подробной информации обратитесь к документации.