Faro : erreurs JavaScript, logs, événements métier et sessions

1. Les erreurs #

Automatiques et manuelles.

Capture #

Les instrumentations web capturent automatiquement les exceptions non gérées (window.onerror) et les promesses rejetées. Pour une erreur gérée, envoyez-la explicitement :

import { faro } from '@grafana/faro-web-sdk';

try {
  await payer(panier);
} catch (err) {
  faro.api.pushError(err, { context: { etape: 'paiement', montant: String(panier.total) } });
  afficherMessage('Le paiement a échoué');
}

Source maps #

En production, le code est minifié : une pile d'appels pointe vers main.4f3a.js:1:20345. Avec les source maps, la pile est traduite vers le fichier et la ligne d'origine. Alloy peut les télécharger depuis votre site ou les lire sur disque :

faro.receiver "front" {
  sourcemaps {
    download = false
    location {
      path                 = "/var/www/sourcemaps"
      minified_path_prefix = "https://boutique.example.org/assets/"
    }
  }
  // ...
}

Erreur Courante : Ne publiez pas forcément vos source maps sur le site public : elles révèlent le code source. Déposez-les plutôt sur le disque du récepteur.

2. Logs, événements, mesures #

Instrumenter le métier.

API #

// Événement métier (tunnel de conversion)
faro.api.pushEvent('ajout_panier', { produit: 'casque-x', quantite: '1' });

// Mesure personnalisée (valeurs numériques)
faro.api.pushMeasurement({ type: 'panier', values: { articles: 3, total: 129.9 } });

// Log applicatif
faro.api.pushLog(['Filtre appliqué', JSON.stringify(filtres)]);

Les événements permettent de construire des entonnoirs (pages vues → ajout au panier → paiement) et de relier une baisse de conversion à une erreur ou une lenteur.

3. Sessions et utilisateurs #

Avec prudence.

Sessions #

Faro crée un identifiant de session et l'ajoute à tous les signaux : on retrouve tout ce qu'a vécu une session (pages, erreurs, requêtes lentes).

initializeFaro({
  // ...
  sessionTracking: { enabled: true, samplingRate: 0.2 },   // 20 % des sessions
});

// Après connexion : identifiant technique, jamais l'e-mail
faro.api.setUser({ id: 'u-7f3a', attributes: { offre: 'premium' } });

Erreur Courante : N'envoyez ni e-mail, ni nom, ni contenu de formulaire. L'identifiant doit être pseudonyme et la collecte couverte par votre politique de confidentialité (voir la leçon sur l'exploitation).