Los eventos personalizados son ideales para añadir más inteligencia al registrar eventos específicos de tu dominio junto con las repeticiones de sesiones. OpenReplay utiliza 2 tipos de eventos: funcionales (event) y técnicos (issue). Todos los eventos se indexan para facilitar la búsqueda y se sincronizan con las grabaciones de sesiones.

Los eventos funcionales se indexan y facilitan la búsqueda de grabaciones de sesiones específicas. Si OpenReplay los recibe correctamente, estarán disponibles como filtros en la barra de omnisearch.

Usa el método event para señalar eventos funcionales como order completed o product added. Toma 2 parámetros: name (string) y payload (cualquier objeto JS no recursivo).

tracker.event('product_added', 'shoes'); // after tracker.start()
// OR
tracker.event('product_added', { type: 'shoes' });

A continuación se muestra un ejemplo de cómo enviar un evento funcional usando el snippet.

<!-- OpenReplay Tracking Code -->
<script>
var initOpts = { projectKey: "GxPpaDARdn2345fgt321" };
var startOpts = { userID: ""}; 
(function(A,s,a,y,e,r){
  r=window.OpenReplay=[e,r,y,[s-1, e]];
  s=document.createElement('script');s.src=A;s.async=!a;
  ...
})("//static.openreplay.com/latest/openreplay.js", 1, 0, initOpts, startOpts);
</script>
  ...
  __OPENREPLAY__.event('product_added', 'shoes'); // send a functional event later in your code
	// OR
	__OPENREPLAY__.event('product_added', { type: 'shoes' });
  ...

Los eventos técnicos se muestran en la repetición de sesión bajo la pestaña Events en DevTools, y como anotaciones en la reproducción. También se tienen en cuenta en los Funnels para correlacionar las caídas de conversión con problemas técnicos.

issue se utiliza para enviar eventos técnicos, como errores, que puedan ocurrir en tu stack o en otros sistemas descendentes. issue toma 2 parámetros: name (string) y payload (objeto JS no recursivo).

tracker.issue('payment_error', { code: 500, context: 42 }); // after tracker.start()

A continuación se muestra un ejemplo de cómo enviar un evento técnico usando el snippet.

<!-- OpenReplay Tracking Code -->
<script>
var initOpts = { projectKey: "GxPpaDARdn2345fgt321" };
var startOpts = { userID: "" }; 
(function(A,s,a,y,e,r){
  r=window.OpenReplay=[e,r,y,[s-1, e]];
  s=document.createElement('script');s.src=A;s.async=!a;
  ...
})("//static.openreplay.com/latest/openreplay.js", 1, 0, initOpts, startOpts);
</script>
  ...
  __OPENREPLAY__.issue('payment_error', {code: 500, context: 42}); // send a technical event (issue) later in your code
  ...

Nuestro SDK admite una gestión de eventos más detallada; para saber más, consulta la sección de gestión de datos y eventos.

import ORTracker

ORTracker.shared.event(name: String, payload: Encodable?)

Si buscas un ejemplo práctico de cómo usar los eventos personalizados, consulta nuestro tutorial detallado aquí.

¿Tienes problemas para usar los eventos personalizados? Conéctate a nuestro Slack o visita nuestro Foro y obtén ayuda de nuestra comunidad.