Angular.js和Google Analytics内容实验

时间:2013-11-20 11:37:11

标签: javascript angularjs google-analytics single-page-application google-experiments

所以我正在尝试在一个有角度的单页网站的网站上实施谷歌分析内容实验。

我设置了两个版本的主页,//?v=2,按照指示粘贴在Google代码中,位于<head>标记的最顶部,它只是工作了很好,谷歌将30%的流量发送到第二版本的流量的一个和70%的流量。

当我尝试访问说/contact时出现了问题,谷歌显然认为我仍在访问/并将我发送给/v=2(如果我是30%即是。

我甚至不确定为什么会这样,但是确实如此,我想如果google的函数在加载后不能正常运行,但只有在主页的controller加载之后才会有所帮助。但我可以让谷歌代码在上述控制器中运行..

之前有没有人处理过这个问题?

2 个答案:

答案 0 :(得分:13)

您可以使用API​​代替https://developers.google.com/analytics/devguides/collection/gajs/experiments#cxjs

然后你所要做的就是在你的路线/州定义中做这样的事情

{
   templateUrl: function() {
      if(cxApi.chooseVariation() == 0) {
         return "version1.html";
      } else {
         return "version2.html";
      }

   }
}

答案 1 :(得分:3)

使用AngularJS,您将在Angular代码中选择并提供变体。 Google只会调用此浏览器实现。因此,您不要使用Google Analytics网络界面提供的标准实验代码段。相反,您将使用Content Experiment JavaScript API。所以你要加载的脚本是:

<script src="//www.google-analytics.com/cx/api.js?experiment=EXPERIMENT_ID"></script>

如果您使用的是ui-router:

正如foxx已经写过的那样,每次用户暴露于您想要运行测试的cxApi.chooseVariation() 时,您只需通过调用$state来确定变体。您可以在$stateProvider.state()调用中选择不同的模板(如foxx所示),也可以简单地解析变体编号并将其注入控制器,以便在模板中使用变体类:ng-class="{original: isVariation(0), variation-one: isVariation(1)}"

Google提供了很棒的guide to implement experiments on the client-side