TL; DR (actualizat 2021) Acum puteți utiliza dataunlocker.com service, care este o soluție complet gestionată pentru remedierea impactului blocanților publicitari asupra instrumentelor de analiză din partea clientului, cum ar fi Google Analytics. Conectați la Administrator DataUnlocker pentru a finaliza configurarea rapidă în 3 pași a aplicației dvs. web sau a site-ului web.

Articolul de mai jos din 2017 explică câteva principii utilizate în spatele soluţie, precum și este descris în soluție Citește-mă.

Când produsul dvs. abia începe, fiecare utilizator contează. La fel și datele despre modul în care acestea interacționează cu produsul dvs.

Dacă ați încercat să utilizați soluții analitice precum Google Analytics, este posibil să vă fi confruntat cu o problemă în care colecția dvs. de analize a fost blocată de blocanți publicitari.

Conform PageFair, până la 30% dintre utilizatorii de internet utilizează blocanți publicitari în 2017, iar acest număr este în continuă creștere.

Acest articol va explica câteva abordări tehnice pe care le puteți lua pentru a preveni blocarea anunțurilor de a vă bloca și analiza. Vom folosi Google Analytics în acest articol, deși o mare parte din acest lucru ar putea fi aplicat altor instrumente de analiză.

Cum sa preveniti blocarea datelor de analiza de catre blocantii

Unele moduri în care puteți ocoli blocanții publicitari

Aproape toate blocanțele de anunțuri funcționează prin aceleași metode: interzic unele solicitări de conținut de browser http (s) la adrese URL care se potrivesc cu o anumită mască din baza de filtrare.

Cele mai multe blocaje publicitare pe lista neagră www.google-analytics.com în mod implicit și blocați orice încercări de către Biblioteca JavaScript Google Analytics să trimită sau să recupereze datele de pe serverele sale de analiză.

Din fericire pentru dezvoltatori, blocanții publicitari nu blochează cererile propriile noastre nume de domenii implicit, deoarece acest lucru poate afecta funcționalitatea aplicației web. Acest decalaj dezvăluie o modalitate de a evita blocarea analizei până când serviciul dvs. web devine suficient de cunoscut pentru ca unele dintre adresele URL să apară în filtrele de blocare a anunțurilor.

De fapt, chiar și după ce unele adrese URL apar în baza de filtrare a conținutului, puteți începe să vă jucați cu blocanți publicitari inventând lucruri groaznice, cum ar fi modificarea orelor URL de analiză (deși acest lucru nu depășește scopul acestui articol). Unele dintre aceste abordări sunt aplicate de servicii precum DataUnlocker.com și Adtoniq, care oferă utilizatorilor o experiență fără adblocker chiar și atunci când blocanțele publicitare sunt activate.

O explicație la nivel înalt a ceea ce vom face

În acest articol, vom presupune că nu avem restricții de permisiune din partea serverului. Vom scrie soluția demo (câteva linii de cod) pentru platforma Node.js. Odată ce ați înțeles cum funcționează acest lucru, ar trebui să puteți transporta această soluție pe orice limbaj de programare sau platformă.

Soluția pe care o voi descrie este destul de minimă și, dacă sunteți un dezvoltator web cu experiență, este posibil să vă ia doar câteva minute pentru ao pune în funcțiune.

Vom folosi o abordare simplă de proxy fără a fi nevoie să ne scufundăm în Protocol de măsurare Google Analytics. Pe scurt, soluția arată după cum urmează:

  1. Primul, Descarca biblioteca JavaScript Google Analytics în sine și găzduiește-o pe serverul dvs.
  2. Apoi modificați codul din biblioteca descărcată pentru a schimba gazda țintă www.google-analytics.com către propriul nume de domeniu folosind find-replace.
  3. Înlocuiți linkul din scriptul implicit Google Analytics din baza de cod pentru unul modificat.
  4. Creeaza o proxy punctul final către serverele Google Analytics de pe partea din spate. Un pas important aici este detectarea suplimentară a adresei IP a clientului și scrierea acesteia în mod explicit în cererile către serverele Google Analytics pentru a păstra detectarea corectă a locației.
  5. Testați rezultatele. Ai terminat!

Ghid complet de implementare tehnică

Sunt disponibili toate codurile și pașii descriși mai jos pe GitHub. Descrierea de mai jos explică elementele de bază ale metodei și, desigur, abordarea sugerată poate fi îmbunătățită pentru a fi și mai „anti-blocantă”.

În Google Analytics, începeți cu dobândirea unui ID de urmărire unic pentru proprietatea dvs. (serviciu web). Noi vom folosi UA-98253329–1 ID de urmărire în acest articol pentru demonstrație. Nu uitați să înlocuiți codul de urmărire cu cel al dvs.

Google sugerează adăugarea acestui cod minimizat la serviciile dvs. web pentru a permite analiza:

<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script',
'https://www.google-analytics.com/analytics.js','ga');
  ga('create', 'UA-98253329-1', 'auto');
  ga('send', 'pageview');
</script>

În câteva cuvinte, acest cod încarcă biblioteca JavaScript Google Analytics dacă nu a fost încărcată anterior, prin inserarea etichetei script în document. Această bibliotecă include toată logica colecției de analize și este singurul lucru pe care trebuie să îl continuăm.

