Firebase Hosting reserviert URLs auf Ihrer Website, die mit /__ beginnen. Mit diesem reservierten Namespace können Sie andere Firebase-Produkte einfacher mit Firebase Hosting verwenden.
Diese reservierten URLs sind sowohl verfügbar, wenn Sie die App in Firebase (firebase deploy) bereitstellen oder wenn Sie Ihre App auf einem lokalen Server ausführen (firebase serve).
Scripts für reservierte URLs hinzufügen
Da Firebase Hosting beim Bereitstellen über HTTP/2 bereitgestellt wird, kannst du die Leistung steigern, indem du Dateien aus derselben Quelle lädst. Firebase Hosting stellt Version 8 des Firebase JavaScript SDK über spezielle URLs bereit, die so formatiert sind:
/__/firebase/JS_SDK_VERSION/FIREBASE_SDK_NAME.js
Wir empfehlen dringend, nur die Bibliotheken zu laden, die Sie in Ihrer App verwenden. Wenn Sie beispielsweise nur Authentication und Cloud Firestore einbinden möchten, fügen Sie die folgenden Scripts unten in das <body>-Tag ein, 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
Mit der automatischen SDK-Konfiguration können Sie mehrere Umgebungen (z. B. Entwicklungs-, Staging- und Produktionsumgebungen) über eine einzige Codebasis verwalten. Wenn Sie die reservierte Hosting-URL verwenden, können Sie denselben Code in mehreren Firebase-Projekten bereitstellen.
Neben dem Hosting der SDKs selbst enthält der reservierte Namespace auch die gesamte Konfiguration, die zum Initialisieren des SDKs für das Firebase-Projekt erforderlich ist, das mit der Hosting-Website verknüpft ist. Diese Firebase-Konfiguration und SDK-Initialisierung werden über ein Script 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 auf Firebase bereitstellen oder lokal testen, konfiguriert dieses Script automatisch das Firebase JavaScript SDK für das aktive Firebase-Projekt und initialisiert es.
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 Core (erforderlich) |
<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> |
| 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 eine optimale Nutzung von Cloud Messaging sollten Sie auch das Firebase SDK für Analytics hinzufügen. |
| Cloud Storage | <script src="/__/firebase/8.10.1/firebase-storage.js"></script> |
|
Performance Monitoring
(Betaversion) |
<script src="/__/firebase/8.10.1/firebase-performance.js"></script> |
| Realtime Database | <script src="/__/firebase/8.10.1/firebase-database.js"></script> |
| Remote Config
(Beta-Version) |
<script src="/__/firebase/8.10.1/firebase-remote-config.js"></script> Für eine optimale Nutzung von Remote Config sollten Sie außerdem das Firebase SDK für Analytics hinzufügen. |
| Firebase JavaScript SDK (gesamtes SDK) |
<script src="/__/firebase/8.10.1/firebase.js"></script> |
Auth-Hilfsprogramme
Firebase Authentication verwendet den reservierten Namespace, um spezielle JavaScript- und HTML-Code für die Authentifizierung bei Anbietern über OAuth bereitzustellen. So kann jedes Firebase-Projekt eine eindeutige Firebase-Subdomain haben, was die Sicherheit von Firebase Authentication erhöht.
Außerdem können Sie Ihre eigene benutzerdefinierte Domain für die authDomain-Option von firebase.initializeApp() verwenden. Wenn Sie eine benutzerdefinierte Domain für Firebase Hosting konfigurieren, können Sie diese benutzerdefinierte Domain auch anstelle Ihrer web.app- oder firebaseapp.com-Subdomain angeben, wenn Sie die Firebase SDKs initialisieren. Weitere Informationen zur Verwendung einer benutzerdefinierten Domain finden Sie unter Best Practices für die Verwendung von „signInWithWeiterleitung“.
Reservierte URLs und Dienst-Worker
Wenn Sie eine progressive Web-App (PWA) entwickeln, können Sie einen Service Worker mit einem Navigations-Fallback erstellen, der standardmäßig eine bestimmte URL rendert, wenn sie nicht mit einer Liste der vorab im Cache gespeicherten Elemente übereinstimmt.
Wenn Sie die sw-precache-Bibliothek verwenden, können Sie eine Fallback-Einstellung für die Navigationsliste hinzufügen, die den reservierten Namespace ausschließt:
{
navigateFallbackWhitelist: [/^(?!\/__).*/]
}
Denken Sie im Allgemeinen daran, dass der Namespace mit zwei Unterstrichen für die Firebase-Nutzung reserviert ist und dass Sie diese Anfragen nicht in Ihrem Dienstarbeiter abfangen sollten.