使用 angular.js 和 google 分析跟踪 href 点击

Question

我有一个网络应用程序可以让用户下载文件。我动态生成一个 href="xx" 链接。

我已经看过这篇解释如何使用 Angular 跟踪路线的文章：http://www.arnaldocapo.com/blog/post/google-analytics-and-angularjs-with-ui-router/72

我怎样才能同时跟踪用户下载的每个文件？

Answer 1

我不熟悉 Google 分析如何工作的细节，但您可以通过本质上创建您自己的中间人攻击（没有任何恶意内容）来跟踪用户下载（或任何其他操作） ).

只需将 ng-click 添加到下载 link 即可启动承诺，该承诺会在某处记录该项目已下载

<a href="..." ng-click="log()">Click here to download!</div>

$scope.log = function(){
    //$http post or whatever you want
    //Then resume normal click functionality
}

Answer 2

您想为此使用 ng-click。我还会使用 GA 的事件跟踪来跟踪这个指标。这是一个例子：

<a href="#" ng-click="logDownload()">Download</a>

$scope.logDownload = function () {
    $window.ga('send', 'event', 'Download', 'File Name'); //This would log a GA Event
    $location.path('your path to download the file'); //use this if you are linking to an angular route
};

利用注入 $window 和 $location 到你的控制器。使用 $window 让您的代码可测试。

Answer 3

最后我就是这样解决的，感谢 newg 和 David Grinberg。

我没有使用 $location.path() 解决方案，因为我希望 link 在目标='_blank'[=12 的新 window 中打开=]

html

<a href='{{ item.url }}' target='_blank' ng-click='trackDownload(item)'>
  {{ item.name}}
</a>

控制器

$scope.trackDownload = function(item) {
  if (!$window.ga) return;
  $window.ga('send', 'event', 'download', item.full);
};

使用 angular.js 和 google 分析跟踪 href 点击

tracking href click with angular.js and google analytics

javascript

google-analytics

angularjs

angular-ui-router