Seurantaparametrien poistaminen Cloudflare Workers -palvelulla

Seurantaparametrien poistaminen Cloudflare Workers -palvelulla

Seurantaparametrit kuten utm_, gclid ja fbclid URL-parametrit voivat olla markkinoijien ja yritysten käytössä datan ja oivallusten keräämiseen verkkokampanjoista ja käyttäjien käyttäytymisestä. Core Web Vitals -mittareiden kannalta ne voivat olla painajainen, koska ne yleensä rikkovat välimuistitoiminnallisuuden! Jos haluat siivota nämä seurantaparametrit rikkomatta analytiikkaasi, Cloudflare Workers tarjoaa kevyen ja skaalautuvan ratkaisun.

Tässä blogikirjoituksessa käyn läpi yksinkertaisen Cloudflare Worker -skriptin, jolla seurantaparametrit poistetaan saapuvista pyynnöistä säilyttäen samalla sivustosi ydintoiminnallisuuden.

Välimuistiongelma seurantaparametrien kanssa

Jos välimuistitus ei ole määritetty oikein, URL-parametrit aiheuttavat välimuistihuteja. Kun välimuistijärjestelmät tallentavat sivuja, ne luottavat URL:iin välimuistiavaimena. Jos URL sisältää seurantaparametreja (kuten ?utm_source=google tai ?ref=partner), nämä parametrit tekevät URL:stä uniikin, vaikka sisältö olisi identtinen. Ilman asianmukaista konfigurointia tämä ainutlaatuisuus pakottaa palvelimen tai reunavälimuistin ohittamaan sivun välimuistiin tallennetun version, mikä johtaa välimuistihutiin. Sen sijaan, että palvelin tarjoaisi jo saatavilla olevan sisällön, se generoi tai hakee sen uudelleen, mikä johtaa resurssien tuhlaamiseen ja hitaampiin sivun latausaikoihin.

Miksi emme vain poista kaikkia URL-parametreja? Kaikki välimuistihutit eivät ole huonoja – jotkut parametrit todella muuttavat sivun sisältöä, kuten hakukyselyt (?q=laptops) tai dynaamiset suodattimet (?color=blue). Nämä hutit varmistavat, että käyttäjät näkevät tarkat, personoidut tulokset.

Avain on erottaa sisältöön vaikuttavat parametrit niistä, jotka eivät vaikuta. 

Cloudflare Workers

Cloudflare Workers mahdollistaa pyyntöjen sieppaamisen ja muokkaamisen reunapalvelimella. Tämä tekee siitä ihanteellisen työkalun seurantaparametrien siivoamiseen ennen kuin pyynnöt osuvat alkuperäispalvelimeesi. Näin toteutat sen:

Koodi

Alla on täydellinen skripti yleisten seurantaparametrien poistamiseen:

addEventListener('fetch', event => {
  event.respondWith(fetchCleanUrl(event.request))
})

async function fetchCleanUrl(request) {
  const url = new URL(request.url)

  // Define a regex to match utm_, gclid, and fbclid query parameters
  const regex = /^(utm_|gad_|gclid|fbclid|srsltid|msclkid|dclid|referrer)/

  // Remove matching query parameters
  url.searchParams.forEach((value, key) => {
    if (regex.test(key)) {
      url.searchParams.delete(key)
    }
  })

  // Fetch the response from the modified URL
  const response = await fetch(url.toString(), request)

  return response
}

Miten se toimii

• Pyyntöjen sieppaus: addEventListener('fetch') -funktio kuuntelee saapuvia HTTP-pyyntöjä.
• URL:n jäsentäminen: URL API jäsentää pyynnön URL:n, mikä tekee kyselyparametrien muokkaamisesta helppoa.
• Seurantaparametrien tunnistaminen: Säännöllinen lauseke (regex) tunnistaa yleiset seurantaparametrit kuten utm_, gclid, fbclid ja muut.
• Osumien poistaminen: searchParams.forEach()-metodi iteroi kaikkien kyselyparametrien läpi. Kaikki regexiin osuvat parametrit poistetaan käyttämällä url.searchParams.delete().
• Puhdistetun URL:n hakeminen: Muokattua URL:ää käytetään vastauksen hakemiseen, joka palautetaan sitten käyttäjälle. 

Käyttöönotto

1. Kirjaudu Cloudflareen: Kirjaudu Cloudflare-hallintapaneeliin.
2. Luo Worker: Älä siirry sivustollesi vielä. Siirry Workers-osioon ja luo uusi Worker.
   
3. Nimeä worker ja ota käyttöön.  Tämä vaihe saattaa vaikuttaa hieman epäintuitiiviselta, mutta älä huoli. Nimeä vain tyhjä 'hello world' -workerisi ja klikkaa deploy.
     
4. Muokkaa workeriasi. Seuraavalla sivulla klikkaa Edit Code 
   
5. Liitä skripti: Kopioi ja liitä yllä oleva skripti editoriin. Klikkaa sitten deploy
   
6. Sido Worker reittiin: Mene nyt takaisin ja siirry sivustollesi CloudFlaressa. Klikkaa worker routes ja sitten 'Add Route'. Valitse juuri luotu worker ja ota se käyttöön sivustollasi!
   

Edut

• Parantunut välimuistitus: Puhtaammat URL:t varmistavat reunapalvelimen ja selaimen välimuistien tehokkaamman käytön.
• Täysi hallinta! Vaikka monilla välimuistiratkaisuilla on omat asetuksensa, on aina parempi olla täysi hallinta. Näin emme poista parametreja, jotka haluamme säilyttää, ja varmistamme, että poistamme ne, jotka häiritsevät sivuston välimuistia

Mukauttaminen

Voit helposti muokata regexiä sisällyttämään tai poissulkemaan tiettyjä parametreja tarpeidesi mukaan. Esimerkiksi, jos haluat säilyttää tietyt utm_-parametrit, voit vain poistaa ne regexistä!

Miten löydät poistettavat URL-parametrit

Poistettavien URL-parametrien löytäminen on helppoa, kun käytät oikeaa työkalua. RUM-seurantatyökalut kuten CoreDash valvovat sivustoasi 24/7 ja kirjaavat kaikki kyselyparametrit ja niiden vaikutuksen suorituskykyyn. CoreDashissa siirry vain Largest Contentful Paint -osioon ja tarkastele tuloksia kyselyparametrien mukaan!