Web-Apps überwachen und schützen

Nachdem Sie Ihre Apps veröffentlicht haben, sollten Sie sie im Blick behalten und schützen:

Leistung Ihrer Website mit App Hosting-Beobachtbarkeit überwachen

Im Bereich App-Übersicht in Firebase Studio finden Sie wichtige Messwerte und Informationen zu Ihrer Anwendung. So können Sie die Leistung Ihrer Webanwendung mit den integrierten Beobachtbarkeitstools von App Hosting überwachen. Nachdem Ihre Website veröffentlicht wurde, können Sie die Übersicht aufrufen, indem Sie auf Veröffentlichen klicken. In diesem Bereich haben Sie folgende Möglichkeiten:

  • Klicken Sie auf Veröffentlichen, um eine neue Version Ihrer App zu veröffentlichen.
  • Teilen Sie den Link zu Ihrer App oder öffnen Sie Ihre App direkt unter App aufrufen.
  • Hier finden Sie eine Zusammenfassung der Leistung Ihrer App in den letzten 7 Tagen, einschließlich der Gesamtzahl der Anfragen und des Status Ihres letzten Roll-outs. Klicken Sie auf Details ansehen, um weitere Informationen in der Firebase-Console aufzurufen.
  • Sehen Sie sich ein Diagramm mit der Anzahl der Anfragen an, die Ihre Anwendung in den letzten 24 Stunden erhalten hat, aufgeschlüsselt nach HTTP-Statuscode.
  • Aktivierungsstatus von Firebase-Diensten wie Firebase Authentication und Cloud Firestore ansehen.

Wenn Sie den Bereich „App-Übersicht“ schließen, können Sie ihn jederzeit wieder öffnen, indem Sie auf Veröffentlichen klicken.

Weitere Informationen zum Verwalten und Überwachen von App Hosting-Roll-outs finden Sie unter Roll-outs und Releases verwalten.

Genkit-Monitoring für Ihre bereitgestellten Features

Sie können die Schritte, Eingaben und Ausgaben Ihrer Genkit-Funktion überwachen, indem Sie die Telemetrie für Ihren AI Flow-Code aktivieren. Mit der Telemetriefunktion für Genkit können Sie die Leistung und Nutzung Ihrer KI-Abläufe überwachen. Anhand dieser Daten können Sie Bereiche mit Verbesserungspotenzial identifizieren, Probleme beheben, Ihre Prompts und Abläufe für eine bessere Leistung und Kosteneffizienz optimieren und die Nutzung Ihrer Abläufe im Zeitverlauf verfolgen.

Wenn Sie das Monitoring in Genkit einrichten möchten, fügen Sie den Genkit-KI-Abläufen Telemetrie hinzu und rufen die Ergebnisse dann in der Firebase-Console auf.

Schritt 1: Telemetrie zum Genkit-Flow-Code in Firebase Studio hinzufügen

So richten Sie das Monitoring in Ihrem Code ein:

  1. Wenn Sie sich noch nicht in der Ansicht Code befinden, klicken Sie auf Symbol für Code-Switching Zu Code wechseln, um sie zu öffnen.

  2. Prüfen Sie package.json, um die installierte Version von Genkit zu ermitteln.

  3. Öffnen Sie das Terminal (Ctrl-Shift-C oder Cmd-Shift-C unter macOS).

  4. Klicken Sie in das Terminal und installieren Sie das Firebase-Plug-in. Verwenden Sie dabei die Version, die Ihrer package.json-Datei entspricht. Wenn die Genkit-Pakete in Ihrer package.json beispielsweise die Version 1.0.4 haben, sollten Sie den folgenden Befehl ausführen, um das Plug-in zu installieren:

    npm i --save @genkit-ai/firebase@1.0.4

  5. Maximieren Sie im Explorer die Option src > ai > flows. Eine oder mehrere TypeScript-Dateien, die Ihre Genkit-Abläufe enthalten, werden im Ordner flows angezeigt.

  6. Klicken Sie auf einen der Abläufe, um ihn zu öffnen.

  7. Fügen Sie unten im Importabschnitt der Datei Folgendes hinzu, um FirebaseTelemetry zu importieren und zu aktivieren:

    import { enableFirebaseTelemetry } from '@genkit-ai/firebase';

enableFirebaseTelemetry();

Schritt 2: Berechtigungen einrichten

Firebase Studio hat die erforderlichen APIs für Sie aktiviert, als Ihr Firebase-Projekt eingerichtet wurde. Sie müssen dem Dienstkonto App Hosting jedoch auch Berechtigungen erteilen.

