Send events to UA/GA4 via Measurement protocol and Fetch API

Measurement protocol is not that clear in the minds of many people. I got a lot of questions about this topic and now it’s time to clarify it!

What is measurement protocol?

Basically, it is an endpoint to let us send hits to our GA properties. A lot of marketers use Google Tag Manager (ideal way) to send events to GA properties. When you send events to your GA property via GTM, it puts the event in a certain form and sends to:

“google-analytics.com/collect” (UA)
“region1.analytics.google.com/collect” (GA4)

Or sometimes you can also see some paths before ‘collect’ like ‘g’, ‘r’, ‘batch’, ‘j”, and “mp”.

“g” or “r“: means you are sending single event or raw event.
“batch” or “j”: means you are sending multiple events in a single payload to reduce HTTP requests.
“mp”: means you are sending data for GA4F.

If you are a Google Chrome user, you can easily see what GTM has sent to GA via measurement protocol on devtools/network section.

Here are the steps:

Visit one of the websites which sends “hits” to GA.
Right click to anywhere on the page and select “inspect”.
Select “network” section on the top.
Search for “collect”.
Then you will see what has been sent to Google Analytics.

If you click one of the requests, you can easily see all the data that has been sent to GA. For example here is a pageview hit below.

But we are not living in a perfect world… Sometimes, we need to send hits to GA with measurement protocol. Here is why:

You may request extra events from your 3rd-party partners to send events to your GA property.
You may not be able to implement GTM or gtag.js on iframes/external sources where you want to receive events.
You may just want to test or debug your Analytics view to validate filters etc.

Whatever the reason, it is clear that sometimes we need to use this method. Let’s go straight to how we can use it without talking too much.

Send hits to measurement protocol via JavaScript

Actually, you don’t have to use Javascript. You can make “GET” or “POST” requests with almost all languages to endpoints but I will use JS for this article. You can use both of them to send hits to UA / GA4. For small-size requests you can use “GET” method but if you want to send larger payload, it is recommended to use the “POST” method.

Let’s say we want to send an event in JSON type with “POST” method first

Open the console on Chrome developer tools
Edit and use below code:

let eventData = {
    "client_id": "1234.1234",
    "events": [
      {
        "name": "offline_purchase",
        "params": {
          "engagement_time_msec": "100",
          "session_id": "123"
        }
      }
    ]
}

const endpoint_url = 'https://www.google-analytics.com/mp/collect?measurement_id=YOUR_GA4_ID&api_secret=YOUR_GA4_SECRETKEY'

fetch(endpoint_url,{
    header:{
        "Content-Type": "application/json",
    },
    method: "POST",
    body:JSON.stringify(eventData)
}

You need two things to send events to your GA4 property with “POST” method. (If you want to add more information about the event, add them under the “params” object then they will be visible on GA4.)

Analaytics ID
API Secret key (if you don’t know how to create it please click here)
Client ID (if you don’t define the client_id, Google Analytics’ server will reject it)

As a result, the example ‘offline_purchase’ event appeared on our real time report.

What if you want to send hits via “GET” method?

First of all, I recommend you to get familiar with GA4 measurement protocol parameters. (Since “Google for Developers” does not provide a list of the parameters, you can use this table that I already created for you.)

If you decide to use “GET” method, using the below script would be enough for you. So, no need to write lines of code!

fetch('https://www.google-analytics.com/collect?v=2&cid=1234.1234&tid=YOUR_GA4_ID&t=event&en=offline_purchase_get')

Please be aware that you have to pass ‘v’ (version) , ‘tid’ (tracking id), ‘t’ (hit type) and ‘cid’ (client id) parameters. They all are mandatory. If you want to add any extra information you can choose from the table above.

And here is the proof :

What if you want to send events to UA?

UA measurement protocol parameters different than GA4’s parameters. So, the table above will not work with Universal Analytics even they would have common parameters. Please use the link below to access Universal Analytics’ parameters.

https://developers.google.com/analytics/devguides/collection/protocol/v1/parameters?hl=en

In short, you need to change some parameters in the code I gave above to make it possible.

Use ‘ec’ (event category) and ‘ea’ (event action) parameters instead of ‘en’ parameter.
Use ‘v=1’ parameter value instead of ‘v=2’

Example :

fetch('https://www.google-analytics.com/collect?v=1&cid=1234.1234&tid=YOUR_UA_ID&t=event&ec=purchase&ea=offline')

Lastly, I want to share “Measurement Protocol Hit Builder” tool with you send hits to your Google Analytics property without needing code : https://ga-dev-tools.google/hit-builder/

I’m sure if you spend some time on this tool you will understand the concept better.

That’s all! If you have any questions feel free to write in the comments.