SDK do Tracker¶

O Tracker SDK e um script JavaScript leve que coleta dados comportamentais do usuario e os envia para a Tracker API.

Instalacao¶

Adicione o script na sua landing page, antes do </body>:

<script
  src="https://tracker.haussoftwarehouse.com/sdk/tracker.js"
  data-client-id="SEU_DATASOURCE_ID"
  data-api-url="https://tracker.haussoftwarehouse.com">
</script>

Atributo	Obrigatorio	Descricao
`src`	Sim	URL do SDK hospedado na Tracker API
`data-client-id`	Sim	UUID do datasource (obtido na Platform API)
`data-api-url`	Sim	URL base da Tracker API

Dados Coletados¶

O SDK coleta automaticamente os seguintes dados a cada ~5 segundos:

Comportamento do Mouse¶

Dado	Descricao
Posicao (X, Y)	Coordenadas atuais do cursor
Velocidade	Velocidade de movimento em px/s

Scroll¶

Dado	Descricao
Profundidade maxima	Percentual maximo de scroll (0-100%)
Velocidade	Velocidade de scroll em px/s

Engajamento¶

Dado	Descricao
Tempo na pagina	Tempo total desde o carregamento
Tempo ocioso	Tempo sem interacao
Visibilidade da aba	Se a aba esta visivel ou oculta
Foco da janela	Se a janela esta em foco
Trocas de foco	Numero de vezes que perdeu/ganhou foco
Ultimo clique	Tag HTML do ultimo elemento clicado

Sessao¶

Dado	Descricao
Session ID	Identificador unico gerado por sessao
URL e path	Pagina atual
Referrer	Pagina de origem
UTM params	source, medium, campaign

Dado	Descricao
Modal exibido em	Timestamp de quando o modal apareceu
Modal fechado em	Timestamp de quando foi fechado
Tipo de interacao	Como o usuario interagiu (fechou, clicou CTA, etc.)

Como Funciona¶

sequenceDiagram
    participant LP as Landing Page
    participant SDK as Tracker SDK
    participant API as Tracker API
    participant WS as WebSocket

    LP->>SDK: Pagina carrega
    SDK->>SDK: Gera sessionId
    SDK->>WS: Conecta WebSocket<br/>/channel?sessionId=xxx
    SDK->>SDK: Inicia listeners (mouse, scroll, click, etc.)

    loop A cada 5 segundos
        SDK->>SDK: Coleta snapshot comportamental
        SDK->>API: POST /assets {dados}
    end

    Note over API: Se sessionTime >= threshold,<br/>chama Models API

    WS-->>SDK: Modal HTML (se should_trigger)
    SDK->>LP: Injeta modal no DOM
    SDK->>SDK: Registra interacao com modal
    SDK->>API: POST /assets {modalInteraction}

Conexao WebSocket¶

O SDK estabelece automaticamente uma conexao WebSocket para receber modais em tempo real:

URL: ws://tracker-api/channel?sessionId={sessionId}
Reconexao: Automatica em caso de queda
Mensagens recebidas: HTML do modal para injetar no DOM

Eventos de Conversao¶

O SDK detecta automaticamente cliques em elementos que correspondem aos Success Events configurados:

O SDK busca a configuracao do datasource
Para cada clique do usuario, verifica se o elemento corresponde a um seletor configurado
Se corresponder, marca targetClicked e sessionOutcome nos proximos eventos enviados

Exemplo Completo¶

<!DOCTYPE html>
<html>
<head>
  <title>Minha Landing Page</title>
</head>
<body>
  <h1>Oferta Especial</h1>
  <p>Descricao do produto...</p>

  <!-- Botao de conversao (configurado como Success Event com selector=ID, value=btn-comprar) -->
  <button id="btn-comprar">Comprar Agora</button>

  <!-- Tracker SDK -->
  <script
    src="https://tracker.haussoftwarehouse.com/sdk/tracker.js"
    data-client-id="660e8400-e29b-41d4-a716-446655440000"
    data-api-url="https://tracker.haussoftwarehouse.com">
  </script>
</body>
</html>

Teste Local¶

Use a pagina de teste integrada na Tracker API:

http://localhost:8282/test

Esta pagina ja vem com o SDK configurado para testar o envio de eventos e recebimento de modais.