获取我们在 Firebase 峰会上发布的所有信息,了解 Firebase 可如何帮助您加快应用开发速度并满怀信心地运行应用。了解详情

Proteja recursos que no sean de Firebase con App Check en aplicaciones web

Puede proteger los recursos que no son de Firebase de su aplicación, como los backends autohospedados, con App Check. Para hacerlo, deberá hacer las dos cosas siguientes:

Antes de que empieces

Agregue App Check a su aplicación, utilizando el proveedor reCAPTCHA v3, el proveedor reCAPTCHA Enterprise o un proveedor personalizado .

Enviar tokens de verificación de aplicaciones con solicitudes de back-end

En su cliente de aplicación, antes de cada solicitud, obtenga un token de verificación de aplicación válido y vigente con appCheck().getToken() . La biblioteca App Check actualizará el token si es necesario.

Una vez que tenga un token válido, envíelo junto con la solicitud a su backend. Los detalles de cómo lograr esto dependen de usted, pero no envíe tokens de verificación de aplicaciones como parte de las URL , incluso en los parámetros de consulta, ya que esto los hace vulnerables a filtraciones e intercepciones accidentales. El siguiente ejemplo envía el token en un encabezado HTTP personalizado, que es el enfoque recomendado.

Web version 9

const { initializeAppCheck, getToken } = require('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.
};

Web version 8

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.
};