来自 file:// url 的 Google Analytics答案

【问题标题】：Google Analytics from a file:// url来自 file:// url 的 Google Analytics
【发布时间】：2011-04-05 05:53:48
【问题描述】：

我们有一个 ajaxy 类型的基于 html 的应用程序框架，并希望谷歌分析能够使用它。而且我相信我们已经正确设置，可以在需要的地方手动调用_trackPageview。

然而，事情似乎没有得到报道。现在要么我没有让它正常工作，要么在 url 上使用 file:// 协议从 javascript 进行 GA 跟踪默默地违反了一些我不知道的跨域策略。

那么 GA 是否可以通过 file:// 处理本地 html？还是我的 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']);

【问题讨论】：

我看不到任何信息暗示 script 标签在 file:// 资源上的工作方式不同。（在其他地方检查了here）但也许 GA 阻止了这个？
好吧，在我的情况下，这主要是 webkit 驱动的浏览器。
您是否在控制台中收到错误消息？
没有任何输出。但我可以看出_gaq 是一个看起来由谷歌分析加载的具有大量功能的对象。包括push()
你看过GA的domain & directory settings了吗？

标签： javascript google-analytics cross-domain

【解决方案1】：

Google now supports disabling the protocol check 任务通过将其设置为 null，允许您从 file:// url 跟踪分析：

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');

【讨论】：

有什么快速的方法来确认这在谷歌分析 UI 中是否有效？
今天使用 gtag 的方法是什么？

【解决方案2】：

这是我的代码，它可以工作

<script>
function sendData()
{
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-148029185-2');

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

ga('set', 'page', '/xxxxxxxx');
ga('send', 'pageview');
}
</script>

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-148029185-2" onload="sendData()"></script>

【讨论】：

您是否找到跳过使用 gtag 检查新 GA4 属性的协议的方法？使用新的 GA4 及其新属性 G-xxxxxxx 似乎是不可能的。 GA4 不使用 analytics.js 和 ga()，而只使用 gtag.js + gtag()。这里 google-analytics.com/analytics.js 是 checkProtocolTask 但这里 googletagmanager.com/gtag/js 不是。

【解决方案3】：

需要进行一些调整：

禁用 cookie 存储

无法使用 Cookie，因为没有域在起作用，因此我们需要阻止 GA 尝试使用它们。这是通过在创建配置 (documentation) 中设置 'storage': 'none' 来完成的。

禁用文件协议检查

默认情况下，如果协议（在我们的例子中为 file）不是 http 或 https，则 GA 中止。使用相应的task 禁用此检查：ga('set', 'checkProtocolTask', null)

手动设置活动页面

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

随后的ga('send', 'pageview') 将在数据中显示为对/foobar 的访问。

使用 localStorage 跟踪用户身份（可选）

禁用 cookie 后，用户不会在页面加载时被跟踪，因此每次刷新都会触发对另一个唯一访问者的检测。但是，我们可以通过设置 'clientId': localStorage.getItem(someKey) 在创建时提供自定义 client ids，它会查找以前存储的客户端 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');

【讨论】：

gtag 可以做到吗？
@Naruto26 你有没有找到方法来跳过使用 gtag 检查它的协议？使用新的 GA4 及其新属性 G-xxxxxxx 似乎是不可能的。 GA4 不使用 analytics.js 和 ga()，而只使用 gtag.js + gtag()。

【解决方案4】：

最终通过 resize hack 消息传递机制通过 iframe 进行复杂的反弹。

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

尽管我讨厌这种 hack，但它可以完美运行！

【讨论】：

无法让它工作。 Google Analytics 需要 cookie，即使您通过带有 http 协议的 iframe 加载页面，GA 仍然必须在某处设置 cookie。它唯一能做到的地方是你的机器上，它不能这样做，因为页面最终仍然在 file:// 上。
@ehynds 不正确。当 file:// url 有一个指向 http://someotherserver.com/analytics.html 的 iframe 时，该服务器可以为该域设置 cookie。 file:// url 无法直接读取这些 cookie，但在该 iframe 中运行的 JS 可以。 file:// url JS 可以向该 iframe 发送消息，这就是它的工作原理。尽管如此，这个解决方案仍然很糟糕。
正确 - 但 ga.js 设置 cookie，而不是服务器。当调用 __utm.gif 时，ga.js 会读回 cookie 并将它们传递到 utmcc 参数中。使用您的方法，我看到对 __utm.gif 文件的请求正在通过，但 utmcc 参数是空白的，根据 Google，这是一个 required field。

【解决方案5】：

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

根据Google Analytics Help Center，

访问者必须在其浏览器中启用 JavaScript、图像和 Cookie，Google Analytics（分析）才能报告他们的访问。

这是我的理论：在我对 Mac OS X Snow Leopard 的测试中，从 file:// 运行的文档无法设置 cookie。这是因为 cookie 是 HTTP 专有的，当您从 file:// 运行某些内容时，您并没有使用 HTTP 协议。

由于您无法设置 cookie，ga.js 拒绝将 _utm.gif 请求发送到 Google 的服务器。没有设置 cookie；没有向 google 发送请求，因此 GA 中没有任何记录。

解决方案：使用可以将域设置为 http://localhost 的开发环境（如果您使用的是 Mac 并且需要 LAMP 堆栈，则类似于 MAMP）

（奇怪的脚注：我观察到一些奇怪的行为，其中 GA cookie 将设置为来自第三方非 CDN 域的不相关导入脚本的域的 第三方 cookie。这可能是因为由于服务器会随文件发送 HTTP cookie，所以 ga.js 会将自己附加到该域。但是，这不会作为后门，因为它仍然不会将 _utm.gif 命中发送到 Google 的服务器）。

========

编辑：

您可以尝试人们为无 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');

它专为书签/注入脚本跟踪而设计，但如果我输入 file:// 类型设置，它能够成功发送 __utm.gif 命中，这意味着它应该在 GA 中成功跟踪。

缺点是无 cookie 意味着它无法准确跟踪访问，只能跟踪页面查看级别的数据。

【讨论】：

我明白了。显然，为file:// 设置的 cookie 会很奇怪，因为没有域。但在我的情况下，运行本地服务器不会真正起作用。我想我不能通过 JS 使用它，dang。
Visitors must have JavaScript, images, and cookies enabled in their browsers in order for Analytics to report their visit. 是的，我同意 Google 告诉每个人添加到他们的页面的 JavaScript 脚本，至少需要浏览器中的 JavaScript 支持。