Wie zeigt man Echtzeitdaten für alle Benutzer, die react und firebase verwenden?

Question

Ich baue eine Messaging-App, die in Echtzeit aktualisiert. Bisher kann ich mich mit Google anmelden und eine Nachricht posten und dann wird diese Nachricht auf dem Bildschirm angezeigt. Wenn ich mich jedoch über ein anderes Google-Konto anmelde (die App wird auf dem Heroku gehostet) und eine Nachricht als userB posten, wird BenutzerA diese Nachricht erst auf ihrem Bildschirm sehen, wenn sie die Seite aktualisiert hat. Was ist der beste Weg, um alle Bildschirme in Echtzeit zu aktualisieren, so dass die Leute tatsächlich eine Unterhaltung in Echtzeit haben können.

Jede Nachricht wird gepostet und in der Firebase gespeichert. Meine einzige Lösung erfordert bisher die Verwendung der JavaScript-Methode setInterval und das Ziehen aus der Datenbank alle 3-5 Sekunden. Das funktionierte, aber es verursachte eine sehr langsame und langsame App und eine schlechte Erfahrung. alle Hinweise/Tipps sind willkommen

Answer 1

Es gibt eine Menge Möglichkeiten, dies zu tun. Im Allgemeinen möchten Sie vom Server benachrichtigt werden, sobald eine neue Nachricht eingegangen ist und nicht alle X Sekunden den Server anpingen muss.

Sie auf diese aussehen könnte:

1. socket.io und mehr über websockets im Allgemeinen
2. Ein schöner list of existing chat apps, die, könnte dies sein, um die Art und Weise nutzen zu gehen reagieren
3. Google's cloud messaging, wie Sie bereits Feuerbasis verwenden für dich hier.

Dies sollte Sie in die richtige Richtung führen.

Answer 2

Sie verwenden die Firebase und eines der Hauptmerkmale ist die Echtzeitdatenbank. Firebase teilt Ihnen automatisch mit, wenn sich Ihre JSON-Datenbank ändert. Sie müssen die Anfrage nicht im Intervall basic senden.

Sie können sich beziehen Zero to App: Develop with Firebase - Google I/O 2016 Es ist auch eine Messaging-App-Demo von Google Guys.

Sie können die sample source code in Github zum Senden und Empfangen der Nachricht in Echtzeit finden.