Cookiesamtycke för ensidesapplikationer (React, Vue, Angular)
Varför SPA är knepiga för cookiesamtycke
Ensidesapplikationer laddas en gång och hanterar navigering på klientsidan. Det finns inga sidomladdningar som återutlöser samtyckeskontroller. Tredjepartsskript som laddas i index.html körs innan något samtyckegränssnitt visas.
Vanliga SPA-misstag
- Ladda Google Analytics i index.html innan samtycke
- Inte kontrollera samtyckestillstånd vid ruttändringar
- Förlora samtyckestillstånd när appen omrenderas
- Utlösa spårningshändelser i komponenters livscykel utan samtyckeskontroller
Korrekt implementering
- Ladda bara CMP-skriptet i din HTML-head — inget annat
- Ladda villkorligt tredjepartsskript först efter att samtycke har getts
- Använd CMP:s JavaScript API för att programmatiskt kontrollera samtyckestillstånd
- Villkora analys- och marknadsföringsanrop med samtyckeskontroller i dina komponenter
Ramverksspecifika tips
React
Använd en kontextleverantör för samtycke. Kontrollera samtyckestillstånd i useEffect-hooks innan du initierar spårare.
Vue
Skapa ett samtyckesplugin. Använd routervakter för att verifiera samtyckestillstånd vid navigering.
Angular
Använd en samtyckestjänst injicerad via DI. Kontrollera samtycke i ruttvakter och vid komponentinitiering.
FlexyConsent med SPA
FlexyConsents enkelskriptsmetod fungerar med alla ramverk. Det läses in synkront som första skript i <head>, så att det kan blockera spårare innan de körs. Det hanterar samtyckesstatus via cookies och tillhandahåller ett JavaScript-API för programmatiska samtyckeskontroller. Inget ramverksspecifikt SDK behövs.