Cloud Firestore Web-Codelab

Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

1. Übersicht

Ziele

In diesem Codelab erstellen Sie eine von Cloud Firestore bereitgestellte Web-App für Restaurantempfehlungen .

img5.png

Was Sie lernen werden

  • Lesen und schreiben Sie Daten von einer Web-App in Cloud Firestore
  • Hören Sie sich Änderungen in Cloud Firestore-Daten in Echtzeit an
  • Verwenden Sie die Firebase-Authentifizierung und Sicherheitsregeln, um Cloud Firestore-Daten zu sichern
  • Schreiben Sie komplexe Cloud Firestore-Abfragen

Was du brauchen wirst

Bevor Sie dieses Codelab starten, vergewissern Sie sich, dass Sie Folgendes installiert haben:

2. Erstellen und richten Sie ein Firebase-Projekt ein

Erstellen Sie ein Firebase-Projekt

  1. Klicken Sie in der Firebase-Konsole auf Projekt hinzufügen und nennen Sie das Firebase-Projekt FriendlyEats .

Merken Sie sich die Projekt-ID für Ihr Firebase-Projekt.

  1. Klicken Sie auf Projekt erstellen .

Die Anwendung, die wir erstellen werden, verwendet einige im Internet verfügbare Firebase-Dienste:

  • Firebase-Authentifizierung zur einfachen Identifizierung Ihrer Benutzer
  • Cloud Firestore , um strukturierte Daten in der Cloud zu speichern und sofort benachrichtigt zu werden, wenn die Daten aktualisiert werden
  • Firebase Hosting zum Hosten und Bereitstellen Ihrer statischen Assets

Für dieses spezielle Codelab haben wir Firebase Hosting bereits konfiguriert. Für Firebase Auth und Cloud Firestore führen wir Sie jedoch durch die Konfiguration und Aktivierung der Dienste mithilfe der Firebase-Konsole.

Anonyme Authentifizierung aktivieren

Obwohl die Authentifizierung nicht der Schwerpunkt dieses Codelabs ist, ist es wichtig, eine Form der Authentifizierung in unserer App zu haben. Wir verwenden die anonyme Anmeldung , was bedeutet, dass der Benutzer im Hintergrund angemeldet wird, ohne dazu aufgefordert zu werden.

Sie müssen die anonyme Anmeldung aktivieren.

  1. Suchen Sie in der Firebase-Konsole den Abschnitt „ Build “ im linken Navigationsbereich.
  2. Klicken Sie auf Authentifizierung und dann auf die Registerkarte Anmeldemethode (oder klicken Sie hier , um direkt dorthin zu gelangen).
  3. Aktivieren Sie den Anbieter für anonyme Anmeldung und klicken Sie dann auf Speichern .

img7.png

Dadurch kann die Anwendung Ihre Benutzer im Hintergrund anmelden, wenn sie auf die Web-App zugreifen. Lesen Sie die Dokumentation zur anonymen Authentifizierung , um mehr zu erfahren.

Aktivieren Sie Cloud Firestore

Die App verwendet Cloud Firestore zum Speichern und Empfangen von Restaurantinformationen und -bewertungen.

Sie müssen Cloud Firestore aktivieren. Klicken Sie im Abschnitt Erstellen der Firebase-Konsole auf Firestore-Datenbank . Klicken Sie im Cloud Firestore-Bereich auf Datenbank erstellen .

Der Zugriff auf Daten in Cloud Firestore wird durch Sicherheitsregeln gesteuert. Wir werden später in diesem Codelab mehr über Regeln sprechen, aber zuerst müssen wir einige Grundregeln für unsere Daten festlegen, um loszulegen. Fügen Sie auf der Registerkarte Regeln der Firebase-Konsole die folgenden Regeln hinzu und klicken Sie dann auf Veröffentlichen .

service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      //
      // WARNING: These rules are insecure! We will replace them with
      // more secure rules later in the codelab
      //
      allow read, write: if request.auth != null;
    }
  }
}

Die obigen Regeln beschränken den Datenzugriff auf angemeldete Benutzer, wodurch verhindert wird, dass nicht authentifizierte Benutzer lesen oder schreiben. Dies ist besser, als den öffentlichen Zugriff zuzulassen, aber noch lange nicht sicher. Wir werden diese Regeln später im Codelab verbessern.

3. Holen Sie sich den Beispielcode

