Collecte d'événements

Open in QuickMonitoring→ Sites → [Votre site] → Analytics → Événements

Le SDK collecte automatiquement les pages vues et vous permet de suivre des événements personnalisés via QMTracker.capture('nom-evenement', propriétés). Les événements apparaissent dans le tableau de bord analytique en quelques secondes.

Ce que vous verrez

L'onglet Événements présente un journal en temps quasi-réel de tous les événements reçus pour votre site :

• Nom de l'événement — identifiant de l'action capturée (ex. : pageview, button_click, form_submit)
• Horodatage — heure locale et UTC de l'événement
• Propriétés — objet JSON des métadonnées associées (ex. : { "button": "sign-up", "page": "home" })
• Session — identifiant de la session utilisateur à laquelle appartient l'événement
• Utilisateur — identifiant de l'utilisateur si QMTracker.identify() a été appelé

En haut de la page, un compteur affiche le nombre total d'événements collectés sur les dernières 24 heures, 7 jours et 30 jours. Un graphique en barres montre l'évolution du volume d'événements dans le temps.

Comment l'utiliser

Pages vues automatiques

Dès l'installation du SDK, chaque chargement de page génère automatiquement un événement pageview avec les propriétés suivantes :

{
  url: 'https://votre-site.com/page',
  referrer: 'https://google.com',
  title: 'Titre de la page',
  userAgent: '...'
}

Pour les applications React et Next.js utilisant le routeur côté client, les navigations internes sont également capturées automatiquement.

Capturer des événements personnalisés

Appelez QMTracker.capture() à n'importe quel moment dans votre code JavaScript :

// Clic sur un bouton
document.querySelector('#cta-button').addEventListener('click', function() {
  QMTracker.capture('button_click', {
    button: 'cta-principal',
    page: 'accueil',
    position: 'hero'
  });
});

// Soumission de formulaire
document.querySelector('#contact-form').addEventListener('submit', function(e) {
  QMTracker.capture('form_submit', {
    form: 'contact',
    fields_filled: 4
  });
});

// Conversion e-commerce
QMTracker.capture('purchase', {
  order_id: 'CMD-12345',
  revenue: 89.99,
  currency: 'EUR',
  items: ['produit-a', 'produit-b']
});

Identifier un utilisateur

Associez les événements à un utilisateur connu avec QMTracker.identify() :

// Après connexion
QMTracker.identify('user-123', {
  name: 'Alice Dupont',
  email: 'alice@example.com',
  plan: 'pro',
  created_at: '2024-01-15'
});

Une fois identifié, tous les événements suivants de cette session sont liés à cet utilisateur dans les rapports analytiques.

Bonnes pratiques de nommage

Adoptez une convention cohérente pour les noms d'événements :

Convention	Exemple
verbe_objet (recommandé)	button_click, form_submit, page_view
objet_verbe	checkout_completed, video_played
Namespace	ecommerce.purchase, auth.login

Évitez les noms génériques comme click ou action — préférez des noms descriptifs qui restent lisibles dans les rapports.

Filtrer et rechercher les événements

Dans l'onglet Événements, utilisez la barre de recherche pour filtrer par :

• Nom d'événement (ex. : button_click)
• Propriété spécifique (ex. : page=accueil)
• Plage de dates

Condition de validation

Cet achievement est débloqué lorsque : au moins un événement personnalisé (différent d'un pageview automatique) a été envoyé avec succès via QMTracker.capture() et apparaît dans l'onglet Événements.

Problèmes courants

Les événements n'apparaissent pas dans le tableau de bord Vérifiez que QMTracker.init() est appelé avant tout QMTracker.capture(). Si vous utilisez un bundler, assurez-vous que le module est correctement importé et que l'initialisation n'est pas conditionnelle.

Les événements apparaissent en double Cela survient si le listener d'événement est enregistré plusieurs fois (par exemple dans un composant React qui se re-rend). Utilisez useEffect avec un tableau de dépendances vide, ou retirez le listener avec removeEventListener.

Les propriétés ne s'affichent pas correctement Les valeurs des propriétés doivent être des types primitifs (chaînes, nombres, booléens) ou des tableaux de primitifs. Les objets imbriqués profondément sont aplatis automatiquement mais peuvent être tronqués. Gardez la structure de propriétés simple.

Données manquantes pour des sessions spécifiques Si un utilisateur a un bloqueur de publicités actif, les événements peuvent être filtrés. QuickMonitoring recommande de proxifier les requêtes SDK via votre propre domaine pour contourner ce problème — consultez la section Paramètres avancés du SDK pour la configuration du proxy.