Premiers pas avec App Check avec reCAPTCHA Enterprise dans les applications Web

Cette page explique comment activer App Check dans une application Web à l'aide du fournisseur reCAPTCHA Enterprise. Lorsque vous activez App Check, vous vous assurez que seule votre application peut accéder aux ressources Firebase de votre projet. Consultez la présentation de cette fonctionnalité.

Notez que App Check utilise des clés de site basées sur des scores reCAPTCHA Enterprise, ce qui le rend invisible pour les utilisateurs. Le fournisseur reCAPTCHA Enterprise ne demandera jamais aux utilisateurs de résoudre un défi.

Si vous souhaitez utiliser App Check avec votre propre fournisseur personnalisé, consultez la section Implémenter un fournisseur App Check personnalisé.

1. Configurer votre projet Firebase

  1. Ajoutez Firebase à votre projet JavaScript si ce n'est pas déjà fait.

  2. Ouvrez la section reCAPTCHA Enterprise de la console Cloud, puis procédez comme suit :

    1. Si vous êtes invité à activer l'API reCAPTCHA Enterprise, faites-le.
    2. Créez une clé de type Site Web. Vous devrez spécifier les domaines sur lesquels vous hébergez votre application Web. Laissez l'option "Utiliser la case à cocher" désélectionnée.

  3. Enregistrez vos applications pour qu'elles utilisent App Check avec le fournisseur reCAPTCHA Enterprise dans la section App Check de la console Firebase. Vous devrez fournir la clé de site obtenue à l'étape précédente.

    En règle générale, vous devez enregistrer toutes les applications de votre projet, car une fois l'application forcée pour un produit Firebase, seules les applications enregistrées pourront accéder aux ressources backend du produit.

  4. Facultatif: Dans les paramètres d'enregistrement de l'application, définissez une valeur TTL (Time To Live) personnalisée pour les jetons App Check émis par le fournisseur. Vous pouvez définir le TTL sur une valeur comprise entre 30 minutes et sept jours. Lorsque vous modifiez cette valeur, tenez compte des compromis suivants :

    • Sécurité : les valeurs TTL plus courtes offrent une sécurité renforcée, car elles réduisent la période pendant laquelle un jeton divulgué ou intercepté peut être utilisé de manière abusive par un pirate informatique.
    • Performances: des TTL plus courtes signifient que votre application effectue l'attestation plus fréquemment. Étant donné que le processus d'attestation d'application ajoute une latence aux requêtes réseau chaque fois qu'il est exécuté, un TTL court peut avoir un impact sur les performances de votre application.
    • Quota et coût : les TTL plus courts et les réattestations fréquentes réduisent plus rapidement votre quota. Pour les services payants, cela peut entraîner des coûts plus élevés. Consultez la section Quotas et limites.

    La valeur TTL par défaut de 1 heure est raisonnable pour la plupart des applications. Notez que la bibliothèque App Check actualise les jetons à environ la moitié de la durée TTL.

2. Ajouter la bibliothèque App Check à votre application

Ajoutez Firebase à votre application Web si ce n'est pas déjà fait. Veillez à importer la bibliothèque App Check.

3. Initialiser App Check

Ajoutez le code d'initialisation suivant à votre application avant d'accéder à des services Firebase. Vous devez transmettre votre clé de site reCAPTCHA Enterprise, que vous avez créée dans la console Cloud, à activate().

Web

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

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

// Create a ReCaptchaEnterpriseProvider instance using your reCAPTCHA Enterprise
// site key and pass it to initializeAppCheck().
const appCheck = initializeAppCheck(app, {
  provider: new ReCaptchaEnterpriseProvider(/* reCAPTCHA Enterprise site key */),
  isTokenAutoRefreshEnabled: true // Set to true to allow auto-refresh.
});

Web

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

// Create a ReCaptchaEnterpriseProvider instance using your reCAPTCHA Enterprise
// site key and pass it to activate().
const appCheck = firebase.appCheck();
appCheck.activate(
  new firebase.appCheck.ReCaptchaEnterpriseProvider(
    /* reCAPTCHA Enterprise site key */
  ),
  true // Set to true to allow auto-refresh.
);

Étapes suivantes

Une fois la bibliothèque App Check installée dans votre application, déployez-la.

L'application cliente mise à jour commencera à envoyer des jetons App Check avec chaque requête envoyée à Firebase, mais les produits Firebase n'exigeront pas que les jetons soient valides tant que vous n'aurez pas activé l'application dans la section App Check de la console Firebase.

Surveiller les métriques et activer l'application forcée

Toutefois, avant d'activer l'application, vous devez vous assurer qu'elle n'entraînera pas de perturbation pour vos utilisateurs légitimes existants. En revanche, si vous constatez une utilisation suspecte de vos ressources d'application, vous pouvez activer l'application plus tôt.

Pour vous aider à prendre cette décision, vous pouvez consulter les métriques App Check des services que vous utilisez :

Activer l'application des règles App Check

Lorsque vous comprenez l'impact de App Check sur vos utilisateurs et que vous êtes prêt à continuer, vous pouvez activer l'application de App Check:

Utiliser App Check dans les environnements de débogage

Si, après avoir enregistré votre application pour App Check, vous souhaitez l'exécuter dans un environnement que App Check ne classerait normalement pas comme valide, par exemple localement pendant le développement ou à partir d'un environnement d'intégration continue (CI), vous pouvez créer un build de débogage de votre application qui utilise le fournisseur de débogage App Check au lieu d'un véritable fournisseur d'attestation.

Consultez Utiliser App Check avec le fournisseur de débogage dans les applications Web.

Remarque sur le coût

App Check crée une évaluation en votre nom pour valider le jeton de réponse de l'utilisateur chaque fois qu'un navigateur exécutant votre application Web actualise son jeton App Check. Des frais seront facturés à votre projet pour chaque évaluation créée au-delà du quota sans frais. Pour en savoir plus, consultez la page Tarifs de reCAPTCHA.

Par défaut, votre application Web actualise ce jeton deux fois toutes les une heure. Pour contrôler la fréquence à laquelle votre application actualise les jetons App Check (et donc la fréquence à laquelle de nouvelles évaluations sont créées), configurez leur TTL.