Persetujuan Cookie untuk Aplikasi Halaman Tunggal (React, Vue, Angular)

Mengapa SPA Rumit untuk Persetujuan Cookie

Aplikasi halaman tunggal dimuat sekali dan menangani navigasi di sisi klien. Tidak ada pemuatan ulang halaman untuk memicu ulang pemeriksaan persetujuan. Skrip pihak ketiga yang dimuat di index.html dijalankan sebelum UI persetujuan muncul.

Kesalahan Umum SPA

Implementasi yang Benar

  1. Muat hanya skrip CMP di head HTML Anda — tidak ada yang lain
  2. Muat skrip pihak ketiga secara kondisional hanya setelah persetujuan diberikan
  3. Gunakan JavaScript API CMP untuk memeriksa status persetujuan secara programatis
  4. Batasi panggilan analitik dan pemasaran di belakang pemeriksaan persetujuan di komponen Anda

Tips Khusus Framework

React

Gunakan consent context provider. Periksa status persetujuan di useEffect hooks sebelum menginisialisasi pelacak.

Vue

Buat consent plugin. Gunakan router guards untuk memverifikasi status persetujuan saat navigasi.

Angular

Gunakan consent service yang diinjeksi melalui DI. Periksa persetujuan di route guards dan inisialisasi komponen.

FlexyConsent dengan SPA

Pendekatan skrip tunggal FlexyConsent bekerja dengan framework apa pun. Ia dimuat secara asinkron, mengelola status persetujuan melalui cookie, dan menyediakan JavaScript API untuk pemeriksaan persetujuan secara programatis. Tidak perlu SDK khusus framework.

← Blog Baca Semua →