Inizia a utilizzare App Check con un provider personalizzato nelle app web

Questa pagina mostra come abilitare App Check in un'app web utilizzando il tuo provider App Check personalizzato. Quando abiliti App Check, contribuisci a garantire che solo la tua app possa accedere alle risorse Firebase del tuo progetto.

Se vuoi utilizzare App Check con uno dei provider integrati, consulta la documentazione relativa a App Check con reCAPTCHA Enterprise.

Prima di iniziare

Aggiungi Firebase al tuo progetto JavaScript, se non l'hai già fatto.
Implementa la logica lato server del tuo provider App Checkpersonalizzato.

1. Aggiungi la libreria App Check alla tua app

Aggiungi Firebase alla tua app web, se non l'hai già fatto. Assicurati di importare la App Check libreria.

2. Crea l'oggetto provider App Check

Crea un oggetto provider App Check per il tuo provider personalizzato. Questo oggetto deve avere un metodo getToken(), che raccoglie tutte le informazioni richieste dal tuo provider App Check personalizzato come prova di autenticità e le invia al tuo servizio di acquisizione dei token in cambio di un token App Check. L' App Check SDK gestisce la memorizzazione nella cache dei token, quindi ottieni sempre un nuovo token nell' implementazione di getToken().

Web

import { CustomProvider } from "firebase/app-check";

const appCheckCustomProvider = new CustomProvider({
  getToken: () => {
    return new Promise((resolve, _reject) => {
      // TODO: Logic to exchange proof of authenticity for an App Check token and
      // expiration time.

      // ...

      const appCheckToken = {
        token: tokenFromServer,
        expireTimeMillis: expirationFromServer * 1000
      };

      resolve(appCheckToken);
    });
  }
});appcheck_custom_provider.js

Web

const appCheckCustomProvider = {
  getToken: () => {
    return new Promise((resolve, _reject) => {
      // TODO: Logic to exchange proof of authenticity for an App Check token and
      // expiration time.

      // ...

      const appCheckToken = {
        token: tokenFromServer,
        expireTimeMillis: expirationFromServer * 1000
      };

      resolve(appCheckToken);
    });
  }
};index.js

3. Inizializza App Check

Aggiungi il seguente codice di inizializzazione alla tua applicazione prima di accedere a qualsiasi servizio Firebase:

Web

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

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

const appCheck = initializeAppCheck(app, {
  provider: appCheckCustomProvider,

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

Web

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

const appCheck = firebase.appCheck();
appCheck.activate(
  appCheckCustomProvider,

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

Passaggi successivi

Una volta installata la libreria App Check nella tua app, esegui il deployment.

L'app client aggiornata inizierà a inviare i token App Check insieme a ogni richiesta a Firebase, ma i prodotti Firebase non richiederanno la validità dei token finché non abiliti l'applicazione nella sezione App Check della console Firebase.

Monitora le metriche e abilita l'applicazione

Prima di abilitare l'applicazione, devi assicurarti che questa operazione non interrompa gli utenti legittimi esistenti. D'altra parte, se noti un utilizzo sospetto delle risorse dell'app, potresti voler abilitare l'applicazione prima.

Per aiutarti a prendere questa decisione, puoi esaminare le metriche App Check per i servizi che utilizzi:

Monitora le metric1/} metriche delle richieste per Firebase AI Logic, Data Connect, Realtime Database, Cloud Firestore, Cloud Storage, Authentication, Google Identity per iOS, API Maps JavaScript e API Places (nuova).App Check
Monitora le metriche delle richieste App Check per Cloud Functions.

Abilita l'applicazione di App Check

Quando hai compreso l'impatto di App Check sugli utenti e sei pronto per procedere, puoi abilitare l'applicazione di App Check:

Abilita l'App Checkapplicazione per Firebase AI Logic, Data Connect, Realtime Database, Cloud Firestore, Cloud Storage, Authentication, Google Identity per iOS, API Maps JavaScript e API Places (nuova).
Abilita l'applicazione per App CheckCloud Functions.

Utilizza App Check negli ambienti di debug

Se, dopo aver registrato l'app per App Check, vuoi eseguire la tua app in un ambiente che App Check normalmente non classificherebbe come valido, ad esempio localmente durante lo sviluppo o da un ambiente di integrazione continua (CI), puoi creare una build di debug della tua app che utilizza il provider di debug di App Check anziché un provider di attestazione reale.

Consulta Utilizzare App Check con il provider di debug nelle app web.