Google Analytics 事件跟踪 - 不适用于下载链接答案

【问题标题】：Google Analytics Event Tracking - Not working for a download linkGoogle Analytics 事件跟踪 - 不适用于下载链接
【发布时间】：2018-07-11 21:01:29
【问题描述】：

我刚刚完成了 Sketch 插件的开发，并创建了一个简单的登录页面供用户下载插件。我想使用 Google Analytics 事件跟踪来跟踪下载，但事件跟踪不起作用，我似乎无法弄清楚原因。

链接如下：

<a href="downloads/colorspark.zip" download onClick="ga('send', 'event', 'Downloads', 'download', 'ColorSpark for Sketch');">Download</a>

有人看到我做错了吗？除了 onclick 属性，我还需要在其他任何地方添加任何其他代码吗？

【问题讨论】：

标签： google-analytics download event-tracking

【解决方案1】：

我敢打赌，您将面临我们所说的race condition：用户单击链接的那一刻，浏览器就会启动页面更改，因此 GA 在有机会发送事件之前就被中断了。

2 个选项

在新标签页中打开链接：将target="_blank" 添加到您的链接中，以便它们在新标签页中打开并且不会中断当前标签页中的 GA。
Prevent Default + Hitcallback：可以使用onClick的自定义函数，默认阻止链接打开（return false;），触发GA事件，使用GA的hitCallback触发页面以编程方式更改。

对于选项 2，有不同的方法（因为它是自定义代码）。这是谷歌的一个例子： https://support.google.com/analytics/answer/1136920?hl=en

<script>
/**
* Function that tracks a click on an outbound link in Analytics.
* This function takes a valid URL string as an argument, and uses that URL string
* as the event label. Setting the transport method to 'beacon' lets the hit be sent
* using 'navigator.sendBeacon' in browser that support it.
*/
var trackOutboundLink = function(url) {
   ga('send', 'event', 'outbound', 'click', url, {
     'transport': 'beacon',
     'hitCallback': function(){document.location = url;}
   });
}
</script>
You'll also need to add (or modify) the onclick attribute to your links. Use this example as a model for your own links:

<a href="http://www.example.com" onclick="trackOutboundLink('http://www.example.com'); return false;">Check out example.com</a>

【讨论】：