Collega la tua app e inizia la prototipazione

Prima di passare a Firebase Local Emulator Suite, assicurati di aver creato un progetto Firebase, configurato il tuo ambiente di sviluppo e selezionato e installato gli SDK Firebase per la tua piattaforma in base agli argomenti Iniziare con Firebase per la tua piattaforma: Apple , Android o Web .

Prototipo e prova

La suite di emulatori locali contiene diversi emulatori di prodotti, come descritto in Introduzione alla suite di emulatori locali di Firebase . Puoi prototipare e testare con singoli emulatori e combinazioni di emulatori, come meglio credi, corrispondenti ai prodotti Firebase che stai utilizzando in produzione.

Interazione tra Firebase dstabase ed emulatori di funzioni
Emulatori di database e funzioni cloud come parte della suite completa di emulatori locali .

Per questo argomento, per introdurre il flusso di lavoro di Local Emulator Suite, supponiamo che tu stia lavorando su un'app che utilizza una tipica combinazione di prodotti: un database Firebase e funzioni cloud attivate da operazioni su quel database.

Dopo aver inizializzato localmente il tuo progetto Firebase, il ciclo di sviluppo utilizzando Local Emulator Suite avrà in genere tre passaggi:

  1. Funzionalità di prototipo in modo interattivo con gli emulatori e l'interfaccia utente di Emulator Suite.

  2. Se stai utilizzando un emulatore di database o l'emulatore di Cloud Functions, esegui un passaggio una tantum per connettere la tua app agli emulatori.

  3. Automatizza i tuoi test con gli emulatori e gli script personalizzati.

Inizializza localmente un progetto Firebase

Assicurati di installare la CLI o di aggiornare all'ultima versione .

curl -sL firebase.tools | bash

Se non l'hai già fatto, inizializza la directory di lavoro corrente come progetto Firebase, seguendo le istruzioni sullo schermo per specificare che stai utilizzando Cloud Functions e Cloud Firestore o Realtime Database :

firebase init

La directory del tuo progetto conterrà ora i file di configurazione di Firebase, un file di definizione delle regole di sicurezza di Firebase per il database, una directory delle functions contenente il codice delle funzioni cloud e altri file di supporto.

Prototipazione interattiva

Local Emulator Suite è progettato per consentire di prototipare rapidamente nuove funzionalità e l'interfaccia utente integrata della Suite è uno dei suoi strumenti di prototipazione più utili. È un po' come avere la console Firebase in esecuzione localmente.

Utilizzando l'interfaccia utente di Emulator Suite, puoi iterare la progettazione di un database, provare diversi flussi di dati che coinvolgono funzioni cloud, valutare le modifiche alle regole di sicurezza, controllare i log per confermare le prestazioni dei tuoi servizi di back-end e altro ancora. Quindi, se vuoi ricominciare da capo, svuota il database e ricomincia da capo con una nuova idea di design.

È tutto disponibile all'avvio di Local Emulator Suite con:

firebase emulators:start