Klonen Sie das GitHub-Repository über die Befehlszeile:

git clone https://github.com/firebase/friendlyeats-web

Der Beispielcode sollte in das Verzeichnis 📁 friendlyeats-web geklont worden sein. Stellen Sie von nun an sicher, dass Sie alle Ihre Befehle aus diesem Verzeichnis ausführen:

cd friendlyeats-web

Importieren Sie die Starter-App

Öffnen oder importieren Sie mit Ihrer IDE (WebStorm, Atom, Sublime, Visual Studio Code...) das Verzeichnis 📁 friendlyeats-web . Dieses Verzeichnis enthält den Startcode für das Codelab, das aus einer noch nicht funktionierenden Restaurantempfehlungs-App besteht. Wir werden es während dieses Codelabs funktionsfähig machen, sodass Sie den Code in diesem Verzeichnis bald bearbeiten müssen.

4. Installieren Sie die Firebase-Befehlszeilenschnittstelle

Mit der Firebase-Befehlszeilenschnittstelle (CLI) können Sie Ihre Web-App lokal bereitstellen und Ihre Web-App auf Firebase Hosting bereitstellen.

  1. Installieren Sie die CLI, indem Sie den folgenden npm-Befehl ausführen:
npm -g install firebase-tools
  1. Überprüfen Sie, ob die CLI korrekt installiert wurde, indem Sie den folgenden Befehl ausführen:
firebase --version

Stellen Sie sicher, dass die Version der Firebase CLI v7.4.0 oder höher ist.

  1. Autorisieren Sie die Firebase-CLI, indem Sie den folgenden Befehl ausführen:
firebase login

Wir haben die Web-App-Vorlage eingerichtet, um die Konfiguration Ihrer App für Firebase-Hosting aus dem lokalen Verzeichnis und den Dateien Ihrer App abzurufen. Dazu müssen wir Ihre App jedoch mit Ihrem Firebase-Projekt verknüpfen.

  1. Stellen Sie sicher, dass Ihre Befehlszeile auf das lokale Verzeichnis Ihrer App zugreift.
  2. Verknüpfen Sie Ihre App mit Ihrem Firebase-Projekt, indem Sie den folgenden Befehl ausführen:
firebase use --add
  1. Wenn Sie dazu aufgefordert werden, wählen Sie Ihre Projekt-ID aus und geben Sie Ihrem Firebase-Projekt dann einen Alias.

Ein Alias ​​ist nützlich, wenn Sie mehrere Umgebungen haben (Produktion, Staging usw.). Für dieses Codelab verwenden wir jedoch einfach den Alias default .

  1. Befolgen Sie die verbleibenden Anweisungen in Ihrer Befehlszeile.

5. Führen Sie den lokalen Server aus

Wir sind bereit, mit der Arbeit an unserer App zu beginnen! Lassen Sie uns unsere App lokal ausführen!

  1. Führen Sie den folgenden Firebase-CLI-Befehl aus:
firebase emulators:start --only hosting
  1. Ihre Befehlszeile sollte die folgende Antwort anzeigen:
hosting: Local server: http://localhost:5000

Wir verwenden den Firebase Hosting- Emulator, um unsere App lokal bereitzustellen. Die Web-App sollte jetzt unter http://localhost:5000 verfügbar sein.

  1. Öffnen Sie Ihre App unter http://localhost:5000 .

Sie sollten Ihre Kopie von FriendlyEats sehen, die mit Ihrem Firebase-Projekt verbunden wurde.

Die App hat sich automatisch mit Ihrem Firebase-Projekt verbunden und Sie stillschweigend als anonymer Benutzer angemeldet.

img2.png

6. Daten in Cloud Firestore schreiben

In diesem Abschnitt schreiben wir einige Daten in Cloud Firestore, damit wir die Benutzeroberfläche der App füllen können. Dies kann manuell über die Firebase-Konsole erfolgen, wir führen dies jedoch in der App selbst durch, um einen einfachen Cloud Firestore-Schreibvorgang zu demonstrieren.

Datenmodell

Firestore-Daten werden in Sammlungen, Dokumente, Felder und Untersammlungen aufgeteilt. Wir speichern jedes Restaurant als Dokument in einer übergeordneten Sammlung namens restaurants .

img3.png

Später speichern wir jede Bewertung in einer Untersammlung namens ratings unter jedem Restaurant.

