Search code examples
google-tag-manager

Google Tag Manager - How to collect immediately?

In my web page there is the following measurement

const data = {
    event: "FreeTrial-RegistrationLoginDone",
    eventContext: "additional info"     
};
window.dataLayer.push(data);

The issue is, I need to redirect from this page right after this measurement and there is a several second delay between pushing into window.dataLayer and automatic calling the API endpoint /collect. The web page cannot wait this long. Is there an option to prompt GTM to call /collect immediately?

Solution

  • Quick answer: yes, you can do it. You can tell analytics.js library to send the request "syncly", right when it's called. This is achieved by setting the field called transport to the value beacon in your GTM tag. You can find more on it here: https://www.simoahava.com/analytics/fire-trigger-when-user-about-to-leave-page/

    enter image description here

    Normally this happens on success, right before the redirection to the thank you page. What we normally do here is ask the developers to move this push to the next page and make sure it doesn't fire on reloads or direct hits to the thankyou page.

    Also, GA4 introduces certain batching logic where it delays the calls to try to consolidate multiple events in one network request. This delaying logic, however, should use the onbeforeunload or a similar callback to make sure they still send the request even if the page is navigated from. I would suggest first debugging this screen transition and checking your Network tab to make sure that the collect request is indeed being lost on redirect.