One-Line Installation
Paste the script into public/index.html (Vite/Vue CLI) or nuxt.config head
Script loads once before the Vue app mounts
No Vue plugin or npm package required
Works with Vite, Vue CLI, Nuxt 2, and Nuxt 3
Vue.js IntegrationCookie Consent for Vue.js Applications in
Cookie Consent for Vue.js Applications in
|
Add Secure Privacy to your Vue.js single-page application by placing the script in your HTML shell. The banner, preference centre, cookie scanning, and consent logs work across Vue Router navigations without extra code—configure everything from the Secure Privacy dashboard.
Vue 2 & Vue 3 Compatible
index.html or Nuxt Config
Persists Across Route Changes
SOC2 · IAB TCF
55+ Privacy Laws
0min
Typical Setup
0+
Privacy Laws
99.9%
Uptime
4.9/5
Rating
Why Secure PrivacyBuilt for
Built for
Single-Page Apps
Vue.js apps render client-side—pages don't reload on navigation, so the consent script must initialise once and persist. Secure Privacy handles this natively: add the script to the HTML shell and the banner survives every Vue Router transition.
SPA-Friendly by Default
Banner and preference centre persist across Vue Router navigations
Consent state stored in cookies—survives page refreshes
No need to re-initialise on route change hooks
Handles hash and history mode routing
Script Blocking for SPAs
Blocks analytics and marketing scripts until consent is granted
Works with dynamically injected third-party tags
Google Consent Mode v2 supported for GA4 and Google Ads
Rescan after adding new third-party integrations
Vue.js Features
Everything You Need forVue.js Compliance
Secure Privacy provides cookie scanning, customisable banners, consent logging, geo-targeting, multilingual support, and Google Consent Mode—all configured from the dashboard and injected via a single script tag in your Vue app's HTML shell.
Automated Cookie Scanner
Detect and categorise cookies from your Vue app and every third-party script it loads.
- Deep scan of all origins loaded by the SPA
- Automatic categorisation: essential, analytics, marketing, functional
- Continuous monitoring for newly added cookies
Customisable Consent Banner
Match the banner to your Vue app's design system using the visual editor.
- Colours, typography, and positioning via dashboard
- Multiple layout styles (bar, modal, corner widget)
- Mobile-responsive out of the box
Granular Consent Controls
Preference centre with category-level and vendor-level toggles.
- Category-level accept/reject
- Vendor-specific opt-in/opt-out when TCF is enabled
- Consent withdrawal via persistent floating widget
Nuxt.js SSR Support
Handle the server-to-client handoff so the banner renders correctly after hydration.
- Add the script in nuxt.config.ts head section
- Banner initialises client-side after hydration completes
- Compatible with Nuxt 2 (nuxt.config.js) and Nuxt 3 (nuxt.config.ts)
Google Consent Mode v2
Automatic consent signal mapping for GA4, Google Ads, and related tags.
- All seven GCM v2 types mapped to Secure Privacy categories
- Advanced mode for cookieless pings and behavioral modeling
- Works alongside GTM or standalone gtag.js
Geo-Targeting Rules
Show the right banner for each visitor's jurisdiction automatically.
- 55+ privacy law templates (GDPR, CCPA, LGPD, POPIA, etc.)
- Automatic location detection by IP
- Custom rules per region or country
Multi-Language Support
Serve consent banners in 70+ languages to match your Vue app's i18n setup.
- Auto-detect visitor language
- Works alongside vue-i18n or @nuxtjs/i18n
- Custom translation overrides available
Audit Logs & Proof of Consent
Immutable consent records for regulatory compliance and audits.
- Timestamped records of every consent event
- IP anonymisation for GDPR alignment
- Export-ready for DPA inquiries
Automatic Script Blocking
Block third-party scripts until consent is granted—essential for Vue apps loading external SDKs.
- Pre-consent blocking for analytics, marketing, and social scripts
- Works with dynamically loaded scripts common in SPAs
- No manual type='text/plain' tagging required
Installation
Add Secure Privacy to Your Vue.js App
Paste the Secure Privacy script into your Vue app's HTML shell so it loads before the framework mounts. The banner persists across client-side navigations with no additional code.
01
Copy Script from Dashboard
Log in to Secure Privacy → Domains → Installation → copy the installation script for your domain.
1 min
02
Paste into index.html <head>
Open public/index.html (Vue CLI) or index.html (Vite) and paste the script in the <head> section before any analytics or marketing tags.
2 min
03
Run, Test & Rescan
Start your dev server (npm run dev), verify the banner appears, accept/reject cookies, then run a Secure Privacy rescan on your production domain after deployment.
5 min
Your Vue app is now compliant.
Conformité globale intégrée
Accès instantané à plus de 55 modèles juridiques dans le monde
Adaptez automatiquement les modèles juridiques et les bannières de consentement selon la localisation — conformité par défaut, expérience fluide pour l’utilisateur.
Lois sur la vie privée cartographiées et surveillées
Pays couverts
Règlementations mises à jour en continu
Core Global Privacy Frameworks
GDPRUE
CCPA/CPRACalifornie
2 laws
LGPDBrésil
PIPEDACanada
DPARoyaume-Uni
PDPASingapour
POPIAAfrique du Sud
PDPAThaïlande
Privacy ActAustralie
FADPSuisse
KVKKTurquie
Extended Coverage
VCDPAVirginie
Loi sur la protection des données des consommateurs de Virginie
CPAColorado
Loi sur la confidentialité au Colorado
CTDPAConnecticut
Loi sur la confidentialité des données du Connecticut
UCPAUtah
Loi sur la confidentialité des consommateurs de l'Utah
ICDPAIowa
Loi sur la protection des données des consommateurs de l'Iowa
TDPSATexas
Loi sur la confidentialité et la sécurité des données au Texas
OCPAOregon
Loi sur la confidentialité des consommateurs de l'Oregon
MCDPAMontana
Loi sur la confidentialité des données des consommateurs au Montana
DPDPADelaware
Loi sur la confidentialité des données personnelles du Delaware
NJDPANew Jersey
Loi sur la protection des données du New Jersey
NHDPANew Hampshire
Loi sur la confidentialité des données du New Hampshire
PIPLChine
Loi sur la protection des informations personnelles
APPIJapon
Loi sur la protection des renseignements personnels
PIPACorée du Sud
Loi sur la protection des informations personnelles
Privacy ActNouvelle-Zélande
Loi sur la vie privée 2020
PDPOHong Kong
Ordonnance sur la protection de la confidentialité des données personnelles
PDPAMalaisie
Loi sur la protection des données personnelles
DPAPhilippines
Loi sur la confidentialité des données
PDPAIndonésie
Loi sur la protection des données personnelles
PDPAVietnam
Décret sur la protection des données personnelles
Privacy ActInde
Loi sur la protection numérique des données personnelles
Lei GeralArgentine
Loi sur la protection des données personnelles
LPDPColombie
Loi sur la protection des données personnelles
LPDPMexique
Loi fédérale sur la protection des données
GDPR-likeNorvège
Loi sur les données personnelles
DPAIsraël
Loi sur la protection de la vie privée
DPAKenya
Loi sur la protection des données
DPAMaroc
Loi sur la protection des données
DPATunisie
Loi sur la protection des données personnelles
PDPLÉmirats arabes unis
Loi sur la protection des données personnelles
DPAArabie saoudite
Loi sur la protection des données personnelles
Why Choose Secure Privacy
Secure Privacy vs DIY Vue Consent Logic
| Feature | Secure Privacy | Custom Vue Component |
|---|---|---|
| Setup time | 5 minutes | Hours to days |
| Automatic cookie scanning | ||
| 55+ privacy law templates | Manual research required | |
| Proof-of-consent logging | Custom build needed | |
| Google Consent Mode v2 | Automatic mapping | Manual implementation |
| IAB TCF support | Certified CMP | Not feasible |
| Geo-targeting rules | Built-in | Requires IP detection service |
| Multi-language banners | 70+ languages | Manual translations |
| SPA route persistence | Automatic | Must handle manually |
| Maintenance | Dashboard updates, no deploys | Code changes for every law update |
Vue.js Ecosystem
Works With Your Vue.js Stack
0+ native integrations and growing
Resources
Everything You Need for Vue.js
CMS & Framework Integrations
Compare installation across Vue, React, Angular, WordPress, and more.
Learn more
Customer Success
Trusted by Vue.js Teams
Frontend teams use Secure Privacy to add compliance to Vue and Nuxt apps without slowing down development.
4.9/5Average Rating
98%Customer Satisfaction
G2
“Cela m’a beaucoup aidé pour la conformité cookies !”
G2
“Les services de Secure Privacy fonctionnent très bien !”
G2
“Excellente application, intégration complète avec WordPress”
G2
“Excellent logiciel pour la politique de confidentialité des cookies”
G2
“Parfaitement conforme au GDPR”
G2
“Le meilleur logiciel de gestion de la confidentialité des données”
G2
“Cela m’a beaucoup aidé pour la conformité cookies !”
G2
“Les services de Secure Privacy fonctionnent très bien !”
G2
“Excellente application, intégration complète avec WordPress”
G2
“Excellent logiciel pour la politique de confidentialité des cookies”
G2
“Parfaitement conforme au GDPR”
G2
“Le meilleur logiciel de gestion de la confidentialité des données”
Capterra
“L’application ultime de conformité à la réglementation sur la confidentialité des données”
Capterra
“L’évaluation des risques alimentée par l’IA a identifié des lacunes de conformité dont nous ignorions l’existence.”
Capterra
“Suivi de conformité automatisé”
Capterra
“Excellent outil de protection des données”
Capterra
“Utile pour la conformité au GDPR”
Capterra
“Idéal pour gérer le consentement”
Capterra
“L’application ultime de conformité à la réglementation sur la confidentialité des données”
Capterra
“L’évaluation des risques alimentée par l’IA a identifié des lacunes de conformité dont nous ignorions l’existence.”
Capterra
“Suivi de conformité automatisé”
Capterra
“Excellent outil de protection des données”
Capterra
“Utile pour la conformité au GDPR”
Capterra
“Idéal pour gérer le consentement”
Frequently Asked Questions
Frequently Asked Questions
Paste the Secure Privacy script into the <head> of your public/index.html (Vite or Vue CLI) or add it to the head config in nuxt.config. The script loads before the Vue app mounts and persists across client-side navigations.
GET STARTED IN MINUTES
Add Cookie Consent to Your Vue.js App
One script tag in your HTML shell. Full compliance across every route. Start free—no credit card required.
30-day free trial
No credit card required
Cancel anytime