Prueba tu implementación de Crashlytics (Web)

Seleccionar plataforma: iOS+ Android Web Flutter Unity


Usa esta guía si seguiste la guía de introducción y aún no ves fallas en el panel de Crashlytics.

Fuerza una falla para probar tu implementación

  1. Agrega código a tu app para forzar una falla de prueba.

    Agrega un botón de prueba o un activador de ruta a tu app de React, Next.js o Angular que arroje un error de tiempo de ejecución cuando se haga clic en él:

    // Trigger an unhandled exception on button click or route load
    function handleTestCrash() {
      throw new Error("Crashlytics Web SDK Test Unhandled Error!");
    }
    

    Si configuraste la captura automática de errores con <FirebaseCrashlytics> (React o Next.js), provideCrashlytics (Angular) o <CrashlyticsRoutes> (React Router), arrojar este error captura automáticamente la excepción y la programa para subirla.

  2. Compila y ejecuta tu app y, luego, activa el error de prueba para que la app envíe su primer informe de fallas a Firebase.

  3. En la consola de Firebase, ve al panel DevOps & Engagement > Crashlytics para verificar el informe de fallas de prueba:

    1. Selecciona tu app web en el selector desplegable que se encuentra en la parte superior de la página.

    2. Actualiza la página. La excepción de prueba debería aparecer en la tabla Problemas en unos minutos.

Si actualizaste la consola y sigues sin poder ver la falla de prueba después de cinco a diez minutos, consulta la siguiente sección sobre cómo solucionar problemas de configuración.

Soluciona problemas de configuración

Si activaste una falla de prueba y aún no ves informes en el panel de Crashlytics después de cinco a diez minutos, intenta volver a ejecutar el flujo de configuración o verificar los siguientes parámetros de configuración del proyecto en la consola:

  • Vuelve a ejecutar el flujo de configuración de Crashlytics: Puedes volver a ejecutar de forma segura el comando de configuración de la CLI de Firebase (firebase crashlytics:setup) o completar la configuración en la consola de Firebase como se describe en el paso 1 de la guía de introducción. Si vuelves a ejecutar la configuración, se habilitarán automáticamente las APIs faltantes y se repararán el bucket de firebase-telemetry Cloud Logging y el receptor de enrutamiento.

  • Verifica la facturación y los permisos de IAM: Asegúrate de que tu proyecto de Firebase tenga el plan de precios Blaze de pago por uso y de que tu cuenta tenga permisos de propietario en el proyecto cuando ejecutes el paso de configuración.

  • Verifica las restricciones de la clave de API de firebasetelemetry.googleapis.com: En la página Credenciales de la consola de Google Cloud, selecciona la clave de API configurada en tu objeto firebaseConfig (por ejemplo, Browser key (auto created by Firebase)). Si la clave tiene habilitadas las restricciones de API, verifica que la API de Firebase Telemetry (firebasetelemetry.googleapis.com) esté incluida en la lista de APIs permitidas. Si falta este destino en una clave de API restringida, las solicitudes de carga de red fallarán con errores HTTP 403 (Prohibido) en la consola del navegador.

  • Verifica las APIs de Google Cloud habilitadas: En la página APIs y servicios habilitados de la consola de Google Cloud, verifica que la API de Firebase Telemetry (firebasetelemetry.googleapis.com), la API de Firebase Telemetry Admin (firebasetelemetryadmin.googleapis.com), la API de Cloud Logging (logging.googleapis.com) y Cloud Storage (storage.googleapis.com) estén habilitadas para tu proyecto.

  • Verifica el Análisis de registros en el bucket de registros: En la página Almacenamiento de registros de la consola de Google Cloud, verifica que el bucket firebase-telemetry (ubicación global) exista y tenga habilitado el Análisis de registros, y consulta la página Enrutador de registros para confirmar que el receptor firebase-telemetry-routing exista.

Captura y vacía manualmente una excepción de prueba

Si deseas verificar de inmediato la transmisión de extremo a extremo sin esperar a que se descarguen las páginas o se agrupen los datos en la memoria, usa recordError junto con flush:

import { recordError, flush, getCrashlytics } from '@firebase/crashlytics';
import { app } from './lib/firebase'; // Shared initialization script

const crashlytics = getCrashlytics(app);

async function triggerImmediateTestCrash() {
  const error = new Error("Crashlytics Web SDK Test Handled Error!");
  // Capture the error with immediate priority and custom diagnostic metadata
  recordError(crashlytics, error, {
    priority: 'IMMEDIATE',
    testEvent: true,
    environment: 'staging_verification'
  });
  // Force an immediate upload before the browser terminates or reloads
  await flush(crashlytics);
  console.log("Test error flushed to Crashlytics successfully.");
}

Próximos pasos

  • Obtén informes de fallas legibles: Configura la carga automática de mapas de origen (.js.map) para que los seguimientos de pila de producción muestren los nombres de archivo y los números de línea originales.

  • Personaliza los informes de fallas: Obtén información para informar excepciones controladas, agregar claves personalizadas, forzar el vaciado de los registros de telemetría y configurar el muestreo.