feat: Add default values for Consent Mode v2

pperzyna commented 8 months ago

🔗 Linked issue

❓ Type of change

[ ] 📖 Documentation (updates to the documentation, readme or JSDoc annotations)
[ ] 🐞 Bug fix (a non-breaking change that fixes an issue)
[ ] 👌 Enhancement (improving an existing functionality like performance)
[x] ✨ New feature (a non-breaking change that adds functionality)
[ ] 🧹 Chore (updates to the build process or auxiliary tools and libraries)
[ ] ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

This change adds the missing default values for consent mode v2 See more: https://developers.google.com/tag-platform/security/guides/consent?consentmode=basic

📝 Checklist

[x] I have linked an issue or discussion.
[ ] I have updated the documentation accordingly.

netlify[bot] commented 8 months ago

Deploy Preview for nuxt-gtag ready!

Name	Link
Latest commit	11c3c2f7e253a853b223e7300cb14f16df0dd0d5
Latest deploy log	https://app.netlify.com/sites/nuxt-gtag/deploys/65dc4a0d16669a00083029ac
Deploy Preview	https://deploy-preview-49--nuxt-gtag.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

johannschopplich commented 8 months ago

Hey there, thanks for the PR! But this is a breaking change for all others who haven't or don't want to configure the consent option.

What setting the consent option depending on initialConsent option?

datalogics-ryanp commented 8 months ago

Hoping you can get this integrated to this plugin :) Google is pretty much forcing the company I develop for to get consent mode setup on our site if we want to collect data from the EEA. Struggling to find a nuxt compatible plugin that actually wants to play well with it.

johannschopplich commented 8 months ago

I see, but as said earlier, we would need a more generic approach than just adding these default values. Not all users want to use them. Having said that, thanks for the PR!

I have implemented your feature request into the v2 of this library:

[!TIP] Follows the Google consent mode v2 specification.

Set a default value for each consent type you are using. By default, no consent mode values are set.

The following example sets multiple consent mode parameters to denied by default:

// `nuxt.config.ts`
export default defineNuxtConfig({
  modules: ['nuxt-gtag'],

  gtag: {
    id: 'G-XXXXXXXXXX',
    initCommands: [
      // Setup up consent mode
      ['consent', 'default', {
        ad_user_data: 'denied',
        ad_personalization: 'denied',
        ad_storage: 'denied',
        analytics_storage: 'denied',
        wait_for_update: 500,
      }]
    ]
  }
})

After a user indicates their consent choices, update relevant parameters to granted:

function allConsentGranted() {
  const { gtag } = useGtag()
  gtag('consent', 'update', {
    ad_user_data: 'granted',
    ad_personalization: 'granted',
    ad_storage: 'granted',
    analytics_storage: 'granted'
  })
}

function consentGrantedAdStorage() {
  const { gtag } = useGtag()
  gtag('consent', 'update', {
    ad_storage: 'granted'
  })
}

// Invoke the consent function when a user interacts with your banner
consentGrantedAdStorage() // Or `allConsentGranted()`

johannschopplich / nuxt-gtag