【问题标题】:Analytics Events Tracking for a Chrome ExtensionChrome 扩展的分析事件跟踪
【发布时间】:2015-02-20 06:30:15
【问题描述】:

我正在尝试在 chrome 扩展中添加谷歌分析事件跟踪,但它似乎没有正确地将事件发送到服务器。我正在从内容脚本向后台脚本发送一条消息消息,让它知道跟踪事件,并使用 _gaq.push() 尝试将事件发送到服务器。我将包括我在这里得到的东西,并希望能得到一些帮助,因为我可以找到错误/缺失的地方

这是我的清单文件,我已将谷歌分析添加到 content_security_policy

{
    "name": "XXXXXX",
    "short_name": "XXXXXX",
    "version": "0.4.2",
    "description": "XXXXXX",
    "icons": { "128": "icon_128.png", "48": "icon_48.png" },
    "permissions": ["storage"],
    "content_security_policy" : "script-src 'self' https://ssl.google-analytics.com; object-src 'self'",
    "content_scripts": [
        {
            "matches": [
                "XXXXXX",
                "XXXXXX"
            ],
            "js": ["jquery.js","jquery.ba-hashchange.min.js","contentscript.js"],
            "run_at": "document_end"
        }
    ],
    "background" : {
        "scripts" : ["background.js"],
        "persistent" : false
    },
    "manifest_version": 2
}

这是我的内容脚本中的调用,让后台脚本知道使用谷歌分析跟踪事件

//send message to background.js for analytics event tracking
chrome.runtime.sendMessage({
      action : 'analytics_add_item',
      item_name : item.name,
      item_stat : item.stat,
      item_number : itemNumber
}, function(response) {
       //
});

这是我的后台脚本,监听消息并通过跟踪事件进行响应(好吧,无论如何它都应该这样做)

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXXXX-X']);

chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) {

        //track event - create
        if(request.action == "analytics_add_item"){
            _gaq.push(['_trackEvent',
                request.action,
                request.item_name.toLowerCase(),
                request.item_stat,
                request.item_number
            ]);
        }

});

【问题讨论】:

  • 您实际上并未将分析代码包含到您的背景页面中。显然,它不会起作用。
  • 这对于以前没有这样做过的人来说并不明显。然而,很明显,如果我知道我不会问这个问题。你能提供一个如何做到这一点的例子吗?我尝试将“google-analytics.com”添加到清单中的权限,并将“google-analytics.com/analytics.js”添加到清单的 backgrounds.scripts 但收到错误“无法加载后台脚本'google-analytics.com/analytics.js'。”

标签: javascript google-chrome-extension google-analytics


【解决方案1】:

GA 在我的分机的后台页面中运行良好:https://github.com/WellDoneCode/perfectpixel/blob/develop/Extension/background.js

您是否在后台页面中添加了 GA 脚本?

var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = 'https://ssl.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);

顺便说一句,您可以使用 'https://ssl.google-analytics.com/u/ga_debug.js' 作为 src,而不是在控制台中查看调试信息。

【讨论】:

  • 我没有,我认为有一种方法可以导入脚本,而无需在后台页面未使用的“文档”对象中创建
【解决方案2】:

这应该是正确的答案。我遇到了一种执行任务的可靠方法,我相信它是谷歌本身的一个示例,采用他们推荐的方式(阅读代码 sn-p 中的 cmets)。链接到使用 Google Analytics 跟踪数据的示例扩展。 https://developer.chrome.com/extensions/examples/tutorials/analytics.zip

参考代码sn-p:

// Copyright (c) 2012 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

  /**
   * Add your Analytics tracking ID here.
   */
  var _AnalyticsCode = 'UA-XXXXXX-X';

  /**
   * Below is a modified version of the Google Analytics asynchronous tracking
   * code snippet.  It has been modified to pull the HTTPS version of ga.js
   * instead of the default HTTP version.  It is recommended that you use this
   * snippet instead of the standard tracking snippet provided when setting up
   * a Google Analytics account.
   */
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', _AnalyticsCode]);
  _gaq.push(['_trackPageview']);

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

/**
 * Track a click on a button using the asynchronous tracking API.
 *
 * See http://code.google.com/apis/analytics/docs/tracking/asyncTracking.html
 * for information on how to use the asynchronous tracking API.
 */
function trackButtonClick(e) {
  _gaq.push(['_trackEvent', e.target.id, 'clicked']);
}

/**
 * Now set up your event handlers for the popup's `button` elements once the
 * popup's DOM has loaded.
 */
document.addEventListener('DOMContentLoaded', function () {
  var buttons = document.querySelectorAll('button');
  for (var i = 0; i < buttons.length; i++) {
    buttons[i].addEventListener('click', trackButtonClick);
  }
});

正如 Alex 所指出的,要启用发送分析数据的调试日志记录,请在开发时使用 https://ssl.google-analytics.com/u/ga_debug.js 而不是 https://ssl.google-analytics.com/ga.js

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-09-18
    • 1970-01-01
    • 2016-05-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多