Comienza a usar la Verificación de aplicaciones con reCAPTCHA v3 en apps web

En esta página se muestra cómo habilitar la Verificación de aplicaciones en una aplicación web mediante el proveedor integrado de reCAPTCHA v3. Cuando habilitas la Verificación de aplicaciones, ayudas a garantizar que solo la app pueda acceder a los recursos de Firebase de tu proyecto. Consulta una descripción general de esta función.

Ten en cuenta que reCAPTCHA v3 es invisible para los usuarios. El proveedor de reCAPTCHA v3 no requerirá que los usuarios resuelvan un desafío en ningún momento. Consulta la documentación de reCAPTCHA v3.

Si deseas usar la Verificación de aplicaciones mediante tu proveedor personalizado, consulta Implementa un proveedor personalizado para la Verificación de aplicaciones.

1. Configura el proyecto de Firebase

  1. Si aún no lo has hecho, agrega Firebase al proyecto de JavaScript.

  2. Registra tu sitio en reCAPTCHA v3 y obtén la clave del sitio y la clave secreta de reCAPTCHA v3.

  3. Registra tus apps para que usen la Verificación de aplicaciones mediante el proveedor de reCAPTCHA en la sección Verificación de aplicaciones de Firebase console. Deberás proporcionar la clave secreta que obtuviste en el paso anterior.

    Por lo general, debes registrar todas las apps de tu proyecto, ya que una vez que habilites la aplicación forzosa para un producto de Firebase, solo las apps registradas podrán acceder a los recursos de backend del producto.

  4. Opcional: En los parámetros de configuración del registro de la app, configura un tiempo de actividad (TTL) personalizado para los tokens de la Verificación de aplicaciones que emite el proveedor. Puedes configurar el TTL en cualquier valor entre 30 minutos y 7 días. Cuando cambies este valor, ten en cuenta las siguientes compensaciones:

    • Seguridad: Los TTL más cortos proporcionan una mayor seguridad, ya que reducen el período en el que un atacante puede abusar de un token filtrado o interceptado.
    • Rendimiento: Si usas TTL más cortos, la app realizará la certificación con mayor frecuencia. Debido a que el proceso de certificación de la app agrega latencia a las solicitudes de red cada vez que se realiza, un TTL corto puede afectar el rendimiento de la app.
    • Cuota y costo: Los TTL más cortos y las certificaciones frecuentes agotan tu cuota con mayor rapidez. Además, en el caso de los servicios pagados, es posible que tengan un costo mayor. Consulta Cuotas y límites.

    El TTL predeterminado de 1 día es razonable para la mayoría de las apps. Ten en cuenta que la biblioteca de Verificación de aplicaciones actualiza los tokens aproximadamente en la mitad de la duración de TTL.

2. Agrega la biblioteca de la Verificación de aplicaciones a la app

Si aún no lo has hecho, agrega Firebase a la app web. Asegúrate de importar la biblioteca de la Verificación de aplicaciones.

3. Inicializa la Verificación de aplicaciones

Agrega el siguiente código de inicialización a la aplicación antes de acceder a cualquier servicio de Firebase. Deberás pasar la clave del sitio de reCAPTCHA, la cual creaste en la consola de reCAPTCHA, a activate().

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

Próximos pasos

Una vez que la biblioteca de la Verificación de aplicaciones esté instalada en la app, debes implementarla.

La app cliente actualizada comenzará a enviar tokens de la Verificación de aplicaciones junto con cada solicitud que realice a Firebase, pero los productos de Firebase no requerirán que los tokens sean válidos hasta que habilites la aplicación forzosa en la sección de la Verificación de aplicaciones de Firebase console.

Supervisa las métricas y habilita la aplicación forzosa

Sin embargo, antes de habilitar la aplicación forzosa, debes asegurarte de que esto no interrumpa a tus usuarios legítimos existentes. Por otro lado, si ves un uso sospechoso de los recursos de tu app, te convendrá habilitar la aplicación más pronto.

Para ayudarte a tomar esta decisión, puedes consultar las métricas de la Verificación de aplicaciones para los servicios que usas:

Habilita la aplicación forzosa de la Verificación de aplicaciones

Cuando comprendas cómo la Verificación de aplicaciones afectará a los usuarios y cuentes con todo lo necesario para continuar, puedes habilitar la aplicación forzosa de la Verificación de aplicaciones:

Usa la Verificación de aplicaciones en entornos de depuración

Si, después de registrar la app en la Verificación de aplicaciones, quieres ejecutarla en un entorno que la Verificación de aplicaciones no suele clasificar como válido, como de forma local durante el desarrollo, o desde un entorno de integración continua (CI), puedes crear una compilación de depuración de la app que use el proveedor de depuración de la Verificación de aplicaciones, en lugar de un proveedor de certificación real.

Consulta Usa la Verificación de aplicaciones mediante el proveedor de depuración en aplicaciones web.