Utilizza elenchi di dati sul Web

Recuperare un riferimento a un database

Per leggere o scrivere dati dal database, hai bisogno 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 elementi a un elenco di dati

Utilizza il metodo push() per aggiungere dati a un elenco nelle applicazioni multiutente. Il metodo push() genera una chiave univoca ogni volta che viene aggiunto un nuovo asset secondario al riferimento Firebase specificato. Utilizzando queste chiavi generate automaticamente per ogni nuovo elemento dell'elenco, più client possono aggiungere elementi secondari 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 ulteriori informazioni, 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 di 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 si verificano per i figli di un nodo da un'operazione, ad esempio un nuovo figlio aggiunto tramite il metodo push() o un figlio aggiornato tramite il metodo update().

Insieme, questi elementi possono essere utili per ascoltare le modifiche apportate a un determinato node in un database. Ad esempio, un'app di blog social potrebbe utilizzare insieme questi metodi 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 relativi ai valori

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 elenco.

Se colleghi un osservatore value a un elenco di dati, verrà restituito l'intero elenco di dati come un'unica istantanea, che potrai poi eseguire in loop per accedere ai singoli elementi secondari.

Anche se esiste una sola corrispondenza per la query, lo snapshot è comunque un elenco, ma contiene un solo elemento. Per accedere all'elemento, devi scorrere sul 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 un'unica operazione, anziché ascoltare altri eventi di aggiunta di elementi secondari.

Ordinamento e filtri dei dati

Puoi utilizzare la classe Realtime Database Query per recuperare i dati ordinati per chiave, valore o 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'ordinamento dei risultati:

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

L'esempio seguente mostra come recuperare un elenco dei post principali 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

Questa definisce una query che, se combinata con un listener secondario, consente di sincronizzare il client con i post dell'utente dal percorso nel database in base al relativo ID utente, ordinati in base al numero di stelle ricevute da ogni post. Questa tecnica che utilizza gli ID come chiavi di indice è detta "Data fan-out". Per saperne di più, consulta la pagina Struttura 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 da elementi figlio nidificati, se hai dati simili ai seguenti:

"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" : 950000,
      "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 ulteriori informazioni sull'ordinamento di altri tipi di dati, consulta Come vengono ordinati i dati delle query.

Filtrare i dati

Per filtrare i dati, puoi combinare uno 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.

Limita il numero di risultati

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

Quando gli elementi cambiano, ricevi eventi child_added per gli elementi che entrano nella query ed eventi child_removed per quelli che ne escono, in modo che il numero totale rimanga 100.

L'esempio seguente 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 è necessario avere un listener collegato.

Filtra per chiave o valore

Puoi utilizzare startAt(), startAfter(),endAt(), endBefore() e equalTo() per scegliere punti di inizio, di fine ed equivalenza arbitrari per le query. Questa operazione può essere utile per paginare i dati o trovare elementi con 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 sono ordinati come segue:

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

orderByKey

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

1. Gli elementi secondari con una chiave analizzabile come numero intero a 32 bit vengono visualizzati per primi e ordinati in ordine crescente.
2. Seguono gli elementi secondari con una stringa come chiave, ordinati in ordine lessicografico crescente.

orderByValue

Quando utilizzi orderByValue(), gli elementi secondari vengono ordinati in base al valore. I criteri di ordinamento sono gli stessi di orderByChild(), tranne per il fatto che viene utilizzato il valore del nodo anziché il valore di una chiave secondaria specificata.

Scollegare gli ascoltatori

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

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

La chiamata a off() su un ascoltatore principale nonrimuove automaticamente gli ascoltatori registrati sui relativi nodi secondari.off() deve essere chiamato anche su tutti gli ascoltatori secondari per rimuovere il callback.

Passaggi successivi

• Scopri come strutturare i dati
• Memorizzare i dati offline