Firebase zu Ihrer Flutter-App hinzufügen


Vorbereitung

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, indem Sie Folgendes ausführen: Befehl:

    firebase login
    
  3. Installieren Sie die FlutterFire-Befehlszeile, indem Sie den folgenden Befehl in einem beliebigen Verzeichnis:

    dart pub global activate flutterfire_cli
    

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

Mit der FlutterFire-Befehlszeile können Sie Ihre Flutter-Apps so konfigurieren, dass eine Verbindung zu Firebase hergestellt wird.

Führen Sie in Ihrem Flutter-Projektverzeichnis den folgenden Befehl aus, um die Workflow für die App-Konfiguration:

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 in Ihrem Flutter-Projektverzeichnis den folgenden Befehl aus, um sicherzustellen, Die Firebase-Konfiguration Ihrer Flutter-App muss aktuell sein:

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

    import 'package:firebase_core/firebase_core.dart';
    import 'firebase_options.dart';
    
  4. Initialisieren Sie außerdem Firebase in der Datei lib/main.dart mit dem Das von der Konfigurationsdatei exportierte DefaultFirebaseOptions-Objekt:

    await Firebase.initializeApp(
      options: DefaultFirebaseOptions.currentPlatform,
    );
    
  5. Erstellen Sie die Flutter-Anwendung neu:

    flutter run
    

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

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

Schritt 4: Firebase-Plug-ins hinzufügen

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

Da Flutter ein plattformübergreifendes Framework ist, ist jedes Firebase-Plug-in anwendbar. für Apple, Android und Webplattformen. Wenn Sie also ein Firebase-Plug-in Ihre Flutter-App wird von den Apple-, Android- und Webversionen Ihrer für Ihre App.

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

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

    flutter pub add PLUGIN_NAME
  2. Führen Sie in Ihrem 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 danach das Flutter-Projekt neu:

    flutter run
    

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

Verfügbare Plug-ins

Produkt Name des Plug-ins iOS Android Web Andere Apple-Geräte
(z. B. macOS)
Windows
Analytics firebase_analytics
Beta
App Check firebase_app_check
Beta
Authentication firebase_auth
Beta Beta
Cloud Firestore cloud_firestore
Beta Beta
Cloud Functions cloud_functions
Beta
Cloud Messaging firebase_messaging
Beta
Cloud Storage firebase_storage
Beta Beta
Crashlytics firebase_crashlytics
Beta
Dynamic Links firebase_dynamic_links
In-App Messaging firebase_in_app_messaging
Firebase Installationen firebase_app_installations
Beta
ML-Modell-Downloader firebase_ml_model_downloader
Beta
Performance Monitoring firebase_performance
Realtime Database firebase_database
Beta
Remote Config firebase_remote_config
Beta
Vertex AI in Firebase firebase_vertexai
Beta

Mit Analytics eine Beispiel-App ausprobieren

Wie alle Pakete enthält das Plug-in firebase_analytics 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. Zugriff auf das lib-Verzeichnis der App und Löschen des vorhandenen main.dart -Datei.

  3. Aus der Google Analytics Beispielprogramm-Repository Kopieren Sie die folgenden beiden Dateien und fügen Sie sie in das Verzeichnis lib Ihrer Anwendung ein:

    • main.dart
    • tabs_page.dart
  4. Führen Sie die 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 ein aktiver Nutzer angezeigt. im Feld „Nutzer, die in den letzten 30 Minuten aktiv waren“ (möglicherweise benötigen Sie um diesen Bereich zu füllen).

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

Weitere Informationen zum Einrichten von Analytics finden Sie unter „Erste Schritte“ Anleitungen für iOS+, Android und Web.

Nächste Schritte