Utilizza elenchi di dati sul Web

Recuperare un riferimento al database

Per leggere o scrivere dati dal database, devi disporre di un'istanza di firebase.database.Reference:

import { getDatabase } from "firebase/database";

const database = getDatabase();
rtdb_get_reference.js

var database = firebase.database();
index.js

Lettura e scrittura di elenchi

Aggiungere a un elenco di dati

Utilizza il metodo push() per aggiungere dati a un elenco in applicazioni multiutente. Il metodo push() genera una chiave univoca ogni volta che viene aggiunto un nuovo figlio al riferimento Firebase specificato. Utilizzando queste chiavi generate automaticamente per ogni nuovo elemento dell'elenco, più client possono aggiungere figli alla stessa posizione contemporaneamente senza conflitti di scrittura. La chiave univoca generata da push() si basa su un timestamp, quindi gli elementi dell'elenco vengono ordinati automaticamente in ordine cronologico.

Puoi utilizzare il riferimento ai nuovi dati restituiti dal metodo push() per ottenere il valore della chiave generata automaticamente dell'elemento secondario o impostare i dati per l'elemento secondario. La proprietà .key di un riferimento push() contiene la chiave generata automaticamente.

Puoi utilizzare queste chiavi generate automaticamente per semplificare l'appiattimento della struttura dei dati. Per saperne di più, consulta l'esempio di fan-out dei dati.

Ad esempio, push() potrebbe essere utilizzato per aggiungere un nuovo post a un elenco di post in un'applicazione social:

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, {
    // ...
});
rtdb_social_push.js

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

Ascolta gli eventi secondari

Gli eventi secondari vengono attivati in risposta a operazioni specifiche che interessano i nodi secondari di un'operazione, ad esempio un nuovo nodo secondario aggiunto tramite il metodo push() o un nodo secondario aggiornato tramite il metodo update().

Ciascuna di queste opzioni può essere utile per monitorare le modifiche a un nodo specifico di un database. Ad esempio, un'app di blogging sociale potrebbe utilizzare questi metodi insieme per monitorare l'attività nei commenti di un post, come mostrato di seguito:

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);
});
rtdb_social_listen_children.js

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);
});
lists-of-data.js

Ascolta gli eventi di valore

Sebbene l'ascolto degli eventi secondari sia il modo consigliato per leggere gli elenchi di dati, in alcune situazioni è utile ascoltare gli eventi di valore in un riferimento di elenco.

L'allegato di un osservatore value a un elenco di dati restituirà l'intero elenco di dati come una singola istantanea su cui è possibile eseguire un ciclo per accedere ai singoli elementi secondari.

Anche quando esiste una sola corrispondenza per la query, lo snapshot è comunque un elenco, ma contiene un solo elemento. Per accedere all'elemento, devi scorrere il risultato:

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
});
rtdb_social_listen_value.js

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

Questo pattern può essere utile quando vuoi recuperare tutti gli elementi secondari di un elenco in una singola operazione, anziché ascoltare eventi aggiuntivi di elementi secondari aggiunti.

Ordinare e filtrare i dati

Puoi utilizzare la classe Realtime Database Query per recuperare i dati ordinati per chiave, per valore o per valore di un elemento secondario. Puoi anche filtrare il risultato ordinato in base a un numero specifico di risultati o a un intervallo di chiavi o valori.

Ordinare i dati

Per recuperare i dati ordinati, inizia specificando uno dei metodi di ordinamento per determinare l'ordine dei risultati:

Puoi utilizzare un solo metodo di ordinamento alla volta. La chiamata di un metodo order-by più volte nella stessa query genera un errore.

Il seguente esempio mostra come recuperare un elenco dei post più popolari di un utente ordinati in base al numero di stelle:

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'));
rtdb_social_most_starred.js

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

Definisce una query che, combinata con un listener secondario, sincronizza il client con i post dell'utente dal percorso nel database in base al suo ID utente, ordinati in base al numero di stelle ricevute da ogni post. Questa tecnica di utilizzo degli ID come chiavi di indice è chiamata distribuzione dei dati. Puoi saperne di più in Strutturare il database.

La chiamata al metodo orderByChild() specifica la chiave secondaria in base alla quale ordinare i risultati. In questo caso, i post vengono ordinati in base al valore del rispettivo elemento secondario "starCount". Le query possono essere ordinate anche in base ai figli nidificati, nel caso in cui i dati siano strutturati in questo modo:

