Instalar con npm

Si tu sitio se compila antes de publicarse, instala el código de captura como dependencia en lugar de cargarlo desde la CDN. La API pública es la misma que la de la etiqueta script.

Añade el paquete

npm install --save-exact @tracelog/capture-web@2.4.0

El comando instala una versión exacta: --save-exact evita que npm escriba un rango en tu manifiesto. Actualízala cuando hayas revisado la nueva versión.

Inicialízalo

import TraceLog from "@tracelog/capture-web";

TraceLog.init({
  key: "tl_pk_xxxxxxxxxxxxxxxxxxxxxxxxxx",
  endpoint: "https://api.tracelog.io/v1/events",
});

La clave es la clave de navegador del proyecto, disponible en Instalación y claves. Es pública y solo se acepta desde las direcciones de tu web en el proyecto. La clave de servidor es otra credencial: nunca la pongas en código que se ejecute en el navegador.

Consentimiento, pasos y conversión

TraceLog.consent.grant();

TraceLog.step("form_started");

TraceLog.conversion("lead", { identifier: lead.id });

Antes de consent.grant() no se captura nada. Llámalo cuando el visitante acepte y en cada carga de página mientras su consentimiento siga vigente: la aceptación no se recuerda. Las llamadas anteriores a init se guardan, hasta 100, y se hacen en cuanto se ejecuta. Si importas el paquete de forma diferida, lo que llames antes de que se resuelva la importación tienes que guardarlo tú. Consulta la referencia del SDK para ver la firma completa de cada método. Una conversión también puede indicar a qué corresponde —⁠sus artículos, el día de una reserva, si es periódica y si es la primera de esa persona⁠— y un paso, los artículos que muestra.

Detrás de un proxy propio

El ejemplo de arriba envía los eventos a https://api.tracelog.io/v1/events. Si tu web sirve TraceLog a través de su propio dominio, no indiques endpoint: el código de captura envía entonces los eventos a /v1/events en tu propio dominio, y tu proxy los reenvía.

Verifica la instalación

Abre Instalación y claves, empieza la comprobación desde Abrir mi sitio y sigue el recorrido declarado en la pestaña que abre ese botón. TraceLog marca esa pestaña como tráfico de verificación. Acepta primero el banner de consentimiento en ella: desde ese momento, la pestaña sigue en la comprobación al pasar de una página a otra y al volver de un pago hecho fuera de tu web. Una conversión que completes en cualquier otra pestaña cuenta como real y entra en tus cifras.

La lista de Tu recorrido de conversión avanza a medida que TraceLog recibe cada evento, así que una copia local de tu web que no llega a TraceLog no mostrará nada. Haz la comprobación en tu web publicada: Abrir mi sitio abre siempre la dirección que declaraste. Una copia de staging nunca hace avanzar la lista. Los eventos de un hostname de staging que hayas declarado son tráfico de staging y no cuentan para las cifras ni para el límite de sesiones. Para comprobar que esa copia envía eventos, abre Recorrido: bajo cada paso verás cuándo llegó su último evento de staging.