Firebase Hosting reserviert URLs auf Ihrer Website, die mit /__ beginnen. Dieser reservierte Namensraum erleichtert die Nutzung anderer Firebase-Produkte zusammen mit Firebase Hosting.
Diese reservierten URLs sind sowohl verfügbar, wenn Sie sie in Firebase bereitstellen ( firebase deploy ), als auch wenn Sie Ihre App auf einem lokalen Server ausführen ( firebase serve ).
Fügen Sie Skripte für reservierte URLs hinzu
Da Firebase Hosting bei der Bereitstellung über HTTP/2 bereitgestellt wird, können Sie die Leistung steigern, indem Sie Dateien vom gleichen Ursprung laden. Firebase Hosting stellt Version 8 des Firebase JavaScript SDK über spezielle URLs bereit, die wie folgt formatiert sind:
/__/firebase/JS_SDK_VERSION/FIREBASE_SDK_NAME.js
Wir empfehlen dringend, nur die Bibliotheken zu laden, die Sie in Ihrer App verwenden. Um beispielsweise nur Authentifizierung und Cloud Firestore einzubeziehen, fügen Sie die folgenden Skripte am Ende Ihres <body> -Tags hinzu, aber bevor Sie Firebase-Dienste verwenden:
<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>
Automatische SDK-Konfiguration
Die automatische SDK-Konfiguration erleichtert die Verwaltung mehrerer Umgebungen (z. B. Entwicklung, Staging und Produktion) über eine einzige Codebasis. Indem Sie sich auf die reservierte Hosting-URL verlassen, können Sie denselben Code für mehrere Firebase-Projekte bereitstellen.
Zusätzlich zum Hosten der SDKs selbst stellt der reservierte Namespace auch die gesamte Konfiguration bereit, die zum Initialisieren des SDK für das Firebase-Projekt erforderlich ist, das mit der Hosting-Site verknüpft ist. Diese Firebase-Konfiguration und SDK-Initialisierung wird durch ein Skript bereitgestellt, das Sie direkt einbinden können:
<!-- Load the Firebase SDKs before loading this file -->
<script src="/__/firebase/init.js"></script>
Wenn Sie Ihre App in Firebase bereitstellen oder lokal testen, konfiguriert dieses Skript automatisch das Firebase JavaScript SDK für das aktive Firebase-Projekt und initialisiert das SDK.
Wenn Sie die Initialisierung lieber selbst steuern möchten, sind die Firebase-Konfigurationswerte auch im JSON-Format verfügbar:
fetch('/__/firebase/init.json').then(async response => {
firebase.initializeApp(await response.json());
});
Verfügbare Firebase JS SDKs (von reservierten Hosting-URLs)
| Firebase-Produkt | Bibliotheksreferenz (reservierte URL) |
|---|---|
| Firebase-Kern (erforderlich) | <script src="/__/firebase/8.10.1/firebase-app.js"></script> |
| Analytik | <script src="/__/firebase/8.10.1/firebase-analytics.js"></script> |
| App-Check | <script src="/__/firebase/8.10.1/firebase-app-check.js"></script> |
| Authentifizierung | <script src="/__/firebase/8.10.1/firebase-auth.js"></script> |
| Cloud Firestore | <script src="/__/firebase/8.10.1/firebase-firestore.js"></script> |
| Cloud Functions für Firebase Client SDK | <script src="/__/firebase/8.10.1/firebase-functions.js"></script> |
| Firebase-Installationen | <script src="/__/firebase/8.10.1/firebase-installations.js"></script> |
| Cloud-Messaging | <script src="/__/firebase/8.10.1/firebase-messaging.js"></script> Für ein optimales Erlebnis mit Cloud Messaging fügen Sie außerdem das Firebase SDK für Analytics hinzu. |
| Cloud-Speicher | <script src="/__/firebase/8.10.1/firebase-storage.js"></script> |
| Leistungsüberwachung ( Beta- Version) | <script src="/__/firebase/8.10.1/firebase-performance.js"></script> |
| Echtzeitdatenbank | <script src="/__/firebase/8.10.1/firebase-database.js"></script> |
| Remote-Konfiguration ( Beta- Version) | <script src="/__/firebase/8.10.1/firebase-remote-config.js"></script> Für ein optimales Erlebnis mit Remote Config fügen Sie außerdem das Firebase SDK für Analytics hinzu. |
| Firebase JavaScript SDK (gesamtes SDK) | <script src="/__/firebase/8.10.1/firebase.js"></script> |
Auth-Helfer
Die Firebase-Authentifizierung verwendet den reservierten Namespace, um spezielles JavaScript und HTML bereitzustellen, um die Authentifizierung bei Anbietern über OAuth abzuschließen. Dadurch kann jedes Firebase-Projekt über eine eindeutige Firebase-Subdomäne verfügen, was die Sicherheit der Firebase-Authentifizierung erhöht.
Darüber hinaus können Sie so Ihre eigene benutzerdefinierte Domäne für die authDomain Option von firebase.initializeApp() verwenden. Wenn Sie eine benutzerdefinierte Domäne für Firebase Hosting konfigurieren , können Sie diese benutzerdefinierte Domäne (anstelle Ihrer web.app oder firebaseapp.com Subdomäne) auch beim Initialisieren der Firebase SDKs angeben.
Reservierte URLs und Servicemitarbeiter
Wenn Sie eine Progressive Web App (PWA) erstellen, können Sie einen Service Worker erstellen, der über einen „Navigations-Fallback“ verfügt und standardmäßig eine bestimmte URL rendert, wenn diese nicht mit einer Liste vorab zwischengespeicherter Elemente übereinstimmt.
Wenn Sie die sw-precache- Bibliothek verwenden, können Sie eine Navigations-Fallback-Whitelist-Einstellung hinzufügen, die den reservierten Namespace ausschließt:
{
navigateFallbackWhitelist: [/^(?!\/__).*/]
}
Denken Sie im Allgemeinen daran, dass der Namespace mit doppeltem Unterstrich für die Firebase-Nutzung reserviert ist und dass Sie diese Anfragen in Ihrem Service Worker nicht abfangen sollten.