Integrare gli SDK Firebase con l'app web

Firebase App Hosting è ideale per le app web dinamiche create con l'SDK Firebase JavaScript e Firebase Admin SDK per Node.js. In un'app web completa, gli SDK Firebase come Authentication, Cloud Firestore e App Check svolgono ruoli importanti. Questa guida descrive alcune strategie chiave per aiutarti a ottimizzare gli SDK Firebase e iniziare a integrare Firebase nella tua app web su Firebase App Hosting.

Inizializzare automaticamente Firebase Admin SDK e gli SDK web

Gli ambienti Google come Firebase App Hosting forniscono un'inizializzazione semplificata dell'app tramite una chiamata al costruttore senza argomenti in fase di compilazione e runtime. Si tratta di una funzionalità sia dell'Firebase Admin SDK per Node.js, un SDK lato server che sblocca un'ampia area di funzionalità di Firebase e può essere molto utile nella tua app web, sia dell'SDK Firebase JavaScript.

Con initializeApp(), puoi consentire a Firebase App Hosting di compilare automaticamente la configurazione dell'app web, mantenendo comunque la possibilità di controllare in modo granulare valori specifici se vuoi sostituire i valori predefiniti.

Inizializza senza argomenti

Per inizializzare l'SDK Firebase JavaScript o Firebase Admin SDK con i valori di configurazione predefiniti, utilizza initializeApp() senza fornire argomenti:

Admin SDK

import { initializeApp } from 'firebase-admin/app';
const app = initializeApp();

SDK JavaScript

import { initializeApp } from 'firebase/app';
const app = initializeApp();

Questa strategia per l'inizializzazione di Admin SDK funziona anche in App Hosting, nonché in altri ambienti server Google, tra cui Cloud Run, App Engine e Cloud Functions. Per l'SDK JavaScript, questa strategia funziona su App Hosting.

Eseguire l'override dei valori compilati automaticamente

Puoi sovrascrivere la configurazione predefinita inserita automaticamente. Tieni presente che queste opzioni differiscono tra l'SDK Admin SDK e l'SDK JavaScript.

Admin SDK override

Per specificare facoltativamente opzioni di inizializzazione personalizzate per servizi come Realtime Database, Cloud Storage o Cloud Functions, utilizza la variabile di ambiente FIREBASE_CONFIG. Se il contenuto della variabile FIREBASE_CONFIG inizia con un carattere {, verrà analizzato come oggetto JSON. In caso contrario, l'SDK presume che la stringa sia il percorso di un file JSON contenente le opzioni.

# apphosting.yaml

env:
  - variable: FIREBASE_CONFIG
    value: '{"credential: applicationDefault()","databaseURL":"https://project-id-default-rtdb.firebaseio.com"}'

Override dell'SDK JavaScript

Per eseguire l'override dei valori FIREBASE_WEBAPP_CONFIG predefiniti inseriti da App Hosting per l'inizializzazione dell'SDK JavaScript, puoi specificare i valori in apphosting.yaml:

# apphosting.yaml

env:
  - variable: FIREBASE_WEBAPP_CONFIG
    value: '{"apiKey":"myApiKey","appId":"app:123","authDomain":"project-id.firebaseapp.com","databaseURL":"https://project-id-default-rtdb.firebaseio.com","messagingSenderId":"0123456789","projectId":"project-id","storageBucket":"project-id.firebasestorage.app"}'

Utilizzo dell'inizializzazione automatica in altri ambienti

L'inizializzazione automatica viene configurata con uno script npm postinstall quando installi l'SDK Firebase JavaScript. Lo script postinstall cerca la variabile di ambiente FIREBASE_WEBAPP_CONFIG, che viene impostata automaticamente nell'ambiente Cloud Build App Hosting.

Se installi l'SDK JS al di fuori di Cloud Build, dovrai impostare questa variabile di ambiente quando installi l'SDK Firebase JavaScript.

Per configurare manualmente l'ambiente durante l'installazione:

  1. Copia l'oggetto di configurazione dell'app web Firebase dalla console Firebase.

  2. Da un terminale, imposta la variabile di ambiente FIREBASE_WEBAPP_CONFIG prima di eseguire il comando npm install.

FIREBASE_WEBAPP_CONFIG="{...}" npm install firebase

Ogni volta che modifichi il progetto Firebase o l'app web, esegui di nuovo questo comando.

Utilizzare FirebaseServerApp per l'SSR

Se hai lavorato con l'SDK Firebase JS o altri SDK client Firebase nello sviluppo della tua app web, probabilmente conosci l'interfaccia FirebaseApp e come utilizzarla per configurare le istanze dell'app. Per facilitare operazioni simili lato server, Firebase fornisce FirebaseServerApp.

FirebaseServerApp è una variante di FirebaseApp da utilizzare negli ambienti di rendering lato server (SSR). Include strumenti per continuare le sessioni Firebase che si estendono oltre la divisione tra rendering lato client (CSR) e rendering lato server.

Usa FirebaseServerApp per:

  • Esegui il codice lato server nel contesto user, a differenza di Firebase Admin SDK, che dispone di diritti amministrativi completi.
  • Abilita l'utilizzo di App Check negli ambienti SSR.
  • Continua una sessione di Firebase Auth creata nel client.

Per informazioni dettagliate sull'utilizzo di FirebaseServerApp per questi scopi, consulta Utilizzare Firebase in app web dinamiche con SSR.

Attiva App Check nell'app web

Puoi utilizzare App Check per rafforzare la sicurezza della tua app web dinamica su App Hosting. Implementando alcune delle strategie specifiche lato server descritte in Utilizzare Firebase in app web dinamiche con SSR, puoi proteggere i tuoi backend App Hosting da comportamenti illeciti.