Utilizzando la CLI Firebase, puoi eseguire il deployment delle tue app web Next.js su Firebase e servirle con Firebase Hosting.
Pubblicare contenuti statici
Dopo aver inizializzato Firebase, puoi pubblicare contenuti statici con il comando di deployment standard:
firebase deploy
Se la tua app include una logica dinamica lato server, la CLI la implementa in Cloud Functions for Firebase. Puoi visualizzare l'app di cui hai eseguito il deployment sul sito live.
Pre-rendering dei contenuti dinamici
La CLI Firebase rileverà l'utilizzo di getStaticProps e getStaticPaths.
(Facoltativo) Eseguire l'integrazione con l'SDK Firebase JS
Quando includi i metodi dell'SDK Firebase JS sia nei bundle server che client, proteggiti
dagli errori di runtime controllando isSupported() prima di utilizzare il prodotto.
Non tutti i prodotti sono
supportati in tutti gli ambienti.
(Facoltativo) Integrare l'SDK Firebase Admin
I bundle SDK Admin non verranno compilati se inclusi nella build del browser. Fai riferimento a questi bundle solo all'interno di getStaticProps e getStaticPaths.
Pubblicare contenuti completamente dinamici (SSR)
La CLI Firebase rileverà l'utilizzo di getServerSideProps. In questi casi, l'interfaccia a riga di comando esegue il deployment delle funzioni in Cloud Functions for Firebase per eseguire codice server dinamico. Puoi visualizzare informazioni su queste funzioni, come la configurazione del dominio e del runtime, nella console Firebase.
Configurare il comportamento di Hosting con next.config.js
Ottimizzazione delle immagini
L'utilizzo dell'ottimizzazione delle immagini di Next.js è supportato, ma attiverà la creazione di una funzione (in Cloud Functions for Firebase), anche se non utilizzi il rendering lato server.
Reindirizzamenti, riscritture e intestazioni
La CLI Firebase rispetta
reindirizzamenti,
riscritture e
intestazioni in
next.config.js, convertendoli nella
rispettiva configurazione Firebase Hosting equivalente al momento del deployment. Se un reindirizzamento, una riscrittura o un'intestazione Next.js non possono essere convertiti in un'intestazione Firebase Hosting equivalente, viene eseguito il fallback e viene creata una funzione, anche se non utilizzi l'ottimizzazione delle immagini o il rendering lato server.
(Facoltativo) Integrare con Firebase Authentication
Gli strumenti di deployment di Firebase compatibili con i framework web manterranno automaticamente sincronizzati lo stato del client e del server utilizzando i cookie. Esistono alcuni metodi forniti per accedere al contesto di autenticazione in SSR:
- L'oggetto Express
res.localsconterrà facoltativamente un'istanza dell'app Firebase autenticata (firebaseApp) e l'utente attualmente connesso (currentUser). È possibile accedervi ingetServerSideProps. - Il nome dell'app Firebase autenticata viene fornito nella query di route
(
__firebaseAppName). Ciò consente l'integrazione manuale nel contesto:
// get the authenticated Firebase App
const firebaseApp = getApp(useRouter().query.__firebaseAppName);