Chrome扩展的事件分析跟踪

Question

我试图在chrome扩展中添加google事件跟踪，但它似乎没有正确地将事件发送到服务器。我将从内容脚本发送消息到后台脚本，让它知道跟踪事件，并使用_gaq.push()尝试将事件发送到服务器。我将包括我在这里得到的东西，并希望得到一些帮助，因为我可以找到哪里错了/丢失了什么

这是我的清单文件，我在content_security_policy中添加了google

{
    "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
}

下面是我的内容脚本中的调用，让后台脚本知道用google跟踪事件

//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
            ]);
        }

});

Answer 1

GA在我的ext：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);

顺便说一下，您可以使用'debug.js‘作为src来查看控制台中的调试信息。

Answer 2

这应该是正确的答案。我找到了一种可靠的执行任务的方法，我相信这是Google自己推荐的一个示例(阅读代码片段中的注释)。链接到使用跟踪数据的示例扩展。https://developer.chrome.com/extensions/examples/tutorials/analytics.zip

供参考的代码片段：

// 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);
  }
});

此外，正如亚历克斯所指出的，要启用正在发送的分析数据的调试日志记录，请在开发时使用debug.js而不是https://ssl.google-analytics.com/ga.js。