So richten Sie Berechtigungen ein:

  1. Rufen Sie in der Google Cloud Console die Seite IAM auf und wählen Sie Ihr Firebase-Projekt aus.

  2. Weisen Sie dem App Hosting-Dienstkonto die folgenden Rollen zu:

    • Monitoring-Messwert-Autor (roles/monitoring.metricWriter)
    • Cloud Trace-Agent (roles/cloudtrace.agent)
    • Log-Autor (roles/logging.logWriter)

  3. Veröffentlichen Sie Ihre App noch einmal in App Hosting.

  4. Wenn die Veröffentlichung abgeschlossen ist, laden Sie Ihre App und verwenden Sie sie. Nach fünf Minuten sollte Ihre Anwendung mit dem Logging von Telemetriedaten beginnen.

Schritt 3: Generative KI-Funktionen in der Firebase Console beobachten

Wenn die Telemetrie konfiguriert ist, zeichnet Genkit die Anzahl der Anfragen, den Erfolg und die Latenz für alle Ihre Abläufe auf. Für jeden einzelnen Ablauf erfasst Genkit Stabilitätsmesswerte, zeigt detaillierte Diagramme an und protokolliert erfasste Traces.

So überwachen Sie Ihre mit Genkit implementierten KI-Funktionen:

  1. Rufen Sie nach fünf Minuten in der Firebase-Konsole KI-Dienste > Genkit auf, um Prompts und Antworten von Genkit zu prüfen.

  2. Sie können sich die folgenden Stabilitätsmesswerte ansehen, die von Genkit zusammengestellt wurden:

    • Anfragen insgesamt: Die Gesamtzahl der Anfragen, die von Ihrem Ablauf empfangen wurden.
    • Erfolgsquote: Der Prozentsatz der Anfragen, die erfolgreich verarbeitet wurden.
    • Latenz am 95. Perzentil: Die Latenz Ihres Ablaufs am 95. Perzentil. Das ist die Zeit, die für die Verarbeitung von 95 % der Anfragen benötigt wird.

    • Tokennutzung:

      • Eingabetokens: Die Anzahl der Tokens, die im Prompt an das Modell gesendet werden.
      • Ausgabetokens: Die Anzahl der Tokens, die vom Modell in der Antwort generiert werden.

    • Bildnutzung:

      • Eingabebilder: Die Anzahl der Bilder, die im Prompt an das Modell gesendet wurden.
      • Ausgabebilder: Die Anzahl der Bilder, die vom Modell in der Antwort generiert werden.

  3. Sie können die Stabilitätsmesswerte maximieren, um die folgenden detaillierten Diagramme aufzurufen:

    • Anfragevolumen im Zeitverlauf.
    • Erfolgsquote im Zeitverlauf.
    • Eingabe- und Ausgabetokens im Zeitverlauf.
    • Latenz (95. und 50. Perzentil) im Zeitverlauf.

Weitere Informationen zu Genkit finden Sie in der Dokumentation.

App mit Firebase App Check schützen

Wenn Sie Firebase- oder Google Cloud-Dienste in Ihre App eingebunden haben, hilft Firebase App Check, Ihre App-Backends vor Missbrauch zu schützen, indem nicht autorisierte Clients am Zugriff auf Ihre Firebase-Ressourcen gehindert werden. Sie funktioniert sowohl mit Google-Diensten (einschließlich Firebase- und Google Cloud-Diensten) als auch mit Ihren eigenen benutzerdefinierten Back-Ends, um Ihre Ressourcen zu schützen.

Wir empfehlen, App Check zu allen öffentlich geposteten Apps hinzuzufügen, um Ihre Back-End-Ressourcen vor Missbrauch zu schützen.

In diesem Abschnitt wird beschrieben, wie Sie App Check in Firebase Studio mit reCAPTCHA Enterprise für eine Webanwendung einrichten, die von App Prototyping agent erstellt wurde. Sie können App Check jedoch in jeder Anwendung einrichten, die Firebase-Dienste implementiert und benutzerdefinierte Anbieter implementieren kann. Weitere Informationen findest du unter Firebase App Check.

reCAPTCHA Enterprise bietet bis zu 10.000 kostenlose Bewertungen.

