Arbeiten Sie mit Datenlisten im Web

Holen Sie sich eine Datenbankreferenz

Um Daten aus der Datenbank zu lesen oder zu schreiben, benötigen Sie eine Instanz von firebase.database.Reference :

Web modular API

import { getDatabase } from "firebase/database";

const database = getDatabase();

Web namespaced API

var database = firebase.database();

Listen lesen und schreiben

An eine Datenliste anhängen

Verwenden Sie die Methode push() , um in Mehrbenutzeranwendungen Daten an eine Liste anzuhängen. Die push() Methode generiert jedes Mal einen eindeutigen Schlüssel, wenn der angegebenen Firebase-Referenz ein neues untergeordnetes Element hinzugefügt wird. Durch die Verwendung dieser automatisch generierten Schlüssel für jedes neue Element in der Liste können mehrere Clients gleichzeitig Kinder an derselben Position hinzufügen, ohne dass es zu Schreibkonflikten kommt. Der von push() generierte eindeutige Schlüssel basiert auf einem Zeitstempel, sodass Listenelemente automatisch chronologisch sortiert werden.

Sie können den Verweis auf die neuen Daten, die von der Methode push() zurückgegeben werden, verwenden, um den Wert des automatisch generierten Schlüssels des untergeordneten Elements abzurufen oder Daten für das untergeordnete Element festzulegen. Die .key Eigenschaft einer push() -Referenz enthält den automatisch generierten Schlüssel.

Sie können diese automatisch generierten Schlüssel verwenden, um die Reduzierung Ihrer Datenstruktur zu vereinfachen. Weitere Informationen finden Sie im Daten-Fanout- Beispiel .

Beispielsweise könnte push() verwendet werden, um einen neuen Beitrag zu einer Liste von Beiträgen in einer sozialen Anwendung hinzuzufügen:

Web modular API

import { getDatabase, ref, push, set } from "firebase/database";

// Create a new post reference with an auto-generated id
const db = getDatabase();
const postListRef = ref(db, 'posts');
const newPostRef = push(postListRef);
set(newPostRef, {
    // ...
});

Web namespaced API

// Create a new post reference with an auto-generated id
var postListRef = firebase.database().ref('posts');
var newPostRef = postListRef.push();
newPostRef.set({
    // ...
});

Achten Sie auf untergeordnete Ereignisse

Untergeordnete Ereignisse werden als Reaktion auf bestimmte Vorgänge ausgelöst, die den untergeordneten Knoten eines Knotens durch einen Vorgang widerfahren, z. B. das Hinzufügen eines neuen untergeordneten Knotens über die Methode push() oder die Aktualisierung eines untergeordneten Knotens über die Methode update() .

Ereignis Typische Verwendung
child_added Rufen Sie Artikellisten ab oder warten Sie auf Ergänzungen zu einer Artikelliste. Dieses Ereignis wird einmal für jedes vorhandene untergeordnete Element und jedes Mal erneut ausgelöst, wenn dem angegebenen Pfad ein neues untergeordnetes Element hinzugefügt wird. Dem Listener wird ein Snapshot übergeben, der die Daten des neuen untergeordneten Elements enthält.
child_changed Achten Sie auf Änderungen an den Elementen in einer Liste. Dieses Ereignis wird jedes Mal ausgelöst, wenn ein untergeordneter Knoten geändert wird. Dazu gehören alle Änderungen an Nachkommen des untergeordneten Knotens. Der an den Ereignis-Listener übergebene Snapshot enthält die aktualisierten Daten für das untergeordnete Element.
child_removed Achten Sie auf Elemente, die aus einer Liste entfernt werden. Dieses Ereignis wird ausgelöst, wenn ein unmittelbar untergeordnetes Element entfernt wird. Der an den Rückrufblock übergebene Snapshot enthält die Daten für das entfernte untergeordnete Element.
child_moved Achten Sie auf Änderungen in der Reihenfolge der Elemente in einer geordneten Liste. child_moved Ereignisse folgen immer dem child_changed Ereignis, das die Änderung der Reihenfolge des Elements verursacht hat (basierend auf Ihrer aktuellen Order-By-Methode).

Beides zusammen kann nützlich sein, um Änderungen an einem bestimmten Knoten in einer Datenbank abzuhören. Beispielsweise könnte eine Social-Blogging-App diese Methoden zusammen verwenden, um die Aktivität in den Kommentaren eines Beitrags zu überwachen, wie unten gezeigt:

