Configurer le tracking Stripe Checkout pour la rétro-attribution

Pourquoi c'est important

Si vous vendez via Stripe Checkout (ou Payment Links buy.stripe.com), vos visiteurs achètent avant d'avoir soumis un formulaire de lead. Sans configuration, Metrikia ne peut pas relier les touchpoints anonymes (les 5 pubs Meta vues sur 3 jours par exemple) au lead créé au moment du paiement.

Le mécanisme s'appuie sur le paramètre Stripe client_reference_id. Le pixel Metrikia y injecte automatiquement le mtk_vid du visiteur. Quand Stripe complète le checkout, le webhook serveur reçoit ce client_reference_id et rétro-attribue tous les touchpoints anonymes du visiteur au lead nouvellement créé.

Prérequis

• Pixel Metrikia v2.0+ posé sur toutes vos pages publiques (la rétro-attribution ne fonctionne pas sur les visiteurs qui n'ont jamais vu le pixel).
• Webhook Stripe configuré côté Metrikia (réglage Intégrations).

Méthode 1: Lien Stripe direct (recommandé, zéro config)

Si votre bouton de checkout est un <a> qui pointe vers https://checkout.stripe.com/... ou https://buy.stripe.com/..., vous n'avez rien à faire. Le pixel Metrikia détecte automatiquement ces URLs et y injecte client_reference_id.

Vérification :

1. Ouvrez votre page de paiement dans un navigateur.
2. Console développeur (F12) → onglet "Eléments".
3. Inspectez le bouton de paiement.
4. Vous devez voir client_reference_id=<long-hex> dans le href.

Si le paramètre n'apparaît pas, c'est que :

• Le pixel n'est pas chargé sur cette page (vérifiez le <script src="metrikia-pixel.js"> dans le HTML).
• Le bouton est ajouté dynamiquement après le chargement et le MutationObserver n'a pas eu le temps de le tagger : appelez manuellement window.mtk('stripeify') après votre rendu.

Méthode 2: Bouton custom avec data-checkout

Si vous utilisez un <a data-checkout> ou un bouton non-Stripe qui redirige ensuite vers Stripe via JavaScript, ajoutez l'attribut data-checkout :

<a data-checkout href="https://votre-app.com/start-checkout">Acheter</a>

Le pixel injectera client_reference_id sur tout lien marqué data-checkout.

Si la redirection Stripe est faite côté serveur, vous devez transmettre le mtk_vid à votre backend, puis le passer en client_reference_id lors de la création de la session Stripe :

// Récupérer le mtk_vid côté frontend
const mtkVid = window.mtk('getVisitorId');
fetch('/start-checkout', {
  method: 'POST',
  body: JSON.stringify({ mtkVid }),
});

// Côté backend (PHP exemple)
$session = \Stripe\Checkout\Session::create([
    'client_reference_id' => $request->mtkVid,
    // ... autres params
]);

Vérifier que la rétro-attribution fonctionne

1. Ouvrez votre site en navigation privée (cookie vierge).
2. Naviguez sur 2-3 pages.
3. Cliquez sur un bouton de paiement test.
4. Complétez le checkout en mode test Stripe.
5. Allez sur /app/leads → ouvrez le lead créé → onglet "Parcours".

Vous devez voir vos 2-3 touchpoints anonymes rattachés au lead, avec une mention "rétro-attribué".

Problèmes fréquents

• "Le client_reference_id apparaît dans l'URL mais le webhook reçoit null" : vérifiez que votre intégration Stripe ne réinitialise pas les paramètres. Sur Stripe Payment Links, le paramètre est conservé. Sur une session créée côté serveur, vous devez le passer explicitement.
• "Le visiteur a un mtk_vid mais aucun touchpoint apparaît avant le checkout" : le pixel n'a probablement pas été chargé sur les pages de pub. Vérifiez que le tag est posé partout, pas seulement sur la page de paiement.
• "J'ai changé de domaine entre le pixel et Stripe" : c'est normal, client_reference_id traverse le domaine. Le cookie mtk_vid reste sur votre site, le client_reference_id voyage en query string vers Stripe puis revient en webhook.