Schritt 1: reCAPTCHA Enterprise für Ihre App einrichten

  1. Öffnen Sie in der Google Cloud Console den Bereich reCAPTCHA Enterprise.

  2. Wählen Sie den Namen Ihres Firebase-Projekts in der Projektauswahl der Google Cloud Console aus.

  3. Wenn Sie aufgefordert werden, die reCAPTCHA Enterprise API zu aktivieren, tun Sie dies.

  4. Klicken Sie auf Jetzt starten und fügen Sie einen Anzeigenamen für Ihren reCAPTCHA-Websiteschlüssel hinzu.

  5. Übernehmen Sie den standardmäßigen Anwendungstyp-Schlüssel Web.

  6. Klicken Sie auf Domain hinzufügen und fügen Sie eine Domain hinzu. Sie sollten Ihre App Hosting-Domain (z. B. studio--PROJECT_ID.REGION.hosted.app) und alle benutzerdefinierten Domains hinzufügen, die Sie mit Ihrer Anwendung verwenden oder verwenden möchten.

  7. Klicken Sie auf Nächster Schritt.

  8. Lassen Sie Möchten Sie Aufgaben verwenden? deaktiviert.

  9. Klicken Sie auf Schlüssel erstellen.

  10. Kopieren und speichern Sie Ihre Schlüssel-ID und fahren Sie mit App Check konfigurieren fort.

Schritt 2: App Check konfigurieren

  1. Öffnen Sie die Firebase-Konsole und klicken Sie im Navigationsmenü auf Build > App Check.

  2. Klicken Sie auf Jetzt starten und dann neben Ihrer App auf Registrieren.

  3. Klicken Sie auf ReCAPTCHA, um den Bereich zu maximieren, und fügen Sie die Schlüssel-ID ein, die Sie für reCAPTCHA Enterprise generiert haben.

  4. Klicken Sie auf Speichern.

Schritt 3: App Check zum Code hinzufügen

  1. Kehren Sie zu Firebase Studio zurück und fügen Sie in der Ansicht Code den generierten Websiteschlüssel in die Datei .env ein:

    NEXT_PUBLIC_RECAPTCHA_SITE_KEY=RECAPTCHA_SITE_KEY

  2. Wenn Sie Ihre Firebase-Konfiguration noch nicht in .env gespeichert haben, rufen Sie sie ab:

    • Öffnen Sie in der Firebase-Konsole die Projekteinstellungen und suchen Sie nach dem Abschnitt, der Ihrer App entspricht.

    • Über das Terminal in der Code-Ansicht:

      1. Melden Sie sich in Firebase an: firebase auth login
      2. Wählen Sie Ihr Projekt aus: firebase use FIREBASE_PROJECT_ID
      3. Rufen Sie die Firebase-Konfiguration ab: firebase apps:sdkconfig

  3. Fügen Sie die Konfiguration der Datei .env hinzu, sodass sie so aussieht:

    NEXT_PUBLIC_FIREBASE_API_KEY=FIREBASE_API_KEY
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=FIREBASE_AUTH_DOMAIN
NEXT_PUBLIC_FIREBASE_PROJECT_ID=FIREBASE_PROJECT_ID
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=FIREBASE_STORAGE_BUCKET
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=FIREBASE_MESSAGING_SENDER_ID
NEXT_PUBLIC_FIREBASE_APP_ID=FIREBASE_APP_ID
NEXT_PUBLIC_RECAPTCHA_SITE_KEY=RECAPTCHA_SITE_KEY

  4. Fügen Sie App Check zum Code Ihrer App hinzu. Sie können Gemini bitten, App Check mit reCAPTCHA Enterprise zu Ihrer App hinzuzufügen (geben Sie „reCAPTCHA Enterprise“ an und prüfen Sie es noch einmal) oder folgen Sie der Anleitung unter App Check initialisieren.

  5. Veröffentlichen Sie Ihre Website unter App Hosting noch einmal. Testen Sie Ihre Datenbank- und Authentifizierungsfunktionen, um einige Daten zu generieren.

  6. Prüfen Sie, ob App Check in der Firebase-Konsole Anfragen empfängt. Öffnen Sie dazu Build > App Check.

  7. Klicken Sie, um Cloud Firestore zu prüfen. Nachdem Sie überprüft haben, dass Anfragen eingehen, klicken Sie auf Erzwingen, um App Check zu erzwingen.

  8. Wiederholen Sie die Überprüfung und Durchsetzung für Firebase Authentication.

Wenn Sie Ihre App für App Check registriert haben und sie in einer Umgebung ausführen möchten, die von App Check normalerweise nicht als gültig eingestuft wird, z. B. lokal während der Entwicklung oder in einer CI-Umgebung (Continuous Integration), können Sie einen Debug-Build Ihrer App erstellen, der den App Check-Debug-Anbieter anstelle eines echten Attestierungsanbieters verwendet. Weitere Informationen finden Sie unter App Check mit dem Debug-Anbieter in Web-Apps verwenden.

Nächste Schritte