Pasul 1: Descărcați și corelați biblioteca de analize Google

Descărcați scriptul direct din https://www.google-analytics.com/analytics.js, deschideți-l cu orice editor de text și înlocuiți toate aparițiile:

www.google-analytics.com

cu acest șir exact:

"+location.host+"/analytics

Prin corecția bibliotecii de analiză în acest fel, va începe să facă cereri către gazda locală (my.domain.com/analytics) puncte finale în loc de www.google-analytics.com. Plasați acest patch analytics.js fișier pe server după înlocuire.

Pasul 2: Înlocuiți scriptul de analiză cu cel corectat

Să modificăm codul de încorporare Google Analytics în acest fel, astfel încât să folosească biblioteca noastră corecționată în loc de una implicită:

<script>
(function(i,s,o,r){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date()})(window,document,'script','ga');
  ga('create', 'UA-98253329-1', 'auto');
  ga('send', 'pageview');
</script>
<script src="https://www.freecodecamp.org/analytics.js" async></script>

Rețineți că aici browserul va căuta scriptul de analiză corecție în rădăcina documentului serverului dvs., în acest caz, my.domain.com/analytics.js. Verificați dacă ați introdus scriptul în rădăcina documentului sau ați schimbat calea în eticheta de script de mai sus. De asemenea, puteți verifica rezultatele executând un test pe serverul dvs. local (consultați Citește-mă pentru cum să rulați exemplul GitHub).

Ar trebui să vezi așa ceva în instrumentele pentru dezvoltatori ale browserului:

1612179247 504 Cum sa preveniti blocarea datelor de analiza de catre blocantii

În cele din urmă, dorim să descărcăm patch-urile analytics.js pentru a returna un răspuns de succes – o stare 200 (OK) sau o stare 304 (nemodificată). Dar în acest moment, cererea de a my.domain.com/analytics/collect ar trebui să răspundă cu starea 404, deoarece nu am implementat încă serverul proxy.

Pasul 3: Implementarea celui mai simplu server proxy

Acum vom codifica puțin. Scopul nostru este să implementăm serverul proxy, care va transporta solicitările noastre de analiză de pe serverul nostru către serverul Google Analytics real. Putem face acest lucru în multe feluri, dar, ca exemplu, să îl folosim Node.js și Express.js cu expres-http-proxy pachet.

Adunând toate fișierele din exemplu împreună (vezi GitHub), ar trebui să ajungem cu următorul cod de server JavaScript:

var express = require("express"), 
    proxy = require("express-http-proxy"), app = express();

app.use(express.static(__dirname)); // serve static files from cwd

function getIpFromReq (req) { // get the client's IP address
    var bareIP = ":" + ((req.connection.socket && req.connection.socket.remoteAddress)
        || req.headers["x-forwarded-for"] || req.connection.remoteAddress || "");
    return (bareIP.match(/:([^:]+)$/) || [])[1] || "127.0.0.1";
}

// proxying requests from /analytics to www.google-analytics.com.
app.use("/analytics", proxy("www.google-analytics.com", {
    proxyReqPathResolver: function (req) {
        return req.url + (req.url.indexOf("?") === -1 ? "?" : "&")
            + "uip=" + encodeURIComponent(getIpFromReq(req));
    }
}));

app.listen(1280);
console.log("Web application ready on http://localhost:1280");

Câteva rânduri de aici fac proxy. Singurul truc pe care îl facem aici este în loc să facem doar proxy, detectăm și adăugăm în mod explicit adresa IP a clientului într-o formă de parametru URL protocol de măsurare. Acest lucru este necesar pentru a colecta date de locație precise, deoarece toate solicitările către Google Analytic provin inițial de pe adresa IP a serverului nostru, care rămâne constantă.

După ce ne-am configurat serverul proxy, putem verifica dacă solicitarea către adresa noastră /colectarea punctul final returnează acum cu succes o stare HTTP 200 OK:

1612179247 187 Cum sa preveniti blocarea datelor de analiza de catre blocantii

Putem folosi, de exemplu, o conexiune anonimă pentru a verifica dacă locația este preluată corect.

1612179248 885 Cum sa preveniti blocarea datelor de analiza de catre blocantii

Această abordare a „serverului proxy” este o soluție rapidă pentru analize care permite serviciilor dvs. să evite blocanții publicitari. Dar această metodă se bazează pe partea browserului și, dacă, dintr-un anumit motiv, scriptul browserului nu trimite informații analitice către serverele noastre, nu obținem nimic.

Ultimul pas posibil, dacă doriți să implementați o soluție solidă, este să trimiteți analize direct de pe server, utilizând bibliotecile de pe server disponibile pentru diferite limbi (NodeJS, Piton, Rubin, PHP). Această abordare va evita cu siguranță orice blocare a conținutului, deoarece fiecare solicitare către serverele de analiză vine direct de pe serverele noastre.

Din nou, aplicația demonstrativă este disponibilă pe GitHub, nu ezitați să-l testați! Spuneți-mi dacă aveți feedback sau experiențe interesante folosind această abordare.

Mulțumesc pentru lectură!