This document describes the
Google client ID and various Google Analytics related cookies.
Sending client ID to Collect Tag and iFrame
Google client ID and various Google Analytics related cookies
When using GA’s Universal Analytics, both the analytics.js and the gtag.js library set cookies to identify and throttle requests:
_ga is used to distinguish users and has an expiration of 2-years.
_gid is used to distinguish users and has an expiration of 24-hours.
_gat is used to throttle requests and has an expiration of 10-minutes.
In all cases, the value format is:
Version.Depth.UniqueID.CreationTimeStamp
where:
Version = GA version
Depth = 2 for Top Level Domain, 3+ for Subs, etc.
UniqueID = Random Number
CreationTimeStamp = Epoch Time When Cookie Was Created
UniqueID + CreationTimeStamp is what is used to create client ID.
Capturing client ID
When capturing the client ID and sending back to GA, Google suggests to not use the cookie content to determine the client ID. https://developers.google.com/analytics/devguides/collection/analyticsjs/cookies-user-id:
You should not directly access the cookie analytics.js sets as the cookie format might change in the future. Instead, developers should use the readyCallback to wait until analytics.js is loaded, and then get the clientId value stored on the tracker.
In order to obtain the client ID, especially on the visitor's first page view, you can do the following which takes advantage of the readyCallback. In a JavaScript extension, scoped to your Google Analytics tag, add this code:
ga( function ( tracker ) {
// There can be different trackers on the page
// Also, reference the Google Analytics Object rather than the default 'ga'
var trackers = ( window [window.GoogleAnalyticsObject]).getAll() ;
var client_id, tracker_nm ;
trackers.forEach( function ( tracker ) {
if ( tracker ) {
client_id = tracker.get('clientId') ;
tracker_nm = tracker.get('name') + '.set' ;
ga( tracker_nm , 'dimension##', client_id) ;
}
}) ;
In the code, replace the 'XX' in dimensionXX with the number of the Custom Dimension to contain the client ID.
Send client ID to Collect Tag and iFrame
To send the client id to either the Tealium Collect tag or to an iframe for session syncing. Google's code takes some time to run, so depending on the tag the client id may not be available when the tag fires. To get around this, create an extension that runs a setInterval(), checks for the client ID, and fires a manual utag.view() call. Once available, client ID will be added to the data layer and will trigger a utag.view() directly to the tag that needs to fire. In the case of the iframe, it sends a postMessage() to the iframe where the iframe receives the message, pulls the client ID from the event data and then fires the necessary tags.
Step 1 - Cancel tag fire if client ID doesn't exist - iframe AND collect
Apply this extension code to any tag that needs the client ID and fires BEFORE it is available from Google
Extension: JS Code Scope: Specific Tags: Any tag(s) that needs the client_id
if (! utag . data . client_id ) { return false ; }
Step 2 - Set the interval to check for the client ID - iframe AND collect
This code checks for the client ID. When a client ID is captured it will either send a postMessage to the iframe (iframe only) or send a utag.view() to the collect tag or other tags that need the client ID (collect only)
Extension: JS Code Scope: DOM Ready Load Conditions: Exclude the iframe URL (iframe ONLY)
iframe version
Ensure that the reference to the frame window is updated and correct, otherwise, it will not work.
var captured = false ; var getClientId = setInterval ( checkPage , 500 ); function checkPage () { if ( captured === true ) { clearInterval ( getClientId ); } else { var tracker = ga . getAll ()[ 0 ]; var clientId = tracker . get ( 'clientId' ); if ( clientId ) { captured = true ; console . log ( '***************CLIENT ID CAPTURED******************' ); // Gets a reference to the window object of the destionation iframe. var frameWindow = document . getElementById ( 'reg_form' ). contentWindow ; // Sends the client ID to the window inside the destination frame. frameWindow . postMessage ( clientId , '*' ); } } }
collect version
The UID of the tag(s) that need to fire will need to be updated in the utag.view() below.
var captured = false ; var getClientId = setInterval ( checkPage , 500 ); function checkPage () { if ( captured === true ) { clearInterval ( getClientId ); } else { var tracker = ga . getAll ()[ 0 ]; var clientId = tracker . get ( 'clientId' ); if ( clientId ) { captured = true ; console . log ( '***************CLIENT ID CAPTURED******************' ); utag . data . client_id = clientId ; utag . view ( utag . data , null , [*/insert Tag UID #*/ ]); } } }
Step 3 - Retrieve the client_id in the iframe - iframe only
The iframe needs to retrieve the message from the parent window, grab the client_id and then send a view event to whatever tag needs the client_id (usually Google Analytics). The tag UID(s) in the utag.view() will need to be updated with the applicable tag(s) that need to fire from the iframe.
Extension: JS Code Scope: Preloader
//Restrict the code to run only for the iframe if ( window . location . href . indexOf ( 'go.hornblower.com' ) > - 1 ) { window . addEventListener ( 'message' , function ( event ) { var url = ( window . location != window . referrer ) ? document . referrer : document . location . href ; var parentDomain = url . split ( '/' )[ 2 ]; // Ignores messages from untrusted domains. if ( event . origin . indexOf ( parentDomain ) < 0 ) return ; utag . data . client_id = event . data ; utag_data . client_id = event . data ; utag . view ( utag . data , null , [ */insert UID #*/ ]); }); }
Step 4 - Testing - iframe and collect
You should be able to set a breakpoint on the this.track() "view" event. If it is working correctly, a view event will be fired with the client_id in the payload. You should also be able to check the utag.data object to ensure that client_id has been added and populated.
... View more