img4.png

Restaurants zu Firestore hinzufügen

Das Hauptmodellobjekt in unserer App ist ein Restaurant. Lassen Sie uns einen Code schreiben, der der Sammlung restaurants ein restaurants hinzufügt.

  1. Öffnen Sie in Ihren heruntergeladenen Dateien scripts/FriendlyEats.Data.js .
  2. Suchen Sie die Funktion FriendlyEats.prototype.addRestaurant .
  3. Ersetzen Sie die gesamte Funktion durch den folgenden Code.

FriendlyEats.Data.js

FriendlyEats.prototype.addRestaurant = function(data) {
  var collection = firebase.firestore().collection('restaurants');
  return collection.add(data);
};

Der obige Code fügt der restaurants ein neues Dokument hinzu. Die Dokumentdaten stammen aus einem einfachen JavaScript-Objekt. Wir tun dies, indem wir zuerst einen Verweis auf eine Cloud Firestore-Sammlung von restaurants abrufen und dann die Daten add .

Fügen wir Restaurants hinzu!

  1. Gehen Sie zurück zu Ihrer FriendlyEats-App in Ihrem Browser und aktualisieren Sie sie.
  2. Klicken Sie auf Mock-Daten hinzufügen .

Die App generiert automatisch einen zufälligen Satz von Restaurantobjekten und ruft dann Ihre addRestaurant Funktion auf. Sie werden die Daten jedoch noch nicht in Ihrer eigentlichen Webanwendung sehen, da wir das Abrufen der Daten noch implementieren müssen (der nächste Abschnitt des Codelabs).

Wenn Sie jedoch in der Firebase-Konsole zur Registerkarte Cloud Firestore navigieren, sollten Sie jetzt neue Dokumente in der restaurants sehen!

img6.png

Herzlichen Glückwunsch, Sie haben gerade Daten aus einer Web-App in Cloud Firestore geschrieben!

Im nächsten Abschnitt erfahren Sie, wie Sie Daten aus Cloud Firestore abrufen und in Ihrer App anzeigen.

7. Daten aus Cloud Firestore anzeigen

In diesem Abschnitt erfahren Sie, wie Sie Daten aus Cloud Firestore abrufen und in Ihrer App anzeigen. Die beiden wichtigsten Schritte sind das Erstellen einer Abfrage und das Hinzufügen eines Snapshot-Listeners. Dieser Listener wird über alle vorhandenen Daten benachrichtigt, die der Abfrage entsprechen, und erhält Aktualisierungen in Echtzeit.

Lassen Sie uns zunächst die Abfrage erstellen, die die standardmäßige, ungefilterte Liste von Restaurants liefert.

  1. Gehen Sie zurück zur Datei scripts/FriendlyEats.Data.js .
  2. Suchen Sie die Funktion FriendlyEats.prototype.getAllRestaurants .
  3. Ersetzen Sie die gesamte Funktion durch den folgenden Code.

FriendlyEats.Data.js

FriendlyEats.prototype.getAllRestaurants = function(renderer) {
  var query = firebase.firestore()
      .collection('restaurants')
      .orderBy('avgRating', 'desc')
      .limit(50);

  this.getDocumentsInQuery(query, renderer);
};

Im obigen Code erstellen wir eine Abfrage, die bis zu 50 Restaurants aus der Sammlung der obersten Ebene mit dem Namen restaurants abruft, die nach der durchschnittlichen Bewertung (derzeit alle Null) geordnet sind. Nachdem wir diese Abfrage deklariert haben, übergeben wir sie an die Methode getDocumentsInQuery() , die für das Laden und Rendern der Daten verantwortlich ist.

Dazu fügen wir einen Snapshot-Listener hinzu.

  1. Gehen Sie zurück zur Datei scripts/FriendlyEats.Data.js .
  2. Suchen Sie die Funktion FriendlyEats.prototype.getDocumentsInQuery .
  3. Ersetzen Sie die gesamte Funktion durch den folgenden Code.

FriendlyEats.Data.js

FriendlyEats.prototype.getDocumentsInQuery = function(query, renderer) {
  query.onSnapshot(function(snapshot) {
    if (!snapshot.size) return renderer.empty(); // Display "There are no restaurants".

    snapshot.docChanges().forEach(function(change) {
      if (change.type === 'removed') {
        renderer.remove(change.doc);
      } else {
        renderer.display(change.doc);
      }
    });
  });
};

