Firebase zu Ihrer Flutter-App hinzufügen

Vorbereitung

• Installieren Sie Ihren bevorzugten Editor oder Ihre bevorzugte IDE.

• Installieren Sie Flutter für Ihr Betriebssystem, z. B.:

  • Flutter SDK
  • Unterstützte Bibliotheken
  • Plattformspezifische Software und SDKs

• Melden Sie sich mit Ihrem Google-Konto in Firebase an.

Wenn Sie noch keine Flutter-App haben, können Sie mit Einstieg: Testfahrt eine neue Flutter-App mit Ihrem bevorzugten Editor oder Ihrer bevorzugten IDE erstellen.

Schritt 1: Erforderliche Befehlszeilentools installieren

1. Installieren Sie die Firebase-Befehlszeile, falls noch nicht geschehen.

2. Melden Sie sich mit Ihrem Google-Konto in Firebase an. Führen Sie dazu den folgenden Befehl aus:

   firebase login
   

3. Führen Sie den folgenden Befehl in einem beliebigen Verzeichnis aus, um die FlutterFire CLI zu installieren:

   dart pub global activate flutterfire_cli
   

Schritt 2: Apps für die Verwendung von Firebase konfigurieren

Mit der FlutterFire CLI können Sie Ihre Flutter-Apps so konfigurieren, dass sie eine Verbindung zu Firebase herstellen.

Führen Sie im Flutter-Projektverzeichnis den folgenden Befehl aus, um den App-Konfigurationsablauf zu starten:

flutterfire configure

Schritt 3: Firebase in Ihrer App initialisieren

1. Führen Sie im Flutter-Projektverzeichnis den folgenden Befehl aus, um das Core-Plug-in zu installieren:

   flutter pub add firebase_core
   

2. Führen Sie im Flutter-Projektverzeichnis den folgenden Befehl aus, um sicherzustellen, dass die Firebase-Konfiguration Ihrer Flutter-App auf dem neuesten Stand ist:

   flutterfire configure
   

3. Importieren Sie das Firebase-Kern-Plug-in und die zuvor generierte Konfigurationsdatei in die Datei lib/main.dart:

   import 'package:firebase_core/firebase_core.dart';
   import 'firebase_options.dart';
   

4. Initialisieren Sie Firebase in der Datei lib/main.dart mit dem DefaultFirebaseOptions-Objekt, das von der Konfigurationsdatei exportiert wurde:

   WidgetsFlutterBinding.ensureInitialized();
   await Firebase.initializeApp(
     options: DefaultFirebaseOptions.currentPlatform,
   );
   runApp(const MyApp());
   

5. So erstellen Sie Ihre Flutter-Anwendung neu:

   flutter run
   

Wenn Sie lieber ein Demoprojekt verwenden möchten, können Sie den Firebase-Emulator starten und Firebase in Ihrer lib/main.dart-Datei mit demoProjectId initialisieren (die Datei sollte mit demo- beginnen):

  await Firebase.initializeApp(
    demoProjectId: "demo-project-id",
  );

Schritt 4: Firebase-Plug-ins hinzufügen

In Ihrer Flutter-App greifen Sie über die verschiedenen Firebase-Flutter-Plug-ins auf Firebase zu, jeweils eines für jedes Firebase-Produkt (z. B. Cloud Firestore, Authentication, Analytics usw.).

Da Flutter ein plattformübergreifendes Framework ist, kann jedes Firebase-Plug-in für Apple-, Android- und Webplattformen verwendet werden. Wenn Sie also Ihrer Flutter-App ein Firebase-Plug-in hinzufügen, wird es von den Apple-, Android- und Webversionen Ihrer App verwendet.

So fügen Sie ein Firebase-Flutter-Plug-in hinzu:

1. Führen Sie im Flutter-Projektverzeichnis den folgenden Befehl aus:

   flutter pub add PLUGIN_NAME

2. Führen Sie im Flutter-Projektverzeichnis den folgenden Befehl aus:

   flutterfire configure
   

   Wenn Sie diesen Befehl ausführen, wird die Firebase-Konfiguration Ihrer Flutter-App auf den neuesten Stand gebracht und Ihrer App werden die erforderlichen Gradle-Plug-ins für Crashlytics und Performance Monitoring auf Android hinzugefügt.

3. Erstellen Sie anschließend Ihr Flutter-Projekt neu:

   flutter run
   

Fertig! Ihre Flutter-Apps sind registriert und für die Verwendung von Firebase konfiguriert.

Verfügbare Plug-ins

Beispiel-App mit Analytics ausprobieren

Wie alle Pakete enthält auch das firebase_analytics-Plug-in ein Beispielprogramm.

1. Öffnen Sie eine Flutter-App, die Sie bereits für die Verwendung von Firebase konfiguriert haben (siehe Anleitung auf dieser Seite).

2. Rufen Sie das Verzeichnis lib der App auf und löschen Sie die vorhandene Datei main.dart.

3. Kopieren Sie die folgenden beiden Dateien aus dem Google Analytics-Beispielprogramm-Repository in das Verzeichnis lib Ihrer App:

   • main.dart
   • tabs_page.dart

4. Führen Sie Ihre Flutter-App aus.

5. Rufen Sie in der Firebase Console das Firebase-Projekt Ihrer App auf und klicken Sie dann links im Navigationsbereich auf Analytics.

   1. Klicken Sie auf Dashboard. Wenn Analytics ordnungsgemäß funktioniert, wird im Dashboard im Bereich „In den letzten 30 Minuten aktive Nutzer“ ein aktiver Nutzer angezeigt. Es kann einige Zeit dauern, bis dieser Bereich gefüllt ist.

   2. Klicken Sie auf DebugView. Aktivieren Sie die Funktion, um alle vom Beispielprogramm generierten Ereignisse zu sehen.

Weitere Informationen zum Einrichten von Analytics finden Sie in den Einführungsleitfäden für iOS +, Android und Web.

Nächste Schritte

• Im Firebase Flutter Codelab können Sie praktische Erfahrungen sammeln.

• Einführung Ihrer App vorbereiten:

  • Richten Sie in der Google Cloud Console Budgetbenachrichtigungen für Ihr Projekt ein.
  • Im Firebase-Dashboard Nutzung und Abrechnung können Sie sich ein Gesamtbild der Nutzung Ihres Projekts in mehreren Firebase-Diensten machen.
  • Sehen Sie sich die Checkliste für die Einführung von Firebase an.