Saltar al contenido principal
Zenovaydocs
6 min de lectura

Seguimiento de Errores

Característica Pro

Detecta cada error de JavaScript, fallo de red y excepción no controlada antes de que tus usuarios los reporten. El seguimiento de errores captura trazas completas de la pila con contexto de sesión para ayudarte a depurar más rápido.

El Seguimiento de Errores está disponible en los planes Pro, Scale y Enterprise. Actualiza tu plan para activar esta característica.

Panel de Control de Errores de Zenovay agrupando errores de JavaScript y de red con conteos de ocurrencia y usuarios afectados.
La vista de Errores agrupa cada error capturado con su recuento de ocurrencias, usuarios afectados y estado de resolución.

Descripción General

Zenovay captura automáticamente errores del lado del cliente a medida que ocurren, incluyendo:

  • Errores de JavaScript: Excepciones no capturadas y errores de sintaxis
  • Rechazos de Promesas: Rechazos de promesas no controlados
  • Errores de Red: Llamadas API fallidas y fallos en la carga de recursos
  • Errores de Consola: Errores registrados mediante console.error()

Cada error incluye:

  • Traza completa de la pila con mapas de fuente
  • Contexto de sesión (qué estaba haciendo el usuario)
  • Información del navegador y dispositivo
  • Enlace a la repetición de sesión (si está habilitada)

Activar el Seguimiento de Errores

El seguimiento de errores está habilitado por defecto cuando añades el script de seguimiento de Zenovay. Para verificar:

  1. Abre Dominios, selecciona tu sitio, luego elige la pestaña Errores
  2. Si la pestaña muestra datos o un aviso para activar, el script está activo
  3. Confirma que la captura de errores está activada en la configuración de características del dominio

Panel de Control de Errores

Lista de Errores

El panel de control de Errores muestra todos los errores capturados agrupados por:

  • Mensaje de error: Huella digital única del error
  • Recuento de ocurrencias: Cuántas veces ocurrió este error
  • Usuarios afectados: Número de visitantes únicos afectados
  • Última vez visto: Cuándo ocurrió el error más recientemente

Detalles del Error

Haz clic en cualquier error para ver:

  • Traza completa de la pila: Con números de línea mapeados desde fuente
  • Contexto del usuario: Navegador, dispositivo, país, URL de la página
  • Repetición de sesión: Enlace para ver qué sucedió (si está habilitada)
  • Migas de pan: Eventos previos al error
  • Gráfico de tendencia: Frecuencia del error a lo largo del tiempo

Agrupamiento de Errores

Los errores similares se agrupan automáticamente por:

  1. Mensaje de error (normalizado)
  2. Huella digital de la traza de la pila
  3. Tipo de error

Esto evita que miles de errores idénticos inunden tu panel de control.

Huella Digital Personalizada

Usa etiquetas de error personalizadas para agrupar errores relacionados:

try {
  // Your code
} catch (error) {
  window.zenovay('track', 'error', {
    error_message: error.message,
    error_stack: error.stack,
    tags: {
      feature: 'checkout',
      action: 'payment_submit'
    }
  });
}

Tipos de Errores

Errores de JavaScript

Errores estándar en tiempo de ejecución:

// Captured automatically
TypeError: Cannot read property 'foo' of undefined
ReferenceError: bar is not defined
SyntaxError: Unexpected token

Errores de Red

Solicitudes fetch/XHR fallidas:

// Failed API call - automatically captured
fetch('/api/data')
  .then(r => r.json())
  .catch(error => {
    // Error captured with request details
  });

Los detalles del error de red incluyen:

  • URL de la solicitud
  • Método HTTP
  • Estado de la respuesta (si está disponible)
  • Duración de la solicitud

Rechazos de Promesas

Rechazos de promesas no controlados:

// Captured automatically
Promise.reject(new Error('Something went wrong'));

// Async function errors
async function fetchData() {
  throw new Error('Failed to fetch');
}

Mapas de Fuente

Sube mapas de fuente para trazas de pila legibles:

Carga Automática (Recomendado)

Si utilizas Webpack, Vite o Rollup, los mapas de fuente pueden cargarse automáticamente durante la compilación:

# Upload source maps using the API
curl -X POST "https://api.zenovay.com/api/external/v1/sourcemaps" \
  -H "X-API-Key: YOUR_API_KEY" \
  -F "release=v1.2.3" \
  -F "sourcemap=@./dist/main.js.map"

Carga Manual

Sube a través del panel de control:

  1. Abre Dominios, selecciona tu sitio, luego elige la pestaña Errores
  2. Haz clic en Mapas de Fuente y luego en Subir Mapa de Fuente
  3. Selecciona tus archivos .js.map
  4. Asocia con una versión de lanzamiento

Integración de Sesión

Cuando la Repetición de Sesión está habilitada:

  1. Cada error se vincula directamente a la repetición de sesión
  2. La reproducción se abre en el momento exacto en que ocurrió el error
  3. Observa qué hizo el usuario antes del error
  4. Comprende el contexto completo, no solo la traza de la pila

Filtrado y Alertas

Filtrado de Errores

Filtra errores por:

  • Rango de fechas
  • Navegador
  • Tipo de dispositivo
  • País
  • Versión de lanzamiento
  • Tipo de error

Alertas de Error

Configura alertas para errores nuevos o en picos:

  1. Abre Dominios, selecciona tu sitio, luego elige la pestaña Errores
  2. Haz clic en Configurar alertas
  3. Establece un umbral (por ejemplo, "más de 10 ocurrencias en 5 minutos")
  4. Elige un canal de notificación (correo electrónico, Slack, webhook)

Ignorar Errores

Algunos errores no son accionables. Configura reglas de ignorar:

Por Mensaje de Error

{
  "error_ignore_patterns": [
    "ResizeObserver loop limit exceeded",
    "Script error."
  ]
}

Por Patrón de URL

{
  "error_ignore_urls": [
    "chrome-extension://",
    "moz-extension://"
  ]
}

Seguimiento Manual de Errores

Registra errores capturados o condiciones de error personalizadas:

// Track caught error
try {
  riskyOperation();
} catch (error) {
  window.zenovay('track', 'error', {
    error_message: error.message,
    error_stack: error.stack,
    context: {
      operation: 'riskyOperation',
      userId: currentUser.id
    }
  });
}

// Track custom error condition
if (unexpectedState) {
  window.zenovay('track', 'error', {
    error_message: 'Unexpected application state',
    severity: 'warning',
    context: { state: JSON.stringify(appState) }
  });
}

Acceso a la API

Accede a datos de errores a través de la API:

# List errors
GET /api/websites/:websiteId/errors
Authorization: Bearer YOUR_API_KEY

# Get error details
GET /api/websites/:websiteId/errors/:errorId
Authorization: Bearer YOUR_API_KEY

Privacidad

El seguimiento de errores respeta la privacidad del usuario:

  • Las trazas de la pila no contienen datos de usuario
  • La información de identificación personal se elimina automáticamente del contexto del error
  • Respeta la configuración de DNT y consentimiento
  • Los datos de error siguen tu política de retención

Mejores Prácticas

  1. Sube mapas de fuente: Esencial para depurar código minificado
  2. Configura alertas: Entérate de los errores críticos inmediatamente
  3. Revisa semanalmente: La revisión regular de errores previene deuda técnica
  4. Etiqueta lanzamientos: Asocia errores con versiones específicas
  5. Observa repeticiones de sesión: El contexto lo es todo para depurar

Próximos Pasos

¿Fue útil esta página?