Carica gli SDK Firebase da URL riservati

Firebase Hosting prenota URL nel tuo sito che iniziano con /__. Questo lo spazio dei nomi riservato semplifica l'utilizzo di altri prodotti Firebase insieme Firebase Hosting.

Questi URL riservati sono disponibili sia quando esegui il deployment su Firebase (firebase deploy) sia quando esegui l'app su un server locale (firebase serve).

Aggiungi script per gli URL riservati

Poiché Firebase Hosting viene gestito tramite HTTP/2 durante il deployment, puoi ottimizzare le prestazioni caricando file dalla stessa origine. Servizi di Firebase Hosting versione 8 dell'SDK Firebase JavaScript da URL speciali formattati in questo modo:

/__/firebase/JS_SDK_VERSION/FIREBASE_SDK_NAME.js

Ti consigliamo vivamente di caricare solo le librerie che che usi nell'app. Ad esempio, per includere solo Authentication e Cloud Firestore, aggiungi i seguenti script in fondo a <body> ma prima di utilizzare qualsiasi servizio Firebase:

<body>
  <!-- Insert these scripts at the bottom of the HTML, but before you use any Firebase services -->
  <!-- Firebase App (the core Firebase SDK) is always required and must be listed first -->
  <script src="/__/firebase/8.10.1/firebase-app.js"></script>

  <!-- Add Firebase products that you want to use -->
  <script src="/__/firebase/8.10.1/firebase-auth.js"></script>
  <script src="/__/firebase/8.10.1/firebase-firestore.js"></script>
</body>

Configurazione automatica degli SDK

La configurazione automatica dell'SDK semplifica la gestione di più ambienti (come sviluppo, gestione temporanea e produzione) da un'unica base di codice. Basandosi sulle URL Hosting prenotato, puoi eseguire il deployment dello stesso codice su più URL Firebase in modo programmatico a gestire i progetti.

Oltre a ospitare gli SDK stessi, lo spazio dei nomi riservato fornisce anche tutta la configurazione necessaria per inizializzare l'SDK per il progetto Firebase associato al sito Hosting. Questa configurazione di Firebase e l'inizializzazione dell'SDK vengono fornite da uno script che puoi includere direttamente:

<!-- Load the Firebase SDKs before loading this file -->
<script src="/__/firebase/init.js"></script>

Quando esegui il deployment su Firebase o esegui il test della tua app in locale, lo script viene creato automaticamente configura l'SDK JavaScript Firebase per progetto Firebase attivo e inizializza l'SDK.

Se preferisci controllare personalmente l'inizializzazione, la configurazione di Firebase sono disponibili anche in formato JSON:

fetch('/__/firebase/init.json').then(async response => {
  firebase.initializeApp(await response.json());
});

SDK Firebase JS disponibili (da Hosting URL riservati)

.
Prodotto Firebase Riferimento alla libreria (URL prenotato)
Firebase core
(obbligatorio)
<script src="/__/firebase/8.10.1/firebase-app.js"></script>
Analytics
<script src="/__/firebase/8.10.1/firebase-analytics.js"></script>
App Check
<script src="/__/firebase/8.10.1/firebase-app-check.js"></script>
Authentication
<script src="/__/firebase/8.10.1/firebase-auth.js"></script>
Cloud Firestore
<script src="/__/firebase/8.10.1/firebase-firestore.js"></script>
Cloud Functions for Firebase Client SDK
<script src="/__/firebase/8.10.1/firebase-functions.js"></script>
Installazioni Firebase
<script src="/__/firebase/8.10.1/firebase-installations.js"></script>
Cloud Messaging
<script src="/__/firebase/8.10.1/firebase-messaging.js"></script>

Per un'esperienza ottimale con Cloud Messaging, aggiungi anche l'SDK Firebase per Analytics.

Cloud Storage
<script src="/__/firebase/8.10.1/firebase-storage.js"></script>
Performance Monitoring
(release beta)
<script src="/__/firebase/8.10.1/firebase-performance.js"></script>
Realtime Database
<script src="/__/firebase/8.10.1/firebase-database.js"></script>
Remote Config
(release beta)
<script src="/__/firebase/8.10.1/firebase-remote-config.js"></script>

Per un'esperienza ottimale con Remote Config, aggiungi anche l'SDK Firebase per Analytics.

Firebase SDK JavaScript
(intero SDK)
<script src="/__/firebase/8.10.1/firebase.js"></script>

Aiuto per l'autenticazione

Firebase Authentication utilizza lo spazio dei nomi riservato per fornire JavaScript e HTML speciali per completare l'autenticazione con i fornitori tramite OAuth. In questo modo ogni progetto Firebase può avere un Sottodominio Firebase, aumentando la sicurezza di Firebase Authentication.

Inoltre, questo ti consente di utilizzare il tuo dominio personalizzato per authDomain di firebase.initializeApp(). Se configuri un dominio personalizzato per Firebase Hosting, puoi anche specificare questo dominio personalizzato (invece del sottodominio web.app o firebaseapp.com) durante l'inizializzazione degli SDK Firebase. Per ulteriori dettagli sull'utilizzo di un dominio personalizzato, consulta le best practice per l'utilizzo di signInWithRedirect.

URL riservati e service worker

Se stai creando un'app web progressiva (PWA), potresti creare un servizio worker con una "navigazione di riserva" ed esegue il rendering di un URL specifico per impostazione predefinita se non corrispondono a un elenco di elementi prememorizzati nella cache.

Se utilizzi sw-precache puoi aggiungere un'impostazione della lista consentita di navigazione di riserva che escluda il spazio dei nomi riservato:

{
  navigateFallbackWhitelist: [/^(?!\/__).*/]
}

In generale, ricorda che lo spazio dei nomi con due trattini bassi è riservato all'utilizzo di Firebase e che non devi intercettare queste richieste nel tuo worker di servizio.