Im obigen Code löst query.onSnapshot seinen Rückruf jedes Mal aus, wenn sich das Ergebnis der Abfrage ändert.

  • Beim ersten Mal wird der Rückruf mit dem gesamten Ergebnissatz der Abfrage ausgelöst – also der gesamten restaurants aus Cloud Firestore. Anschließend übergibt sie alle einzelnen Dokumente an die Funktion renderer.display .
  • Wenn ein Dokument gelöscht wird, ist change.type gleich removed . In diesem Fall rufen wir also eine Funktion auf, die das Restaurant aus der Benutzeroberfläche entfernt.

Nachdem wir beide Methoden implementiert haben, aktualisieren Sie die App und vergewissern Sie sich, dass die Restaurants, die wir zuvor in der Firebase-Konsole gesehen haben, jetzt in der App sichtbar sind. Wenn Sie diesen Abschnitt erfolgreich abgeschlossen haben, liest und schreibt Ihre App jetzt Daten mit Cloud Firestore!

Wenn sich Ihre Restaurantliste ändert, wird dieser Listener automatisch aktualisiert. Versuchen Sie, zur Firebase-Konsole zu gehen und ein Restaurant manuell zu löschen oder seinen Namen zu ändern – die Änderungen werden sofort auf Ihrer Website angezeigt!

img5.png

8. Get()-Daten

Bisher haben wir gezeigt, wie man onSnapshot verwendet, um Updates in Echtzeit abzurufen; das ist jedoch nicht immer das, was wir wollen. Manchmal ist es sinnvoller, die Daten nur einmal abzurufen.

Wir möchten eine Methode implementieren, die ausgelöst wird, wenn ein Benutzer in Ihrer App auf ein bestimmtes Restaurant klickt.

  1. Gehen Sie zurück zu Ihrer Datei scripts/FriendlyEats.Data.js .
  2. Suchen Sie die Funktion FriendlyEats.prototype.getRestaurant .
  3. Ersetzen Sie die gesamte Funktion durch den folgenden Code.

FriendlyEats.Data.js

FriendlyEats.prototype.getRestaurant = function(id) {
  return firebase.firestore().collection('restaurants').doc(id).get();
};

Nachdem Sie diese Methode implementiert haben, können Sie Seiten für jedes Restaurant anzeigen. Klicken Sie einfach auf ein Restaurant in der Liste und Sie sollten die Detailseite des Restaurants sehen:

img1.png

Im Moment können Sie keine Bewertungen hinzufügen, da wir das Hinzufügen von Bewertungen später im Codelab noch implementieren müssen.

9. Daten sortieren und filtern

Derzeit zeigt unsere App eine Liste mit Restaurants an, aber der Benutzer hat keine Möglichkeit, nach seinen Bedürfnissen zu filtern. In diesem Abschnitt verwenden Sie die erweiterte Abfrage von Cloud Firestore, um die Filterung zu aktivieren.

Hier ist ein Beispiel für eine einfache Abfrage zum Abrufen aller Dim Sum -Restaurants:

var filteredQuery = query.where('category', '==', 'Dim Sum')

Wie der Name schon sagt, sorgt die where() Methode dafür, dass unsere Abfrage nur Mitglieder der Sammlung herunterlädt, deren Felder die von uns festgelegten Einschränkungen erfüllen. In diesem Fall werden nur Restaurants heruntergeladen, deren category Dim Sum ist.

In unserer App kann der Benutzer mehrere Filter verketten, um spezifische Abfragen zu erstellen, wie „Pizza in San Francisco“ oder „Meeresfrüchte in Los Angeles, sortiert nach Beliebtheit“.

Wir erstellen eine Methode, die eine Abfrage aufbaut, die unsere Restaurants basierend auf mehreren von unseren Benutzern ausgewählten Kriterien filtert.

  1. Gehen Sie zurück zu Ihrer Datei scripts/FriendlyEats.Data.js .
  2. Suchen Sie die Funktion FriendlyEats.prototype.getFilteredRestaurants .
  3. Ersetzen Sie die gesamte Funktion durch den folgenden Code.

FriendlyEats.Data.js

