javascript - Google Analytics gtag 事件在页面重新加载之前触发，不适用于 iPhone

Question

我正在网站上使用 Google Analytics (gtag.js)，并且正在尝试发送事件。

我有一个“添加到购物车”按钮，一个简单的 <a class="ga-add-to-cart">Buy me!</a>元素。

单击此按钮后，我将触发 gtag('event' ... )方法:

$('.ga-add-to-cart').click(function(){

    productName = 'something';
    price = 123;

    gtag('event', 'add_to_cart', {
        'event_category': 'ecommerce',
        'event_label': productName,
        'value': price
    });
});

Google here 记录了这一点.

当然，因为我使用的是 <a>我的按钮的标签，单击后页面将重新加载。页面重新加载存在竞争条件，并且 gtag事件。

但在桌面浏览器中触发时工作正常 - 我可以在控制台中看到 HTTP 请求以及 Google Analytics 中的事件。

但是，在 iPhone、Safari 浏览器上时，不会触发该事件。通过桌面 Safari 检查手机时，我发现 HTTP 请求已取消。

我显然在这里做错了什么。

在页面(重新)加载之前触发此事件的最佳方法是什么？

Answer 1

尝试显式设置传输机制以使用信标发送。

修改您的代码以使用以下内容:

$('.ga-add-to-cart').click(function(){

    productName = 'something';
    price = 123;

    gtag('event', 'add_to_cart', {
        'transport_type': 'beacon', // Newly introduced code
        'event_category': 'ecommerce',
        'event_label': productName,
        'value': price
    });
});