Question

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

这是我的清单文件，我已将google analytics添加到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
}

以下是我的内容脚本中的调用，让后台脚本知道使用Google Analytics进行事件跟踪

//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在我的分机后台页面中运行良好：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);

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

Answer 2

这应该是正确的答案。我遇到了一种可靠的方式来执行任务，我相信这是Google自己推荐的一种样本（阅读代码片段中的注释）。链接到使用Google Analytics跟踪数据的示例扩展程序。 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);
  }
});

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

Chrome扩展程序的分析事件跟踪

2 个答案: