CODEWITHSUNDEEP
javascriptgoogle-analyticsgoogle-talk
Leos Literak
Leos Literak

Reputation: 9474

No analytics cookies is set upon a consent was updated

I am using the Google Tag Manager with a single tag referencing a default Google Analytics script. My solution is based on the information from these resources:

The code is simple (commit):

index.html: define gtag() and set denied as a default for all storages

  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag() { window.dataLayer.push(arguments); }
    gtag('consent', 'default', {
      ad_storage: 'denied',
      analytics_storage: 'denied',
      personalization_storage: 'denied',
      functionality_storage: 'granted',
      security_storage: 'granted',
      wait_for_update: 400,
    });

Then load a user configuration from the localStorage and call update:

handleCookies(preferences) {
  console.log('handleCookies callback');
  gtag('consent', 'update', {
    ad_storage: preferences.ad,
    analytics_storage: preferences.analytics,
    personalization_storage: preferences.personalization,
  });
  console.log(window.dataLayer);
},

So far so good because I see the event queue is updated in dataLayer:

chrome console

As the consent is set I anticipate the the cookies will be set for the Google Analytics now. But they are missing. What stupid mistake have I done?

cookies box

GTM configuration

Upvotes: 12

Views: 6811

Answers (3)

Leos Literak
Leos Literak

Reputation: 9474

As a note for my silly future myself I will write some findings and notes there.

  1. follow Simo's advices though it might not be easy to understand without a prior subject orientation
  2. define gtag() function and set the default settings prior gtag initialization
  3. the first visit shall set denied for ad_storage, analytics_storage and personalization_storage
  4. if it is a returning visit it is a good idea to set the defaults according to a user's content
  5. but hey, you can send the update message later, even in a Vue component's mounted method. A value in wait_for_update might be useful there because you want to initialize Google Analytics with cookies rather then without them.
  6. Google Analytics sends https://www.google-analytics.com/g/collect request. Take a look to payload, gcs: G100 is sent when the cookies consent is missing.
  7. Once a user accepts the cookies, send new consent values in the update message. The values are denied / granted, not true / false, you fool!
  8. The GA cookies are created at this moment. But they are not sent to server, sorry, your turn is over. Well, if a user does some tracked action like a scrolling a page, the collect will be sent again with gcs: G111. I am bit surprised that neither the request not the response holds any cookie. Why?
  9. Once I reload the page and all storages are granted by default, gcs: G111 is still present in GA's collect but the page's existing cookies are not present in the request. Why?

enter image description here

Upvotes: 3

Simo Ahava
Simo Ahava

Reputation: 1446

Your update command happens after the GTM container snippet is rendered by the browser, so the update command is processed only after the All Pages trigger has already been processed.

You need to either delay your tags to fire on a later trigger (e.g. DOM Ready) or change how your script works to push the 'update' command sooner.

Alternatively, you can use the Consent Mode tag template found in the template gallery to orchestrate everything through GTM. The template uses GTM's synchronous consent APIs which ensure that the consent state is applied immediately rather than only once the dataLayer queue is processed.

Upvotes: 6

Michele Pisani
Michele Pisani

Reputation: 14189

From your screenshot, gtm.js is executed before the update of the consent mode so the pageview continues to be sent to Google Analytics as denied.

The update must take place before gtm.js

Upvotes: 5

Related Questions