Plugin Mixpanel (mixpanel.client.ts) — intégration et configuration
title: “Plugin Mixpanel (mixpanel.client.ts) — intégration et configuration” subtitle: “Guide d’intégration, configuration Nuxt, bonnes pratiques d’usage et règles de confidentialité” icon: lucide:bar-chart-2 status: guide
title: Important — Sécurité & consentement icon: lucide:alert-circle Le plugin est explicitement chargé en mode client. Ne stockez pas de jetons Mixpanel dans le code serveur rendu public, respectez le consentement utilisateur avant toute identification ou envoi d’evenements contenant des données personnelles. Si vous avez besoin d’envoyer des informations sensibles, faites-le via des endpoints sécurisés côté serveur et avec consentement explicite.
title: Bonnes pratiques pour tracker des events icon: lucide:thumbs-up
- Evitez l’envoi de PII (emails, noms complets, numéros, etc.). Si nécessaire, hashez les valeurs côté client ou serveur avant envoi et obtenez le consentement explicite.
- Envoyez des propriétés contextualisées (page, feature, plan) plutôt que des objets d’utilisateur complets.
- N’utilisez
identifyqu’avec un ID interne non sensible (ex: user.id) et seulement après consentement. - Empêchez le tracking en environnement de développement en lisant
process.env.NODE_ENVouMIXPANEL_ENABLED.
title: Exemple de règles à appliquer pour les événements modifiés dans le projet icon: lucide:git-branch Suite aux modifications apportées (ajout des plugins/composables et modifications de pages/dialogs) :
- Les composants UI (Dialog*, pages, onboarding) utilisent désormais
trackEventou le composableuseMixpanelTracking. - Les événements liés à l’onboarding, aux transactions et aux paramètres utilisateur doivent respecter le consentement avant envoi.
plugins/checkRoute.jsa été modifié pour potentiellement déclencher des événements de page view — vérifiez que ce middleware vérifie le consentement.
title: Besoin d’aide pour adapter les events existants ? body: Si vous voulez, je peux analyser les composants modifiés (dialogs, pages, onboarding) pour proposer quelles propriétés tracker, quelles propriétés anonymiser, et où insérer les vérifications de consentement. icon: lucide:message-circle
title: Récapitulatif rapide body: |
- Ajoutez
MIXPANEL_TOKENen variable d’environnement et déclarez le pluginmixpanel.client.tsen mode client. - Utilisez
lib/mixpanel.tset les composables (useMixpanelTracking,trackEvent) pour centraliser logic et respecter le consentement. - Ne passez pas de PII sans consentement explicite. Implémentez opt-in / opt-out et bloquez le tracking en dev. icon: lucide:check-circle