Per prototipare la nostra ipotetica app, impostiamo e testiamo una funzione cloud di base per modificare le voci di testo in un database e creare e popolare il database nell'interfaccia utente di Emulator Suite per attivarlo.

  1. Crea una funzione cloud attivata dalle scritture del database modificando il file functions/index.js nella directory del progetto. Sostituisci il contenuto del file esistente con il frammento di codice seguente. Questa funzione ascolta le modifiche ai documenti nella raccolta di messages , converte il contenuto del campo original di un documento in maiuscolo e memorizza il risultato nel campo uppercase di quel documento.
  2.   const functions = require('firebase-functions');
    
      exports.makeUppercase = functions.firestore.document('/messages/{documentId}')
          .onCreate((snap, context) => {
            const original = snap.data().original;
            console.log('Uppercasing', context.params.documentId, original);
            const uppercase = original.toUpperCase();
            return snap.ref.set({uppercase}, {merge: true});
          });
      
  3. Avvia la suite di emulatori locali con firebase emulators:start . Le Funzioni Cloud e gli emulatori di database si avviano, configurati automaticamente per interagire.
  4. Visualizza l'interfaccia utente nel browser all'indirizzo http://localhost:4000 . La porta 4000 è l'impostazione predefinita per l'interfaccia utente, ma controlla i messaggi del terminale emessi dall'interfaccia a riga di comando di Firebase. Prendere nota dello stato degli emulatori disponibili. Nel nostro caso, gli emulatori Cloud Functions e Cloud Firestore saranno in esecuzione.
    La mia immagine
  5. Nell'interfaccia utente, nella scheda Firestore , nella sottoscheda Dati , fare clic su Avvia raccolta e seguire le istruzioni per creare un nuovo documento in una raccolta di messages , con nome campo original e valore test . Questo attiva la nostra funzione cloud. Osservare che a breve compare un nuovo campo uppercase , popolato con la stringa "TEST".
    La mia immagineLa mia immagine
  6. Nella scheda Firestore > Richieste , esamina le richieste inviate al database emulato, comprese tutte le valutazioni delle regole di sicurezza Firebase eseguite nell'ambito dell'adempimento di tali richieste.
  7. Controlla la scheda Registri per confermare che la tua funzione non ha riscontrato errori durante l'aggiornamento del database.

Puoi facilmente scorrere tra il codice della funzione cloud e le modifiche interattive del database fino a ottenere il flusso di dati che stai cercando, senza toccare il codice di accesso al database in-app, ricompilare e rieseguire le suite di test.

Collega la tua app agli emulatori

Quando avrai fatto buoni progressi con la prototipazione interattiva e avrai deciso un progetto, sarai pronto per aggiungere il codice di accesso al database alla tua app usando l'SDK appropriato. Continuerai a utilizzare la scheda del database e, per le funzioni, la scheda Registri nell'interfaccia utente di Emulator Suite per confermare che il comportamento dell'app è corretto.

Ricorda che Local Emulator Suite è uno strumento di sviluppo locale. Le scritture nei database di produzione non attiveranno le funzioni che stai creando prototipazione in locale.

Per passare a fare in modo che la tua app esegua scritture nel database, dovrai indirizzare le tue classi di test o la configurazione in-app all'emulatore di Cloud Firestore.

Androide
        // 10.0.2.2 is the special IP address to connect to the 'localhost' of
        // the host computer from an Android emulator.
        FirebaseFirestore firestore = FirebaseFirestore.getInstance();
        firestore.useEmulator("10.0.2.2", 8080);

        FirebaseFirestoreSettings settings = new FirebaseFirestoreSettings.Builder()
                .setPersistenceEnabled(false)
                .build();
        firestore.setFirestoreSettings(settings);
Veloce
let settings = Firestore.firestore().settings
settings.host = "localhost:8080"
settings.isPersistenceEnabled = false 
settings.isSSLEnabled = false
Firestore.firestore().settings = settings

Web version 9

import { getFirestore, connectFirestoreEmulator } from "firebase/firestore";

// firebaseApps previously initialized using initializeApp()
const db = getFirestore();
connectFirestoreEmulator(db, 'localhost', 8080);

Web version 8

// Firebase previously initialized using firebase.initializeApp().
var db = firebase.firestore();
if (location.hostname === "localhost") {
  db.useEmulator("localhost", 8080);
}

Automatizza i tuoi test con script personalizzati

Ora per l'ultimo passaggio generale del flusso di lavoro. Una volta che hai prototipato la tua funzionalità in-app e sembra promettente su tutte le tue piattaforme, puoi passare all'implementazione e al test finali. Per i flussi di lavoro di unit test e CI, puoi avviare emulatori, eseguire test con script e arrestare emulatori in una singola chiamata con il comando exec :

firebase emulators:exec "./testdir/test.sh"

Esplora i singoli emulatori in modo più approfondito

Ora che hai visto come appare il flusso di lavoro di base lato client, puoi continuare con i dettagli sui singoli emulatori nella Suite, incluso come usarli per lo sviluppo di app lato server:

E dopo?

Assicurati di leggere gli argomenti relativi a emulatori specifici collegati sopra. Quindi: