Firebase Hosting reserviert URLs auf Ihrer Website, die mit /__ beginnen. Dieser reservierte Namespace erleichtert die Verwendung anderer Firebase-Produkte zusammen mit Firebase Hosting.
Diese reservierten URLs sind sowohl bei der Bereitstellung auf Firebase ( firebase deploy ) als auch bei der Ausführung Ihrer App auf einem lokalen Server ( firebase serve ) verfügbar.
Skripte für reservierte URLs hinzufügen
Da Firebase Hosting bei der Bereitstellung über HTTP/2 bereitgestellt wird, können Sie die Leistung steigern, indem Sie Dateien vom selben Ursprung laden. Firebase Hosting stellt Version 8 des Firebase JavaScript SDK von speziellen 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 einzuschließen, fügen Sie die folgenden Skripts 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) von einer einzigen Codebasis aus. 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 bietet der reservierte Namespace auch die gesamte Konfiguration, die zum Initialisieren des SDK für das mit der Hosting-Site verknüpfte Firebase-Projekt erforderlich ist. Diese Firebase-Konfiguration und SDK-Initialisierung wird von einem 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 in JSON-Form 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-Funktionen für das 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ügen Sie für ein optimales Erlebnis mit Cloud Messaging auch das Firebase SDK for 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> |
| Echtzeit-Datenbank | <script src="/__/firebase/8.10.1/firebase-database.js"></script> |
| Remote-Konfig ( Beta- Version) | <script src="/__/firebase/8.10.1/firebase-remote-config.js"></script> Fügen Sie für ein optimales Erlebnis mit Remote Config auch das Firebase SDK for 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 eine eindeutige Firebase-Subdomäne haben, wodurch die Sicherheit der Firebase-Authentifizierung erhöht wird.
Darüber hinaus können Sie Ihre eigene benutzerdefinierte Domäne für die Option authDomain von firebase.initializeApp() verwenden. Wenn Sie eine benutzerdefinierte Domäne für das Firebase-Hosting konfigurieren , können Sie beim Initialisieren der Firebase-SDKs auch diese benutzerdefinierte Domäne (anstelle Ihrer Unterdomäne web.app oder firebaseapp.com ) angeben.
Reservierte URLs und Service Worker
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 sie nicht mit einer Liste vorab zwischengespeicherter Elemente übereinstimmt.
Wenn Sie die sw-precache- Bibliothek verwenden, können Sie eine Einstellung für die Fallback-Whitelist für die Navigation hinzufügen, die den reservierten Namespace ausschließt:
{
navigateFallbackWhitelist: [/^(?!\/__).*/]
}
Denken Sie im Allgemeinen daran, dass der Namespace mit doppeltem Unterstrich für die Verwendung von Firebase reserviert ist und dass Sie diese Anforderungen nicht in Ihrem Servicemitarbeiter abfangen sollten.