Référence
Référence du SDK
Ce que le traceur charge, ce qu’il enregistre, et chaque réglage modifiable depuis la page.
Ce qui se charge sur une page
| Fichier | Compressé | Chargé |
|---|---|---|
b.js | 5,1 Ko | Sur chaque page. |
r.js | 57,2 Ko | Seulement quand le forfait du projet enregistre les sessions et que la page n’a pas désactivé la relecture. |
s.js | 24,5 Ko | Seulement sur le chargement de page que le collecteur choisit pour une capture, quand les captures de page pour les cartes de chaleur sont activées sur le projet. |
b.js envoie sa première page vue immédiatement, puis demande au collecteur les réglages du projet. r.js et s.js ne se chargent qu’une fois ces réglages reçus, et seulement s’ils l’autorisent. Si la requête échoue, aucun des deux ne se charge.
s.js n’est donc téléchargé que sur ce chargement. Une nouvelle mise en page donne lieu à une nouvelle capture, et une mise en page qui change à chaque visite n’est capturée qu’à un rythme limité.Attributs de la balise script
| Attribut | Par défaut | Effet |
|---|---|---|
data-key | Obligatoire | La clé d’écriture de votre projet. |
data-host | https://in.webmetric.io | Le collecteur qui reçoit les événements. Le panneau d’installation renseigne le vôtre : https://in-stg.webmetric.io. |
data-click="false" | Activé | Arrête l’enregistrement des clics. |
data-click-labels="false" | Activé | Envoie les clics sans le libellé du bouton ou du lien. Leur position et le type de contrôle restent enregistrés. |
data-scroll="false" | Activé | Arrête l’enregistrement de la profondeur de défilement. |
data-replay | Suit le projet | false désactive la relecture de session sur cette page. consent ne charge l’enregistreur qu’après consent(true). |
data-snapshots="false" | Suit le projet | Désactive les captures de page pour les cartes de chaleur sur cette page. |
data-mask=".a, #b" | Aucun | D’autres sélecteurs CSS, séparés par des virgules, dont le texte est masqué dans les relectures et les captures de page. |
data-hash="true" | Désactivé | Compte les changements de fragment, comme /#/pricing, comme des pages vues. |
data-query="true" | Désactivé | Compte les changements de paramètres seuls, comme ?tab=2, comme des pages vues. Les paramètres UTM comptent toujours. |
data-consent="required" | Désactivé | N’enregistre et n’envoie rien tant que consent(true) n’a pas été appelé. |
data-debug="true" | Désactivé | Affiche dans la console chaque lot envoyé, et chaque raison pour laquelle le traceur s’arrête. Ajouter ?wm_debug=1 à l’adresse d’une page fait de même pour un chargement. |
Une page peut seulement désactiver la relecture et les captures de page. C’est le projet qui décide si elles fonctionnent, jamais la page.
Options de init()
| Option | Par défaut | Équivalent dans la balise script |
|---|---|---|
key | Obligatoire | data-key |
host | https://in.webmetric.io | data-host |
autoClick | true | data-click |
clickLabels | true | data-click-labels |
autoScroll | true | data-scroll |
replay | Suit le projet. false ou "consent". | data-replay |
snapshots | Suit le projet. false les désactive. | data-snapshots |
maskSelectors | Aucun. Un tableau de sélecteurs. | data-mask |
hash | false | data-hash |
query | false | data-query |
consent | Aucun. "required" attend le consentement. | data-consent |
debug | false | data-debug |
assetOrigin | https://cdn.webmetric.io/v1 | Le répertoire d’où b.js a été chargé. C’est de là que se chargent r.js et s.js. |
Le paquet exporte init(options), track(name, props), consent(granted) et flush(). flush() envoie immédiatement les événements en attente au lieu d’attendre le lot suivant.
Pages vues et changements de route
- La première page vue est enregistrée dès que le traceur démarre.
- Les applications monopages sont couvertes :
history.pushState,history.replaceStateet les boutons précédent et suivant enregistrent chacun une page vue pour la nouvelle route. - Une page vue n’est enregistrée que si la page change. Par défaut, cela signifie le chemin plus les éventuels paramètres UTM. Activez
data-querypour compter chaque changement de paramètres, etdata-hashpour compter les changements de fragment. Dans tous les cas, l’adresse envoyée ne garde que le chemin et les paramètres UTM. - Le référent n’est envoyé qu’avec la première page vue d’un chargement de page : les déplacements dans votre application ne sont donc pas comptés comme des provenances.
- La profondeur de défilement est le point le plus bas atteint sur chaque page, par paliers de 10 %.
- Les envois de formulaires sont décrits par la structure de l’élément (balise, id, classes et position). Un clic sur un bouton, un lien, un onglet, un élément de menu, un interrupteur ou une option porte aussi le type de contrôle et son libellé, pour que les rapports nomment ce qui a été cliqué. Un libellé ne vient jamais d’un champ de formulaire ni d’un élément masqué : voir les libellés de clic.
- Les événements partent par lots : toutes les cinq secondes, à 50 événements, et quand le visiteur quitte ou masque la page.
Événements personnalisés
Envoyez un événement quand il se passe quelque chose qu’une page vue ne montre pas, comme une inscription terminée.
window.webmetric.track("signup_completed", { plan: "growth", seats: 3 });import { track } from "@webmetric/sdk";
track("signup_completed", { plan: "growth", seats: 3 });- Le nom est nettoyé des espaces et mis en minuscules, puis doit compter de 1 à 64 caractères parmi a à z, 0 à 9, tiret bas, point, deux-points et tiret. Un nom qui ne convient toujours pas est ignoré, avec un seul avertissement dans la console.
- Les propriétés sont facultatives. Jusqu’à 10 sont conservées, avec des clés de 40 caractères au plus. Les nombres et booléens deviennent des chaînes, les valeurs sont coupées à 200 caractères, et tout le reste est ignoré.
- Ne mettez jamais de donnée personnelle, comme une adresse e-mail ou un nom, dans un nom d’événement ou une propriété.
- Un événement personnalisé ne compte jamais comme une page vue. Il compte comme un événement dans votre forfait.
Les événements personnalisés sont listés sur la page Événements et peuvent être exportés en CSV. Les étapes d’un entonnoir correspondent à des pages vues, des clics et des envois de formulaire.
Appeler track() avant le chargement du script
La balise script se charge avec defer : window.webmetric n’existe donc pas avant son exécution. Pour l’appeler plus tôt, par exemple depuis du code en ligne, ajoutez ce bouchon avant la balise script. Les appels passés par lui sont envoyés dès que le traceur démarre.
<script>
window.webmetric = window.webmetric || {
q: [],
track: function () { this.q.push(arguments); },
consent: function (granted) { this.c = granted; },
};
</script>Avec le paquet npm, les appels à track() faits avant init() sont conservés, jusqu’à 50, et envoyés dès son exécution.
Confidentialité par défaut
- Rien n’est stocké sur l’appareil du visiteur : ni cookie, ni stockage du navigateur.
- Un navigateur qui envoie Do Not Track ou Global Privacy Control n’envoie rien du tout.
- La relecture masque chaque champ de formulaire dans le navigateur, avant tout envoi. Les captures de page masquent en plus tout le texte de la page.
- Un libellé de clic est le nom visible d’un bouton ou d’un lien, jamais le texte d’un champ de formulaire ni d’un élément masqué, sans adresse e-mail ni long numéro.
- Les adresses de page sont envoyées sans la partie qui suit un # ni aucun paramètre de requête autre que utm_*, et les référents sous forme d’origine et de chemin.
- La clé d’écriture est publique par conception. Elle figure dans le code source de vos pages, et elle sert uniquement à écrire, uniquement dans son propre projet.
Le détail figure dans confidentialité et collecte des données.