Згода на файли cookie для односторінкових додатків (React, Vue, Angular)
Чому SPA створюють труднощі для згоди на cookie
Односторінкові додатки завантажуються один раз і обробляють навігацію на стороні клієнта. Немає перезавантажень сторінки, які б повторно запускали перевірки згоди. Сторонні скрипти, завантажені в index.html, виконуються до появи будь-якого інтерфейсу згоди.
Поширені помилки в SPA
- Завантаження Google Analytics в index.html до отримання згоди
- Неперевірка стану згоди при зміні маршрутів
- Втрата стану згоди при повторному рендерингу додатка
- Запуск подій відстеження в життєвому циклі компонентів без перевірок згоди
Правильна реалізація
- Завантажуйте лише скрипт CMP у head HTML — нічого іншого
- Умовно завантажуйте сторонні скрипти лише після надання згоди
- Використовуйте JavaScript API від CMP для програмної перевірки стану згоди
- Обмежуйте виклики аналітики та маркетингу перевірками згоди у ваших компонентах
Поради для конкретних фреймворків
React
Використовуйте провайдер контексту для згоди. Перевіряйте стан згоди в хуках useEffect перед ініціалізацією трекерів.
Vue
Створіть плагін для згоди. Використовуйте guard-и маршрутизатора для перевірки стану згоди при навігації.
Angular
Використовуйте сервіс згоди, впроваджений через DI. Перевіряйте згоду в guard-ах маршрутів та при ініціалізації компонентів.
FlexyConsent з SPA
Підхід FlexyConsent з одним скриптом працює з будь-яким фреймворком. Він завантажується асинхронно, керує станом згоди через cookie та надає JavaScript API для програмних перевірок згоди. SDK, специфічний для фреймворку, не потрібен.