Hotjar, Microsoft Clarity & Fullstory : Pourquoi l'enregistrement d'écran sans consentement est sanctionné

Note technique exécutive : l'illégalité de l'intérêt légitime pour le session replay

Une défaillance de conformité récurrente au sein des équipes produit et des plateformes e-commerce consiste à catégoriser les scripts d'enregistrement de session (session replay)—notamment Hotjar, Microsoft Clarity, FullStory et Contentsquare—sous la base légale de l'intérêt légitime (article 6(1)(f) du RGPD). L'optimisation UX et l'analyse de parcours de conversion sont pourtant systématiquement requalifiées en opérations non exemptées par les autorités européennes de contrôle.

En vertu de l'article 5(3) de la directive 2002/58/CE ↗ (directive ePrivacy), transposé en droit français à l'article 82 de la loi Informatique et Libertés ↗, tout accès à des informations stockées dans l'équipement terminal d'un utilisateur ou toute inscription d'informations requiert le recueil préalable d'un consentement éclairé et univoque. Les dérogations définies par la délibération CNIL n° 2020-091 se limitent strictement aux traceurs indispensables à la fourniture d'un service de communication en ligne expressément demandé par l'internaute, ou à une mesure d'audience anonymisée respectant des critères statistiques très restrictifs. Les enregistreurs de session ne remplissent aucune de ces conditions d'exemption.

Les outils de session replay injectent des bundles JavaScript volumineux qui analysent en temps réel les mutations du Document Object Model (DOM), capturent les coordonnées cartésiennes de la souris (X/Y), enregistrent le défilement (scroll) et interceptent les frappes au clavier. Les autorités de protection des données (la CNIL en France, la DSB autrichienne ou le DSK allemand) qualifient cette télémétrie de profilage détaillé du comportement individuel. L'exécution de ces scripts avant l'obtention d'un consentement préalable positif (opt-in), ou via des mécanismes frauduleux de consentement tacite au défilement, constitue une violation directe des articles 5(1)(a), 6(1)(a) et 7 du RGPD.

Analyse architecturale : scraping du DOM, MutationObserver et fuites de données personnelles

Contrairement à une idée répandue, les moteurs de session replay n'enregistrent aucun flux vidéo binaire. Ils sérialisent l'arborescence HTML du DOM sous forme de charges utiles JSON horodatées et instancient un MutationObserver pour écouter chaque modification incrémentielle des nœuds, attributs et éléments textuels de la page.

Mécanismes d'interception des frappes et états applicatifs

Par défaut, ces scripts attachent des écouteurs d'événements à l'échelle globale de la fenêtre d'exécution : mousemove, scroll, click, focus, ainsi que input ou keydown. Lorsqu'un utilisateur saisit des informations dans un formulaire, les chaînes de texte sont capturées dans la mémoire côté client avant d'être transmises aux points de collecte des éditeurs (par exemple, l'infrastructure AWS de Hotjar ou les pipelines de télémétrie de Microsoft Clarity).

Même si l'obfuscation automatique est activée sur la console d'administration, ce masquage dynamique échoue fréquemment sur les architectures Single-Page Applications (React, Vue, Next.js) où l'état des composants contourne les identifiants statiques standards. De surcroît, des attributs personnalisés non masqués (tels que aria-label, placeholder ou les balises data-*) véhiculent couramment des données à caractère personnel. Si le script s'exécute sur le tunnel de commande, le paiement ou un espace authentifié, des numéros de carte bancaire, IBAN, adresses de livraison ou données médicales se retrouvent transférés en clair vers des serveurs tiers.

Implémentation d'un masquage strict du DOM côté client

Pour éliminer le risque d'exfiltration de données sensibles au sens de l'article 9 du RGPD, les équipes de développement doivent intégrer des directives de masquage directement au niveau des gabarits HTML, en amont de toute exécution de script. Se reposer sur les seuls filtres de la plateforme d'analyse constitue un manquement formel à l'article 25 du RGPD (protection des données dès la conception et par défaut).

