确保在转到下一页之前发送了Google Analytics事件

Posted 2021-05-04

在非SinglePageApp中，当您单击到另一个页面的锚链接时，javascript将取消并且将加载新页面。

当我尝试对附加到这些锚标记的谷歌分析进行异步调用时，这是一个问题。

例如，如果我有一个继续链接，并且我希望在点击它时触发ga事件，如果我天真地添加事件，它将排队异步加载，但有时不会被调用，因为浏览器将取消javascript并转到处理ga'继续点击'事件之前的下一页。

我注意到GA有这个名为'hitCallback'的属性，我尝试使用它，但似乎我还没有得到继续事件来处理。我这样做是因为试图遵循GA的指导方针：https://developers.google.com/analytics/devguides/collection/analyticsjs/sending-hits#handling_timeouts

$('a.js-ga-track-event').click(function(e) { // jquery attaching to a element
    e.preventDefault();
    var href = this.href;
    var linkClicked = false;

    var clickLink = function() {
        if (href && !linkClicked) {
            linkClicked = true;
            window.location.href = href;
        }
    };

    // As a backup, will submit the form if GA does not succeed within 0.5 seconds
    setTimeout(clickLink, 500);

    var name = 'continue clicked';
    var label = '';
    ga('send', {
        'hitType': 'event',
        'eventCategory': 'EXAMPLE CATEGORY',
        'eventAction': 'continue clicked',
        'eventLabel': label,
        'hitCallback': clickLink
    });
});

该链接肯定不会捕获所有事件命中。难道我做错了什么？

答案

hitCallBack确实是你想要使用的。整体代码逻辑看起来不错，但是，我看到：

• GA函数名称是大写的（GA而不是ga应该是）
• send调用的语法与doc example不同

相反，你为什么不尝试这个：

ga('send', 'event', 'EXAMPLE CATEGORY', 'continue clicked', label, {
    hitCallback: clickLink
});

另一答案

将传输字段设置为“beacon”。很简单。