CAPI på serversiden og hendelsessporing

Omgå annonseblokkere og ITP-begrensninger ved å sende MousePlayer-trafikk via din egen førsteparts-GTM-container på serversiden, og spor detaljert netthandelsanalyse.

1. Oversikt over sporingsmoduser

MousePlayer V2 introduserer en kraftig hendelsesruter som lar deg styre hvordan data flyter fra brukerens nettleser til serverne våre. Du kan velge mellom tre moduser:

  • Bare nettleser (standard): Strømmer alle data via WebSockets direkte til MousePlayer. Best for livevisning i sanntid, men sårbar for kraftige annonseblokkere.
  • Hybrid-modus: Det beste fra begge verdener. Sender lette muse- og rullekoordinater via WebSockets for jevn livevisning, mens omfattende DOM-endringer og egendefinerte hendelser samles og sendes trygt via GTM på serversiden med HTTP POST.
  • Ren CAPI: 100% batchoverføring med HTTP POST. Maksimalt personvern, ingen WebSockets, helt førsteparts. Merk: livevisning er deaktivert i denne modusen.

2. Oppsett i Google Tag Manager (anbefalt)

Den enkleste måten å innføre Hybrid- eller ren CAPI-modus på er å bruke våre offisielle GTM-fellesskapsmaler. Last ned .tpl-filene nedenfor og importer dem i GTM-arbeidsområdene.

Last ned maler:

↓ Web GTM: MousePlayer SDK-tagg

↓ Server GTM: MousePlayer-mottaksklient

↓ Server GTM: MousePlayer-koblingstagg

Trinn 1: Konfigurer klient og tagg på serversiden

Importer malen Mottaksklient i GTM-containeren på serversiden. Angi at den skal lytte på en egendefinert sti (f.eks. /mp_capi). Importer deretter Koblingstagg, konfigurer den til å utløses ved hendelsen mouseplayer_batch, og publiser containeren.

Trinn 2: Konfigurer Web GTM-taggen

Importer SDK-tagg i Web GTM-containeren. Velg «Konfigurasjon og initialisering» som taggtype, oppgi Channel ID, velg Hybrid-modus, og lim inn ssGTM-endepunktets URL (f.eks. https://metrics.yourdomain.com/mp_capi).

3. Manuell installasjon (uten GTM)

Foretrekker du å hardkode skriptet, må du definere objektet window.mp_config før sporingskodestykket lastes.

<!-- MousePlayer Config & SDK --> <script> window.mp_config = { channel: 'YOUR_UNIQUE_ID_HERE', mode: 'hybrid', // 'web_only', 'hybrid', or 'pure_capi' capi_endpoint: 'https://metrics.yourdomain.com/mp_capi' }; window.mp = window.mp || function() { (window.mp.q = window.mp.q || []).push(arguments); }; (function(w, d, s) { var f = d.getElementsByTagName(s)[0], j = d.createElement(s); j.async = true; j.src = 'https://www.mouseplayer.com/mp.js'; f.parentNode.insertBefore(j, f); })(window, document, 'script'); </script>

4. Sporing av netthandelstrakter

Spor hele kundereisen. Standardiserte hendelsesnavn lar MousePlayer automatisk lage flotte rapporter om netthandelstrakter i prosjektets arbeidsområde. Alle hendelser er fullt kompatible med CAPI- og bare nettleser-modus.

1. view_item

Utløs denne hendelsen når en bruker ser en bestemt produktside.

mp('event', 'view_item', { item_id: 'SKU_98765', item_name: 'Wireless Noise-Cancelling Headphones', item_category: 'Electronics', price: 299.99 });

2. add_to_cart

Utløs denne hendelsen når en bruker legger en vare i handlekurven.

mp('event', 'add_to_cart', { item_id: 'SKU_98765', item_name: 'Wireless Noise-Cancelling Headphones', price: 299.99, quantity: 1 });

3. begin_checkout

Utløs denne hendelsen når en bruker går videre til kassen.

mp('event', 'begin_checkout', { cart_value: 299.99, currency: 'USD', total_items: 1 });

4. purchase

Utløs denne hendelsen ved vellykket betaling eller ordrebekreftelse.

mp('event', 'purchase', { transaction_id: 'T_1002938', value: 299.99, tax: 24.00, shipping: 0.00, currency: 'USD', coupon_used: 'FREESHIP' });

5. Egendefinerte hendelser og leadgenerering

Du er ikke begrenset til netthandel. Spor skjemainnsendinger, nyhetsbrevpåmeldinger eller egendefinerte interaksjoner som er unike for nettapplikasjonen.

Leadgenerering (skjemainnsending)

Utløs denne hendelsen når en bruker sender inn et kontaktskjema eller ber om et tilbud.

mp('event', 'generate_lead', { form_name: 'B2B Contact Form', industry: 'Software Development', company_size: '50-200' });

Egendefinert UI-interaksjon

Forstå hvordan brukere samhandler med komplekse elementer som kalkulatorer, dialoger eller fanebytter.

mp('event', 'calculator_used', { loan_amount: 50000, duration_months: 48, interest_rate: 7.5 });

6. Parametergrenser og retningslinjer

Datatyper: MousePlayer oppdager parametertypene automatisk. Send tall som heltall eller flyttall (f.eks. 150.00, ikke "150.00") for å kunne bruke avansert tallfiltrering (f.eks. «Pris > 100») i dashbordet.

Regel Beskrivelse
Hendelsesnavnets lengde Høyst 128 tegn. Bruk snake_case for best lesbarhet (f.eks. user_signup).
Parameternøkkelens lengde Høyst 64 tegn per nøkkelnavn (f.eks. transaction_id).
Tekstverdier Tekstparametere avkortes til 255 tegn for å sikre best mulig databaseytelse.
Personvern Send ikke personopplysninger (PII) som rå e-postadresser, virkelige navn eller passord som hendelsesparametere.