<!-- Exemple : Sécurisation des champs de formulaires contre le scraping de session -->
<form id="checkout-payment-form">
  <!-- Directive Hotjar : data-recording-ignore exclut totalement le nœud du payload -->
  <!-- Directive Microsoft Clarity : data-clarity-mask remplace la valeur par des astérisques -->
  <div class="form-group">
    <label for="user-card-number">Numéro de carte bancaire</label>
    <input 
      type="text" 
      id="user-card-number" 
      name="card_num" 
      autocomplete="cc-number" 
      data-recording-ignore="true" 
      data-clarity-mask="true"
      data-hj-suppress
    />
  </div>

  <div class="form-group">
    <label for="medical-notes">Données de consultation / Régime médical</label>
    <textarea 
      id="medical-notes" 
      name="health_data" 
      data-recording-ignore="true" 
      data-clarity-mask="true"
      data-hj-suppress>
    </textarea>
  </div>
</form>

Conditionnement de l'initialisation via Google Tag Manager (GTM)

Les traceurs de session replay doivent demeurer strictement inactifs tant que la plateforme de gestion du consentement (CMP) n'a pas validé un signal consent_updated explicite pour la finalité d'analyse comportementale. L'implémentation suivante bloque l'injection du script selon le statut de conformité :

// Balise HTML personnalisée GTM : Déclenchement conditionné d'Hotjar après opt-in strict
(function() {
  'use strict';

  // Filtrage strict : blocage immédiat sur les routes critiques
  var sensitiveRoutes = ['/checkout', '/panier', '/compte', '/teleconsultation', '/paiement'];
  var currentPath = window.location.pathname.toLowerCase();
  
  var isSensitivePage = sensitiveRoutes.some(function(route) {
    return currentPath.indexOf(route) !== -1;
  });

  if (isSensitivePage) {
    console.warn('[CookieDetox Alert] Enregistrement de session neutralisé : route sécurisée détectée.');
    return;
  }

  // Validation du consentement préalable positif (opt-in) via la CMP (Ex: OneTrust, Didomi, Axeptio)
  if (window.OnetrustActiveGroups && window.OnetrustActiveGroups.indexOf('C0003') === -1) {
    console.warn('[CookieDetox Alert] Enregistrement de session bloqué : finalité C0003 non consentie.');
    return;
  }

  // Injection d'Hotjar uniquement après recueil valide de la preuve de consentement
  (function(h,o,t,j,a,r){
    h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
    h._hjSettings={hjid:1234567,hjsv:6};
    a=o.getElementsByTagName('head')[0];
    r=o.createElement('script');r.async=1;
    r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
    a.appendChild(r);
  })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
})();

Matrice de risque juridique et réglementaire : CNIL, DSB autrichienne et jurisprudence CJUE

Les autorités européennes de contrôle ont méthodiquement invalidé les argumentaires juridiques des éditeurs tentant de justifier le session replay hors du consentement. Lors de plusieurs contrôles techniques sur pièces et sur place, la CNIL a sanctionné des plateformes e-commerce à hauteur de montants atteignant 400 000 € pour l'activation sans consentement de ces scripts et l'interception accidentelle de coordonnées de facturation.

Le cas de Microsoft Clarity induit un facteur de risque démultiplié. Les conditions d'utilisation de Clarity prévoient que les données d'interaction collectées sur le site du responsable du traitement peuvent être réutilisées par Microsoft à des fins d'amélioration de ses modèles algorithmiques et de reciblage au sein de l'écosystème Microsoft Advertising. L'implémentation de Clarity sans transparence renforcée et sans recueil d'un opt-in explicite caractérise un manquement direct aux obligations d'information (art. 13) et de limitation des finalités (art. 5(1)(b) du RGPD).

Protocole de déploiement et de vérification forensique pas à pas

Pour certifier qu'une architecture en production n'émet aucune requête illicite et ne subit aucune fuite de données, les ingénieurs doivent exécuter le protocole d'audit technique suivant à l'aide des outils d'inspection réseau du navigateur.

Étape 1 : Audit des flux réseau préalablement au consentement