"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 questo caso, possiamo ordinare gli elementi dell'elenco in base ai valori nidificati sotto la chiave metrics specificando il percorso relativo all'elemento secondario nidificato nella chiamata orderByChild().

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

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

var mostViewedPosts = firebase.database().ref('posts').orderByChild('metrics/views');
lists-of-data.js

Per saperne di più sull'ordine degli altri tipi di dati, vedi Come vengono ordinati i dati delle query.

Filtrare i dati

Per filtrare i dati, puoi combinare uno qualsiasi dei metodi di limite o intervallo con un metodo di ordinamento durante la creazione di una query.

A differenza dei metodi di ordinamento, puoi combinare più funzioni di limite o intervallo. Ad esempio, puoi combinare i metodi startAt() e endAt() per limitare i risultati a un intervallo di valori specificato.

Limitare il numero di risultati

Puoi utilizzare i metodi limitToFirst() e limitToLast() per impostare un numero massimo di figli da sincronizzare per un determinato evento. Ad esempio, se utilizzi limitToFirst() per impostare un limite di 100, inizialmente ricevi solo fino a 100 eventi child_added. Se hai meno di 100 elementi memorizzati nel database Firebase, viene attivato un evento child_added per ogni elemento.

Man mano che gli elementi cambiano, ricevi eventi child_added per gli elementi che entrano nella query ed eventi child_removed per gli elementi che escono dalla query, in modo che il numero totale rimanga a 100.

Il seguente esempio mostra come l'app di blogging di esempio definisce una query per recuperare un elenco dei 100 post più recenti di tutti gli utenti:

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

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

var recentPostsRef = firebase.database().ref('posts').limitToLast(100);
lists-of-data.js

Questo esempio definisce solo una query. Per sincronizzare effettivamente i dati, deve avere un listener allegato.

Filtrare per chiave o valore

Puoi utilizzare startAt(), startAfter(),endAt(), endBefore() e equalTo() per scegliere punti di partenza, di arrivo e di equivalenza arbitrari per le query. Può essere utile per paginare i dati o trovare elementi secondari che hanno un valore specifico.

Come vengono ordinati i dati delle query

Questa sezione spiega come vengono ordinati i dati in base a ciascuno dei metodi di ordinamento nella classe Query.

orderByChild

Quando utilizzi orderByChild(), i dati che contengono la chiave secondaria specificata vengono ordinati nel seguente modo:

1. I bambini con un valore null per la chiave figlio specificata vengono visualizzati per primi.
2. I figli con un valore di false per la chiave secondaria specificata vengono visualizzati successivamente. Se più elementi secondari hanno un valore di false, vengono ordinati lessicograficamente per chiave.
3. I figli con un valore di true per la chiave secondaria specificata vengono visualizzati successivamente. Se più elementi secondari hanno un valore di true, vengono ordinati in ordine lessicografico in base alla chiave.
4. Seguono i bambini con un valore numerico, ordinati in ordine crescente. Se più elementi secondari hanno lo stesso valore numerico per il nodo secondario specificato, vengono ordinati per chiave.
5. Le stringhe vengono dopo i numeri e sono ordinate lessicograficamente in ordine crescente. Se più figli hanno lo stesso valore per il nodo figlio specificato, vengono ordinati in ordine lessicografico per chiave.
6. Gli oggetti vengono visualizzati per ultimi e sono ordinati lessicograficamente per chiave in ordine crescente.

orderByKey

Quando utilizzi orderByKey() per ordinare i dati, questi vengono restituiti in ordine crescente per chiave.

1. I bambini con una chiave che può essere analizzata come un numero intero a 32 bit vengono visualizzati per primi, in ordine crescente.
2. Seguono i figli con un valore stringa come chiave, ordinati in ordine lessicografico crescente.

orderByValue

Quando si utilizza orderByValue(), i bambini vengono ordinati in base al loro valore. I criteri di ordinamento sono gli stessi di orderByChild(), tranne che viene utilizzato il valore del nodo anziché il valore di una chiave secondaria specificata.

Stacca i listener

I callback vengono rimossi chiamando il metodo off() sul riferimento al database Firebase.

Puoi rimuovere un singolo listener passandolo come parametro a off(). La chiamata off() nella posizione senza argomenti rimuove tutti gli ascoltatori in quella posizione.

La chiamata di off() su un listener genitore non rimuove automaticamente i listener registrati nei relativi nodi secondari; off() deve essere chiamato anche su tutti i listener secondari per rimuovere il callback.

Passaggi successivi

• Scopri come strutturare i dati
• Memorizzare i dati offline