FriendlyEats.prototype.getFilteredRestaurants = function(filters, renderer) {
  var query = firebase.firestore().collection('restaurants');

  if (filters.category !== 'Any') {
    query = query.where('category', '==', filters.category);
  }

  if (filters.city !== 'Any') {
    query = query.where('city', '==', filters.city);
  }

  if (filters.price !== 'Any') {
    query = query.where('price', '==', filters.price.length);
  }

  if (filters.sort === 'Rating') {
    query = query.orderBy('avgRating', 'desc');
  } else if (filters.sort === 'Reviews') {
    query = query.orderBy('numRatings', 'desc');
  }

  this.getDocumentsInQuery(query, renderer);
};

Der obige Code fügt mehrere where -Filter und eine einzelne orderBy Klausel hinzu, um eine zusammengesetzte Abfrage basierend auf Benutzereingaben zu erstellen. Unsere Abfrage gibt jetzt nur Restaurants zurück, die den Anforderungen des Benutzers entsprechen.

Aktualisieren Sie Ihre FriendlyEats-App in Ihrem Browser und vergewissern Sie sich dann, dass Sie nach Preis, Stadt und Kategorie filtern können. Während des Tests sehen Sie Fehler in der JavaScript-Konsole Ihres Browsers, die wie folgt aussehen:

The query requires an index. You can create it here: https://console.firebase.google.com/project/.../database/firestore/indexes?create_index=...

Diese Fehler treten auf, weil Cloud Firestore Indexe für die meisten zusammengesetzten Abfragen benötigt. Das Erfordernis von Indizes für Abfragen hält Cloud Firestore schnell und skalierbar.

Durch das Öffnen des Links aus der Fehlermeldung wird automatisch die Benutzeroberfläche für die Indexerstellung in der Firebase-Konsole mit den korrekt ausgefüllten Parametern geöffnet. Im nächsten Abschnitt werden wir die für diese Anwendung erforderlichen Indizes schreiben und bereitstellen.

10. Stellen Sie Indizes bereit

Wenn wir nicht jeden Pfad in unserer App erkunden und jedem der Links zur Indexerstellung folgen möchten, können wir mithilfe der Firebase-Befehlszeilenschnittstelle problemlos viele Indizes gleichzeitig bereitstellen.

  1. Im heruntergeladenen lokalen Verzeichnis Ihrer App finden Sie eine firestore.indexes.json -Datei.

Diese Datei beschreibt alle Indizes, die für alle möglichen Kombinationen von Filtern benötigt werden.

firestore.indexes.json

{
 "indexes": [
   {
     "collectionGroup": "restaurants",
     "queryScope": "COLLECTION",
     "fields": [
       { "fieldPath": "city", "order": "ASCENDING" },
       { "fieldPath": "avgRating", "order": "DESCENDING" }
     ]
   },

   ...

 ]
}
  1. Stellen Sie diese Indizes mit dem folgenden Befehl bereit:
firebase deploy --only firestore:indexes

Nach einigen Minuten sind Ihre Indizes live und die Fehlermeldungen verschwinden.

11. Daten in eine Transaktion schreiben

In diesem Abschnitt fügen wir die Möglichkeit für Benutzer hinzu, Bewertungen an Restaurants zu senden. Bisher waren alle unsere Schreibvorgänge atomar und relativ einfach. Wenn bei einem von ihnen ein Fehler auftritt, würden wir den Benutzer wahrscheinlich einfach auffordern, es erneut zu versuchen, oder unsere App würde den Schreibvorgang automatisch wiederholen.

Unsere App wird viele Benutzer haben, die eine Bewertung für ein Restaurant hinzufügen möchten, daher müssen wir mehrere Lese- und Schreibvorgänge koordinieren. Zuerst muss die Bewertung selbst eingereicht werden, dann müssen die count und die average rating des Restaurants aktualisiert werden. Wenn eines davon fehlschlägt, das andere jedoch nicht, befinden wir uns in einem inkonsistenten Zustand, in dem die Daten in einem Teil unserer Datenbank nicht mit den Daten in einem anderen übereinstimmen.

Glücklicherweise bietet Cloud Firestore Transaktionsfunktionen, die es uns ermöglichen, mehrere Lese- und Schreibvorgänge in einer einzigen atomaren Operation durchzuführen, wodurch sichergestellt wird, dass unsere Daten konsistent bleiben.

  1. Gehen Sie zurück zu Ihrer Datei scripts/FriendlyEats.Data.js .
  2. Suchen Sie die Funktion FriendlyEats.prototype.addRating .
  3. Ersetzen Sie die gesamte Funktion durch den folgenden Code.

