Erste Schritte mit App Check mit reCAPTCHA v3 in Web-Apps

Auf dieser Seite erfahren Sie, wie Sie App Check in einer Webanwendung mit dem integrierten reCAPTCHA v3-Anbieter aktivieren. Wenn Sie App Check aktivieren, können nur Ihre Apps auf die Firebase-Ressourcen Ihres Projekts zugreifen. Übersicht über diese Funktion

reCAPTCHA v3 ist für Nutzer nicht sichtbar. Beim reCAPTCHA v3-Anbieter müssen Nutzer zu keinem Zeitpunkt eine Aufgabe lösen. Weitere Informationen finden Sie in der Dokumentation zu reCAPTCHA v3.

Wenn Sie App Check mit Ihrem eigenen benutzerdefinierten Anbieter verwenden möchten, lesen Sie den Abschnitt Benutzerdefinierten App Check-Anbieter implementieren.

1. Das Firebase-Projekt einrichten

  1. Fügen Sie Ihrem JavaScript-Projekt Firebase hinzu, falls noch nicht geschehen.

  2. Registrieren Sie Ihre Website für reCAPTCHA v3 und rufen Sie Ihren reCAPTCHA v3-Websiteschlüssel und Ihren geheimen Schlüssel ab.

  3. Registrieren Sie Ihre Apps für die Verwendung von App Check beim reCAPTCHA-Anbieter im Bereich App Check der Firebase-Konsole. Sie müssen den geheimen Schlüssel angeben, den Sie im vorherigen Schritt erhalten haben.

    Normalerweise müssen Sie alle Apps Ihres Projekts registrieren, da nach der Aktivierung der Erzwingung für ein Firebase-Produkt nur registrierte Apps auf die Backend-Ressourcen des Produkts zugreifen können.

  4. Optional: Legen Sie in den Einstellungen für die App-Registrierung eine benutzerdefinierte Gültigkeitsdauer (Time to Live, TTL) für App Check-Tokens fest, die vom Anbieter ausgestellt werden. Sie können die TTL auf einen beliebigen Wert zwischen 30 Minuten und 7 Tagen festlegen. Beachten Sie beim Ändern dieses Werts die folgenden Kompromisse:

    • Sicherheit: Kürzere TTLs bieten mehr Sicherheit, da sie das Zeitfenster verringern, in dem ein geleaktes oder abgefangenes Token von einem Angreifer missbraucht werden kann.
    • Leistung: Bei kürzeren TTLs wird die Gerätebestätigung in Ihrer App häufiger ausgeführt. Da das App-Attestierungsverfahren bei jeder Ausführung die Latenz von Netzwerkanfragen erhöht, kann sich eine kurze TTL auf die Leistung Ihrer App auswirken.
    • Kontingent und Kosten: Kürzere TTLs und häufige erneute Attestierungen verbrauchen Ihr Kontingent schneller und können bei kostenpflichtigen Diensten zu höheren Kosten führen. Weitere Informationen finden Sie unter Kontingente und Limits.

    Die Standard-TTL von 1 Tag ist für die meisten Apps angemessen. Die App Check-Bibliothek aktualisiert Tokens etwa nach der Hälfte der TTL-Dauer.

2. App Check-Bibliothek zur App hinzufügen

Fügen Sie Ihrer Web-App Firebase hinzu, falls noch nicht geschehen. Achten Sie darauf, die App Check-Bibliothek zu importieren.

3. App Check initialisieren

Fügen Sie Ihrer Anwendung den folgenden Initialisierungscode hinzu, bevor Sie auf Firebase-Dienste zugreifen. Sie müssen Ihren reCAPTCHA-Websiteschlüssel, den Sie in der reCAPTCHA-Konsole erstellt haben, an activate() übergeben.

Web

import { initializeApp } from "firebase/app";
import { initializeAppCheck, ReCaptchaV3Provider } from "firebase/app-check";

const app = initializeApp({
  // Your firebase configuration object
});

// Pass your reCAPTCHA v3 site key (public key) to activate(). Make sure this
// key is the counterpart to the secret key you set in the Firebase console.
const appCheck = initializeAppCheck(app, {
  provider: new ReCaptchaV3Provider('abcdefghijklmnopqrstuvwxy-1234567890abcd'),

  // Optional argument. If true, the SDK automatically refreshes App Check
  // tokens as needed.
  isTokenAutoRefreshEnabled: true
});
appcheck_initialize.js

Web

firebase.initializeApp({
  // Your firebase configuration object
});

const appCheck = firebase.appCheck();
// Pass your reCAPTCHA v3 site key (public key) to activate(). Make sure this
// key is the counterpart to the secret key you set in the Firebase console.
appCheck.activate(
  'abcdefghijklmnopqrstuvwxy-1234567890abcd',

  // Optional argument. If true, the SDK automatically refreshes App Check
  // tokens as needed.
  true);
index.js

Nächste Schritte

Nachdem die App Check-Bibliothek in Ihrer App installiert wurde, stellen Sie sie bereit.

Die aktualisierte Client-App sendet App Check-Tokens zusammen mit jeder Anfrage an Firebase. Bei Firebase-Produkten müssen die Tokens jedoch erst gültig sein, wenn Sie die Erzwingung im Bereich App Check der Firebase Console aktivieren.

Messwerte im Blick behalten und Erzwingung aktivieren

Bevor Sie die Erzwingung aktivieren, sollten Sie jedoch sicherstellen, dass dadurch keine bestehenden legitimen Nutzer beeinträchtigt werden. Wenn Sie jedoch verdächtige Nutzung Ihrer App-Ressourcen feststellen, sollten Sie die Erzwingung möglicherweise früher aktivieren.

Um diese Entscheidung zu treffen, können Sie sich die App Check-Messwerte für die von Ihnen verwendeten Dienste ansehen:

App Check-Erzwingung aktivieren

Wenn Sie wissen, wie sich App Check auf Ihre Nutzer auswirkt, und Sie bereit sind, fortzufahren, können Sie die Erzwingung von App Check aktivieren:

App Check in Debugging-Umgebungen verwenden

Wenn Sie Ihre App nach der Registrierung für App Check in einer Umgebung ausführen möchten, die normalerweise nicht als gültig eingestuft wird, z. B. lokal während der Entwicklung oder in einer Umgebung für kontinuierliche Integration (CI), können Sie einen Debug-Build Ihrer App erstellen, der anstelle eines echten Attestierungsanbieters den App Check-Debug-Anbieter verwendet.App Check

Weitere Informationen finden Sie unter App Check mit dem Debugging-Anbieter in Web-Apps verwenden.