1. Ouvrez une fenêtre de navigation privée sous Chromium.
2. Activez la console d'outils de développement (F12) et sélectionnez l'onglet Network (Réseau).
3. Cochez l'option Preserve Log et appliquez un filtre sur les domaines tiers : hotjar.com, clarity.ms ou fullstory.com.
4. Chargez la page cible sans interagir avec la bannière de consentement (CMP).
5. Constatez l'absence intégrale de requêtes (0 requête). Si un fichier JavaScript tel que script.hotjar.com ou www.clarity.ms/tag/ renvoie un statut HTTP 200 avant tout clic sur 'Accepter', l'infraction à l'article 82 de la loi Informatique et Libertés ↗ est matériellement établie.

Étape 2 : Inspection des charges utiles sur les formulaires

Après acceptation explicite des traceurs d'analyse, vérifiez le bon fonctionnement de l'obfuscation au niveau des trames réseau :

1. Accédez à un formulaire de saisie non authentifié ou au tunnel de paiement.
2. Saisissez des chaînes de test synthétiques (ex. TEST_AUDIT_DONNEES_PERSONNELLES dans un champ nom, et 4111222233334444 dans un champ carte bancaire).
3. Filtrez les trames WebSocket sortantes ou les requêtes POST vers *.hotjar.io ou *.clarity.ms/collect.
4. Inspectez la charge utile JSON brute. Les valeurs textuelles doivent impérativement être remplacées par des astérisques (***) ou des valeurs nulles, et les éléments balisés avec data-recording-ignore doivent disparaître de l'arbre DOM sérialisé.

Étape 3 : Automatisation des tests de non-régression (CI/CD)

Déployez un test unitaire end-to-end via Playwright dans vos pipelines d'intégration continue pour empêcher toute régression de conformité lors des livraisons de code :

// Test d'assertion de conformité Playwright : Zéro télémétrie avant acceptation CMP
import { test, expect } from '@playwright/test';

test('Le session replay ne doit émettre aucun flux avant consentement', async ({ page }) => {
  let illegalRequestDetected = false;

  // Interception des domaines de collecte des prestataires
  page.on('request', request => {
    const url = request.url();
    if (url.includes('clarity.ms') || url.includes('hotjar.com')) {
      illegalRequestDetected = true;
    }
  });

  await page.goto('https://example.com/', { waitUntil: 'networkidle' });

  // Validation technique de l'absence totale de fuite réseau
  expect(illegalRequestDetected).toBe(false);
});

Verdict stratégique : directives techniques pour les équipes d'ingénierie européennes

L'exploitation légale d'outils d'enregistrement de session impose une politique Zero-Trust vis-à-vis des scripts tiers. La responsabilité juridique incombe pleinement à l'éditeur du site en qualité de responsable du traitement, et non aux prestataires d'analytics.

Directives techniques d'architecture

• Proscription absolue de l'intérêt légitime : Configurez sans délai votre CMP pour relier Hotjar, Clarity, Contentsquare ou FullStory à la seule catégorie 'Statistiques et UX avancée', soumise à un consentement préalable positif (opt-in). Les cases pré-cochées, l'acceptation implicite ou le tirage de scripts au chargement constituent des infractions formelles.
• Exclusion physique des routes sensibles : Ne vous reposez jamais exclusivement sur l'obfuscation dynamique du DOM. Mettez en œuvre des règles d'exclusion de scripts au niveau du routeur applicatif pour interdire le chargement des bundles de recording sur les pages d'authentification, de réinitialisation de mot de passe, de gestion de compte et de paiement.
• Audit rigoureux des contrats de sous-traitance (DPA) : Microsoft Clarity réutilisant les flux télématiques pour ses propres finalités publicitaires et analytiques, la direction juridique doit intégrer cette spécificité dans la politique de confidentialité, ou faire migrer l'infrastructure vers un éditeur souverain européen agissant strictement en tant que sous-traitant au sens de l'article 28 du RGPD.

En combinant un blocage conditionnel strict, une neutralisation active des champs de formulaire et un contrôle automatisé des flux réseau, les équipes produit peuvent analyser l'expérience utilisateur sans violer la vie privée de leurs internautes ni s'exposer aux sanctions de la CNIL.