FriendlyEats.Data.js

FriendlyEats.prototype.addRating = function(restaurantID, rating) {
  var collection = firebase.firestore().collection('restaurants');
  var document = collection.doc(restaurantID);
  var newRatingDocument = document.collection('ratings').doc();

  return firebase.firestore().runTransaction(function(transaction) {
    return transaction.get(document).then(function(doc) {
      var data = doc.data();

      var newAverage =
          (data.numRatings * data.avgRating + rating.rating) /
          (data.numRatings + 1);

      transaction.update(document, {
        numRatings: data.numRatings + 1,
        avgRating: newAverage
      });
      return transaction.set(newRatingDocument, rating);
    });
  });
};

Im obigen Block lösen wir eine Transaktion aus, um die numerischen Werte von avgRating und numRatings im Restaurantdokument zu aktualisieren. Gleichzeitig fügen wir die neue rating der ratings hinzu.

12. Sichern Sie Ihre Daten

Zu Beginn dieses Codelabs legen wir die Sicherheitsregeln unserer App fest, um die Datenbank vollständig für Lese- oder Schreibvorgänge zu öffnen. In einer realen Anwendung würden wir viel feinkörnigere Regeln festlegen wollen, um unerwünschte Datenzugriffe oder -änderungen zu verhindern.

  1. Klicken Sie im Abschnitt Erstellen der Firebase-Konsole auf Firestore-Datenbank .
  2. Klicken Sie im Bereich Cloud Firestore auf die Registerkarte Regeln (oder klicken Sie hier , um direkt dorthin zu gelangen).
  3. Ersetzen Sie die Standardwerte durch die folgenden Regeln und klicken Sie dann auf Veröffentlichen .

firestore.rules

rules_version = '2';
service cloud.firestore {

  // Determine if the value of the field "key" is the same
  // before and after the request.
  function unchanged(key) {
    return (key in resource.data) 
      && (key in request.resource.data) 
      && (resource.data[key] == request.resource.data[key]);
  }

  match /databases/{database}/documents {
    // Restaurants:
    //   - Authenticated user can read
    //   - Authenticated user can create/update (for demo purposes only)
    //   - Updates are allowed if no fields are added and name is unchanged
    //   - Deletes are not allowed (default)
    match /restaurants/{restaurantId} {
      allow read: if request.auth != null;
      allow create: if request.auth != null;
      allow update: if request.auth != null
                    && (request.resource.data.keys() == resource.data.keys()) 
                    && unchanged("name");
      
      // Ratings:
      //   - Authenticated user can read
      //   - Authenticated user can create if userId matches
      //   - Deletes and updates are not allowed (default)
      match /ratings/{ratingId} {
        allow read: if request.auth != null;
        allow create: if request.auth != null
                      && request.resource.data.userId == request.auth.uid;
      }
    }
  }
}

Diese Regeln schränken den Zugriff ein, um sicherzustellen, dass Clients nur sichere Änderungen vornehmen. Zum Beispiel:

  • Aktualisierungen eines Restaurantdokuments können nur die Bewertungen ändern, nicht den Namen oder andere unveränderliche Daten.
  • Bewertungen können nur erstellt werden, wenn die Benutzer-ID mit dem angemeldeten Benutzer übereinstimmt, wodurch Spoofing verhindert wird.

Alternativ zur Verwendung der Firebase-Konsole können Sie die Firebase-Befehlszeilenschnittstelle verwenden, um Regeln für Ihr Firebase-Projekt bereitzustellen. Die Datei firestore.rules in Ihrem Arbeitsverzeichnis enthält bereits die Regeln von oben. Um diese Regeln von Ihrem lokalen Dateisystem bereitzustellen (anstatt die Firebase-Konsole zu verwenden), führen Sie den folgenden Befehl aus:

firebase deploy --only firestore:rules

13. Fazit

In diesem Codelab haben Sie gelernt, wie Sie grundlegende und erweiterte Lese- und Schreibvorgänge mit Cloud Firestore durchführen und wie Sie den Datenzugriff mit Sicherheitsregeln sichern. Die vollständige Lösung finden Sie im Quickstarts-js-Repository .

Um mehr über Cloud Firestore zu erfahren, besuchen Sie die folgenden Ressourcen: