Proteggere le risorse di backend personalizzate con App Check nelle app web

Mantieni tutto organizzato con le raccolte Salva e classifica i contenuti in base alle tue preferenze.

Puoi utilizzare App Check per proteggere le risorse di backend personalizzate non Google per la tua app, ad esempio il tuo backend auto-in hosting. A questo scopo, dovrai svolgere entrambe le seguenti operazioni:

• Modifica il client dell'app in modo da inviare un token App Check insieme a ogni richiesta al tuo backend, come descritto in questa pagina.
• Modifica il backend in modo da richiedere un token App Check valido con ogni richiesta, come descritto in Verificare i token App Check da un backend personalizzato.

Prima di iniziare

Aggiungi App Check alla tua app utilizzando il provider reCAPTCHA Enterprise o un provider personalizzato.

Inviare token App Check con le richieste di backend

Nel client dell'app, prima di ogni richiesta, ottieni un token App Check valido e non scaduto con appCheck().getToken(). La libreria App Check aggiornerà il token, se necessario.

Una volta ottenuto un token valido, invialo insieme alla richiesta al tuo backend. Le specifiche su come eseguire questa operazione dipendono da te, ma non inviare i token App Check all'interno degli URL, inclusi nei parametri di query, in quanto ciò li rende vulnerabili a fughe e intercettazioni accidentali. L'esempio seguente invia il token in un'intestazione HTTP personalizzata, che è l'approccio consigliato.

import { initializeAppCheck, getToken } from 'firebase/app-check';

const appCheck = initializeAppCheck(
    app,
    { provider: provider } // ReCaptchaV3Provider or CustomProvider
);

const callApiWithAppCheckExample = async () => {
  let appCheckTokenResponse;
  try {
      appCheckTokenResponse = await getToken(appCheck, /* forceRefresh= */ false);
  } catch (err) {
      // Handle any errors if the token was not retrieved.
      return;
  }

  // Include the App Check token with requests to your server.
  const apiResponse = await fetch('https://yourbackend.example.com/yourApiEndpoint', {
      headers: {
          'X-Firebase-AppCheck': appCheckTokenResponse.token,
      }
  });

  // Handle response from your backend.
};
appcheck_nonfirebase.js

const callApiWithAppCheckExample = async () => {
  let appCheckTokenResponse;
  try {
      appCheckTokenResponse = await firebase.appCheck().getToken(/* forceRefresh= */ false);
  } catch (err) {
      // Handle any errors if the token was not retrieved.
      return;
  }

  // Include the App Check token with requests to your server.
  const apiResponse = await fetch('https://yourbackend.example.com/yourApiEndpoint', {
      headers: {
          'X-Firebase-AppCheck': appCheckTokenResponse.token,
      }
  });

  // Handle response from your backend.
};
index.js

Protezione da replay (beta)

Quando invii una richiesta a un endpoint per il quale hai attivato la protezione da replay, acquisisci un token utilizzando getLimitedUseToken() anziché getToken():

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

// ...

appCheckTokenResponse = await getLimitedUseToken(appCheck);