CODEWITHSUNDEEP
google-analyticsgoogle-analytics-apiclientid
Aysenur Erkan
Aysenur Erkan

Reputation: 11

Getting client ID from GA4 to hidden fields within forms

I want to extract client_id for a visit from google analytics and send it to hidden fields within the application forms. I know in Universal Analytics, we can extract it from ga cookie. But how about Google Analytics 4? Do I need to extract it from GA4 API?

Upvotes: 1

Views: 5536

Answers (4)

justaguy
justaguy

Reputation: 187

Found this great article trying to do the same: https://www.analyticsmania.com/post/google-analytics-client-id/#find which shows how to use the GTAG to extract different fields: https://developers.google.com/tag-platform/gtagjs/reference#get

regarding the extraction of the client id from GA4, you can do it with the following code:

gtag('get', 'G-XXXXXX', 'client_id', function(clientId) {console.log(clientId)})

In case you are using google tag manger to implement GA4, you will also need to add the following code to support getting the client_id (from the docs, it looks like it should work on UA also):

  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}

Upvotes: 0

Darsh Shukla
Darsh Shukla

Reputation: 389

Assuming and considering you have access to the Web Page where the application form is.

In the below HTML code, the javascript function getCookie returns the cookie value for the given cookie name.

main functions fill the hidden input field based on the name i.e _ga here.

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Getting client ID from GA4 to hidden fields within forms</title>
    <script>
        function getCookie(name) {
            const value = `; ${document.cookie}`;
            const parts = value.split(`; ${name}=`);
            if (parts.length === 2) return parts.pop().split(';').shift();
        }
        function main() {
            var hiddenFields = document.querySelectorAll("input[type=hidden], input[type=text]");
            for (var i = 0; i < hiddenFields.length; i++) {
                var param = getCookie(hiddenFields[i].name);
                if (param) document.getElementsByName(hiddenFields[i].name)[0].value = param;
            }
        }
        setTimeout(function () { main() }, 3000);
    </script>
</head>

<body>
    <form>
        <input type="hidden" name="_ga">
    </form>
</body>

</html>

Upvotes: 0

WouterNieuwerth
WouterNieuwerth

Reputation: 31

If I may add: GA4 does use the same cookie as UA, but the most upvoted method to extract the client ID from the link mentioned by @BNazaruk will not work for GA4.

The method ga.getAll()[0].get('clientId'); relies on the UA tracker and will not work when only GA4 is available on the page.

Of course you can still read it from the _ga cookie as other answers suggest.

Upvotes: 2

BNazaruk
BNazaruk

Reputation: 8136

GA4 uses the same cookie for client id as GA3. The same old answers apply very well to GA4: how to get the Google analytics client ID

Not marking this as duplicate because the old question does reference GA4, but I will try and edit the old question and answer to include GA4 there.

Upvotes: 1

Related Questions