Web modular API

import { getDatabase, ref, onChildAdded, onChildChanged, onChildRemoved } from "firebase/database";

const db = getDatabase();
const commentsRef = ref(db, 'post-comments/' + postId);
onChildAdded(commentsRef, (data) => {
  addCommentElement(postElement, data.key, data.val().text, data.val().author);
});

onChildChanged(commentsRef, (data) => {
  setCommentValues(postElement, data.key, data.val().text, data.val().author);
});

onChildRemoved(commentsRef, (data) => {
  deleteComment(postElement, data.key);
});

Web namespaced API

var commentsRef = firebase.database().ref('post-comments/' + postId);
commentsRef.on('child_added', (data) => {
  addCommentElement(postElement, data.key, data.val().text, data.val().author);
});

commentsRef.on('child_changed', (data) => {
  setCommentValues(postElement, data.key, data.val().text, data.val().author);
});

commentsRef.on('child_removed', (data) => {
  deleteComment(postElement, data.key);
});

Achten Sie auf Wertereignisse

Während die Überwachung auf untergeordnete Ereignisse die empfohlene Methode zum Lesen von Datenlisten ist, gibt es Situationen, in denen die Überwachung auf Wertereignisse in einer Listenreferenz nützlich ist.

Wenn Sie einer Datenliste einen value hinzufügen, wird die gesamte Datenliste als einzelner Snapshot zurückgegeben, den Sie dann durchlaufen können, um auf einzelne untergeordnete Elemente zuzugreifen.

Selbst wenn es nur eine einzige Übereinstimmung für die Abfrage gibt, ist der Snapshot immer noch eine Liste; es enthält nur ein einzelnes Element. Um auf das Element zuzugreifen, müssen Sie das Ergebnis durchlaufen:

Web modular API

import { getDatabase, ref, onValue } from "firebase/database";

const db = getDatabase();
const dbRef = ref(db, '/a/b/c');

onValue(dbRef, (snapshot) => {
  snapshot.forEach((childSnapshot) => {
    const childKey = childSnapshot.key;
    const childData = childSnapshot.val();
    // ...
  });
}, {
  onlyOnce: true
});

Web namespaced API

ref.once('value', (snapshot) => {
  snapshot.forEach((childSnapshot) => {
    var childKey = childSnapshot.key;
    var childData = childSnapshot.val();
    // ...
  });
});

Dieses Muster kann nützlich sein, wenn Sie alle untergeordneten Elemente einer Liste in einem einzigen Vorgang abrufen möchten, anstatt auf zusätzliche untergeordnete hinzugefügte Ereignisse zu warten.

Daten sortieren und filtern

Sie können die Klasse „Realtime Database Query verwenden, um nach Schlüssel, Wert oder Wert eines untergeordneten Elements sortierte Daten abzurufen. Sie können das sortierte Ergebnis auch nach einer bestimmten Anzahl von Ergebnissen oder einem Bereich von Schlüsseln oder Werten filtern.

Daten sortieren

Um sortierte Daten abzurufen, geben Sie zunächst eine der Order-by-Methoden an, um zu bestimmen, wie die Ergebnisse sortiert werden:

Methode Verwendung
orderByChild() Ordnen Sie die Ergebnisse nach dem Wert eines angegebenen untergeordneten Schlüssels oder eines verschachtelten untergeordneten Pfads.
orderByKey() Sortieren Sie die Ergebnisse nach untergeordneten Schlüsseln.
orderByValue() Sortieren Sie die Ergebnisse nach untergeordneten Werten.

Sie können jeweils nur eine Order-By-Methode verwenden. Der mehrmalige Aufruf einer Order-By-Methode in derselben Abfrage führt zu einem Fehler.

Das folgende Beispiel zeigt, wie Sie eine Liste der Top-Beiträge eines Benutzers, sortiert nach der Anzahl der Sterne, abrufen können:

Web modular API

import { getDatabase, ref, query, orderByChild } from "firebase/database";
import { getAuth } from "firebase/auth";

const db = getDatabase();
const auth = getAuth();

const myUserId = auth.currentUser.uid;
const topUserPostsRef = query(ref(db, 'user-posts/' + myUserId), orderByChild('starCount'));

Web namespaced API

var myUserId = firebase.auth().currentUser.uid;
var topUserPostsRef = firebase.database().ref('user-posts/' + myUserId).orderByChild('starCount');

Dies definiert eine Abfrage, die in Kombination mit einem untergeordneten Listener den Client mit den Beiträgen des Benutzers aus dem Pfad in der Datenbank basierend auf seiner Benutzer-ID synchronisiert, geordnet nach der Anzahl der Sterne, die jeder Beitrag erhalten hat. Diese Technik, bei der IDs als Indexschlüssel verwendet werden, wird als Daten-Fan-Out bezeichnet. Weitere Informationen dazu finden Sie unter „Strukturieren Sie Ihre Datenbank“ .

Der Aufruf der Methode orderByChild() gibt den untergeordneten Schlüssel an, nach dem die Ergebnisse sortiert werden sollen. In diesem Fall werden die Beiträge nach dem Wert ihres jeweiligen "starCount" -Kinds sortiert. Abfragen können auch nach verschachtelten untergeordneten Elementen sortiert werden, falls Sie Daten haben, die wie folgt aussehen:

"posts": {
  "ts-functions": {
    "metrics": {
      "views" : 1200000,
      "likes" : 251000,
      "shares": 1200,
    },
    "title" : "Why you should use TypeScript for writing Cloud Functions",
    "author": "Doug",
  },
  "android-arch-3": {
    "metrics": {
      "views" : 900000,
      "likes" : 117000,
      "shares": 144,
    },
    "title" : "Using Android Architecture Components with Firebase Realtime Database (Part 3)",
    "author": "Doug",
  }
},

In diesem Fall können wir unsere Listenelemente nach Werten ordnen, die unter dem Schlüssel metrics verschachtelt sind, indem wir in unserem orderByChild() Aufruf den relativen Pfad zum verschachtelten untergeordneten Element angeben.

Web modular API

import { getDatabase, ref, query, orderByChild } from "firebase/database";

const db = getDatabase();
const mostViewedPosts = query(ref(db, 'posts'), orderByChild('metrics/views'));

Web namespaced API

var mostViewedPosts = firebase.database().ref('posts').orderByChild('metrics/views');

Weitere Informationen zur Reihenfolge anderer Datentypen finden Sie unter Reihenfolge der Abfragedaten .

Daten filtern

Um Daten zu filtern, können Sie beim Erstellen einer Abfrage jede der Limit- oder Range-Methoden mit einer Order-By-Methode kombinieren.

Methode Verwendung
limitToFirst() Legt die maximale Anzahl von Elementen fest, die vom Anfang der geordneten Ergebnisliste zurückgegeben werden sollen.
limitToLast() Legt die maximale Anzahl von Elementen fest, die vom Ende der geordneten Ergebnisliste zurückgegeben werden sollen.
startAt() Gibt Elemente zurück, die größer oder gleich dem angegebenen Schlüssel oder Wert sind, abhängig von der gewählten Sortiermethode.
startAfter() Gibt Elemente zurück, die größer als der angegebene Schlüssel oder Wert sind, abhängig von der gewählten Sortiermethode.
endAt() Gibt Elemente zurück, die kleiner oder gleich dem angegebenen Schlüssel oder Wert sind, abhängig von der gewählten Sortiermethode.
endBefore() Gibt Elemente zurück, die kleiner als der angegebene Schlüssel oder Wert sind, abhängig von der gewählten Sortiermethode.
equalTo() Gibt Elemente zurück, die dem angegebenen Schlüssel oder Wert entsprechen, abhängig von der gewählten Sortiermethode.

Im Gegensatz zu den Order-by-Methoden können Sie mehrere Grenzwert- oder Bereichsfunktionen kombinieren. Beispielsweise können Sie die Methoden startAt() und endAt() kombinieren, um die Ergebnisse auf einen angegebenen Wertebereich zu beschränken.

Begrenzen Sie die Anzahl der Ergebnisse

Sie können die Methoden limitToFirst() und limitToLast() verwenden, um eine maximale Anzahl von untergeordneten Elementen festzulegen, die für ein bestimmtes Ereignis synchronisiert werden sollen. Wenn Sie beispielsweise mit limitToFirst() ein Limit von 100 festlegen, erhalten Sie zunächst nur bis zu 100 child_added Ereignisse. Wenn in Ihrer Firebase-Datenbank weniger als 100 Elemente gespeichert sind, wird für jedes Element ein child_added -Ereignis ausgelöst.

Wenn sich Elemente ändern, erhalten Sie child_added “-Ereignisse für Elemente, die in die Abfrage aufgenommen werden, und child_removed -Ereignisse für Elemente, die aus der Abfrage herausfallen, sodass die Gesamtzahl bei 100 bleibt.

Das folgende Beispiel zeigt, wie eine Beispiel-Blogging-App eine Abfrage definiert, um eine Liste der 100 neuesten Beiträge aller Benutzer abzurufen:

Web modular API

import { getDatabase, ref, query, limitToLast } from "firebase/database";

const db = getDatabase();
const recentPostsRef = query(ref(db, 'posts'), limitToLast(100));

Web namespaced API

var recentPostsRef = firebase.database().ref('posts').limitToLast(100);

In diesem Beispiel wird nur eine Abfrage definiert. Um Daten tatsächlich zu synchronisieren, muss ein Listener angehängt sein.

Nach Schlüssel oder Wert filtern

Sie können startAt() , startAfter() , endAt() , endBefore() und equalTo() verwenden, um beliebige Start-, End- und Äquivalenzpunkte für Abfragen auszuwählen. Dies kann nützlich sein, um Daten zu paginieren oder Elemente mit untergeordneten Elementen zu finden, die einen bestimmten Wert haben.

So werden Abfragedaten geordnet

In diesem Abschnitt wird erläutert, wie Daten durch die einzelnen Order-by-Methoden in der Query Klasse sortiert werden.

orderByChild

Bei Verwendung von orderByChild() werden Daten, die den angegebenen untergeordneten Schlüssel enthalten, wie folgt sortiert:

  1. Kinder mit einem null für den angegebenen Kinderschlüssel stehen an erster Stelle.
  2. Als nächstes folgen Kinder mit dem Wert false für den angegebenen Kinderschlüssel. Wenn mehrere untergeordnete Elemente den Wert false haben, werden sie lexikografisch nach Schlüssel sortiert.
  3. Als nächstes folgen Kinder mit dem Wert true für den angegebenen Kinderschlüssel. Wenn mehrere untergeordnete Elemente den Wert true haben, werden sie lexikografisch nach Schlüssel sortiert.
  4. Als nächstes folgen Kinder mit einem numerischen Wert, sortiert in aufsteigender Reihenfolge. Wenn mehrere untergeordnete Knoten denselben numerischen Wert für den angegebenen untergeordneten Knoten haben, werden sie nach Schlüssel sortiert.
  5. Zeichenfolgen kommen nach Zahlen und werden lexikografisch in aufsteigender Reihenfolge sortiert. Wenn mehrere untergeordnete Knoten denselben Wert für den angegebenen untergeordneten Knoten haben, werden sie lexikografisch nach Schlüssel sortiert.
  6. Die Objekte stehen an letzter Stelle und werden lexikografisch nach Schlüssel in aufsteigender Reihenfolge sortiert.

orderByKey

Wenn Sie orderByKey() zum Sortieren Ihrer Daten verwenden, werden die Daten in aufsteigender Reihenfolge nach Schlüssel zurückgegeben.

  1. Kinder mit einem Schlüssel, der als 32-Bit-Ganzzahl geparst werden kann, stehen an erster Stelle und werden in aufsteigender Reihenfolge sortiert.
  2. Als nächstes folgen Kinder mit einem Zeichenfolgenwert als Schlüssel, lexikografisch in aufsteigender Reihenfolge sortiert.

orderByValue

Bei Verwendung von orderByValue() werden untergeordnete Elemente nach ihrem Wert sortiert. Die Sortierkriterien sind dieselben wie in orderByChild() , außer dass der Wert des Knotens anstelle des Werts eines angegebenen untergeordneten Schlüssels verwendet wird.

Trennen Sie Zuhörer ab

Rückrufe werden entfernt, indem Sie die Methode off() in Ihrer Firebase-Datenbankreferenz aufrufen.

Sie können einen einzelnen Listener entfernen, indem Sie ihn als Parameter an off() übergeben. Durch den Aufruf von off() an der Position ohne Argumente werden alle Listener an dieser Position entfernt.

Durch den Aufruf von off() für einen übergeordneten Listener werden die auf seinen untergeordneten Knoten registrierten Listener nicht automatisch entfernt. off() muss auch für alle untergeordneten Listener aufgerufen werden, um den Rückruf zu entfernen.

Nächste Schritte