代码之家 › 专栏 › 技术社区 › Alex Wayne

谷歌分析从一个文件:://url

cross-domain google-analytics javascript

Alex Wayne · 技术社区 · 14 年前

我们有一个基于HTML的应用程序框架的半成品,希望谷歌分析能与之合作。我相信我们已经设置好了手动呼叫 _trackPageview 在需要的地方。

但是事情似乎没有被报道。现在要么我没有让它正常工作,要么用一个 file:// URL上的协议悄悄地违反了一些我不知道的跨域策略。

那么GA是否可以通过 文件:/ / ?或者我的GA使用有问题吗?

请注意,我们使用的域实际上不存在。我们想用 mobile app tracking 但是来自javascript而不是本地库。为了做到这一点,它会让你设置一个假域名,并告诉跟踪器它应该报告哪个域名。

在我的结尾 <head> :

<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXACCOUNTID-XX']);
  _gaq.push(['_setDomainName', 'myfake.domain.com']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = 'http://www.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>

在我们的JS框架中,我们称之为:

_gaq.push(['_trackPageview', '/some/path/here']);

5 回复 | 直到 7 年前

barryels Jim Geurts 8 年前

Google now supports disabling the protocol check 通过将其设置为空,允许您从 file:// 网址:

ga('create', 'UA-XXXXX-Y', 'auto');
ga('set', 'checkProtocolTask', null); // Disable file protocol checking.
ga('set', 'checkStorageTask', null); // Disable cookie storage checking.
ga('set', 'historyImportTask', null); // Disable history checking (requires reading from cookies).
ga('send', 'pageview');

Yahel 14 年前

好吧,我想我已经解决了这个问题。这几天一直困扰着我。

根据 Google Analytics Help Center ,

访问者必须在浏览器中启用javascript、图像和cookie,以便分析报告其访问情况。

我的理论是:在我对MacOSXSnowLeopard的测试中,文件:/中运行的文档无法设置cookie。这是因为cookies是HTTP专有的,当您从file://运行某些内容时,您没有使用HTTP协议。

由于你无法设置cookie,GA.JS拒绝将tm.gif请求发送到谷歌的服务器。没有设置cookie;没有向Google发送请求,所以GA中没有任何记录。

解决方案:使用一个可以将域设置为 http://localhost (就像妈妈一样,如果你在Mac电脑上,需要一个灯罩)

(奇怪的脚注:我观察到一些奇怪的行为,GA cookies将设置为 第三方 来自第三方非cdn域的无关导入脚本的域的cookie。这可能是因为服务器随文件发送HTTP cookie,GA.JS将自身附加到该域。但是,这不会成为后门,因为它仍然不会将tm.gif点击发送到谷歌的服务器)。

不受欢迎的=

编辑:

您可以尝试人们为无cookie的GA跟踪创建的各种解决方案之一。

您可能会从这个工具中获得一些成功: http://code.google.com/p/google-analytics-js/downloads/list ,解释如下: http://remysharp.com/2009/02/27/analytics-for-bookmarklets-injected-scripts/

不是所有的GA代码,而是包含脚本,然后使用以下代码调用它:

gaTrack('UA-XXXACCOUNTID-XX', 'myfake.domain.com', '/some/path/here');

它是为bookmarklet/injected脚本跟踪而设计的,但是如果我放入一个文件:/,它就能够成功地发送utm.gif命中,这意味着它应该在GA中成功地跟踪。

缺点是不需要烹饪意味着它不能准确地跟踪访问,只需要页面视图级别的数据。

Alex Wayne 14 年前

最后通过一个iframe通过resize hack消息传递机制进行了复杂的跳转。

本地文件在我们的服务器上包含一个iframe。当我们想跟踪一个GA调用时,我们用需要的信息更改它的URL哈希 #_trackEvent,foo,bar ,然后更改iframe的宽度。在iframe中 onresize() 函数被触发,允许我们通过检查哈希来提交GA调用。

尽管我很讨厌这个黑客,但它工作得很完美!

Cedric Reichenbach 7 年前

需要进行一些调整:

禁用cookie存储

不能使用cookies,因为没有域在运行,所以我们需要阻止GA尝试使用它们。这是通过设置 'storage': 'none' 在创建配置中( documentation )

禁用文件协议检查

默认情况下,如果协议 file 不是 http 或 https . 使用相应的 task : ga('set', 'checkProtocolTask', null)

手动设置活动页

由于没有域,GA无法导出表示活动页的路径。可以使用手动配置 page URL modification feature : ga('set', 'page', 'foobar')

后来的 ga('send', 'pageview') 然后作为访问显示在数据中 /foobar .

使用localstorage跟踪用户标识(可选)

禁用cookie后,不会在页面加载过程中跟踪用户,因此每次刷新都会触发对另一个唯一访问者的检测。但是,我们可以提供定制 client ids 通过设置创建时 'clientId': localStorage.getItem(someKey) ,它查找以前存储的客户机ID。

存储ID由

ga(function(tracker) {
  localStorage.setItem(someKey, tracker.get('clientId'));
})

一切都结合在一起

结合以上所有步骤,我们最终得到如下结果:

(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXXXXX-Y', {
    'storage': 'none',
    'clientId': localStorage.getItem('ga:clientId')
});
ga(function(tracker) {
    localStorage.setItem('ga:clientId', tracker.get('clientId'));
});
ga('set', 'checkProtocolTask', null);

ga('set', 'page', 'myPage');
ga('send', 'pageview');

clonyx 13 年前

您可以使用onHashChange JS事件来代替调整iframe的大小。

唯一的缺点是这种方法在IE8+上有效。(没有IE6,IE7)。它适用于其他浏览器,包括iOS和Android。