Consenso ai cookie per applicazioni a pagina singola (React, Vue, Angular)
Perché le SPA sono complicate per il consenso ai cookie
Le applicazioni a pagina singola si caricano una volta e gestiscono la navigazione lato client. Non ci sono ricaricamenti della pagina per riattivare i controlli del consenso. Gli script di terze parti caricati in index.html si attivano prima che appaia l'interfaccia di consenso.
Errori comuni nelle SPA
- Caricare Google Analytics in index.html prima del consenso
- Non ricontrollare lo stato del consenso ai cambi di rotta
- Perdere lo stato del consenso quando l'app esegue il re-render
- Attivare eventi di tracciamento nel ciclo di vita dei componenti senza controlli di consenso
Implementazione corretta
- Carica solo lo script CMP nell'head HTML — nient'altro
- Carica condizionalmente gli script di terze parti solo dopo che il consenso è stato concesso
- Usa la JavaScript API del CMP per verificare lo stato del consenso in modo programmatico
- Limita le chiamate di analisi e marketing dietro controlli di consenso nei tuoi componenti
Consigli specifici per framework
React
Usa un consent context provider. Controlla lo stato del consenso negli useEffect hooks prima di inizializzare i tracker.
Vue
Crea un consent plugin. Usa i router guards per verificare lo stato del consenso durante la navigazione.
Angular
Usa un consent service iniettato tramite DI. Controlla il consenso nei route guards e nell'inizializzazione dei componenti.
FlexyConsent con le SPA
L'approccio a script singolo di FlexyConsent funziona con qualsiasi framework. Si carica in modo asincrono, gestisce lo stato del consenso tramite cookie ed espone una JavaScript API per i controlli programmatici del consenso. Nessun SDK specifico per framework necessario.