在chrome扩展中从google analytics api获取数据？

Question

我正在尝试开发一个表单丢弃热映射程序

function newMarkup(id, uniqueHits){
var min = Math.min.apply(null,uniqueHits);
var max = Math.max.apply(null,uniqueHits);
var med = max / 2;
for(var num = 0; num < id.length; num++){
    styleElement(id[num], uniqueHits[num], min, max, med);
}}

function styleElement(element, value, min, max, med){
    var el = $("[id$=" + element + "]");
    if(el.prop('nodeName') === "INPUT"){
        if(value == max){
            el.addClass('very-good');
        }
        if(value < max && value > med){
            el.addClass('good');
        }
        if(value == med){
            el.addClass('average');
        }
        if(value < med && value > min){
            el.addClass('not-so-good');
        }
        if(value == min){
            el.addClass('poor');
        }
    } else {
        el = el.next();
        if(value == max){
            el.addClass('very-good');
        }
        if(value < max && value > med){
            el.addClass('good');
        }
        if(value == med){
            el.addClass('average');
        }
        if(value < med && value > min){
            el.addClass('not-so-good');
        }
        if(value == min){
            el.addClass('poor');
        }
    }
}

我想知道是否有可能从chrome扩展调用api？

从本质上讲，我尝试执行此调用以获取数据：

gapi.client.analytics.data.ga.get({
    'ids': 'ga:' + profileId,
    'start-date': '7daysAgo',
    'end-date': 'today',
    'metrics': 'ga:uniqueEvents',
    'dimensions': 'ga:eventLabel',
    'sort':'-ga:uniqueEvents',
    'filters': "ga:eventCategory==Form Field Tracking - /join"
})

我尝试过在MVC应用程序中使用iFrame来创建我的热映射器，但由于尝试跨域发送数据的麻烦，我放弃了。

我想知道是否可以从chrome扩展中从分析的API中获取数据？我想这将不得不以类似于google脚本使用分析API的方式来完成(使用服务帐户)，但我一直无法找到任何文档或找出这是否可能。(脚本中的代码示例)

function runReport(profileId) {
    var today = new Date();
    var oneWeekAgo = new Date(today.getTime() - 7 * 24 * 60 * 60 * 1000);

    var startDate = Utilities.formatDate(oneWeekAgo, Session.getTimeZone(), 'yyyy-MM-dd');
    var endDate = Utilities.formatDate(today, Session.getTimeZone(), 'yyyy-MM-dd');
    var tableId  = 'ga:' + profileId;
    var metric = 'ga:uniqueEvents';
    var options = {
        'dimensions': 'ga:eventLabel',
        'sort':'-ga:uniqueEvents',
        'filters': "ga:eventCategory==Form Field Tracking - /join"
    };
    var report = Analytics.Data.Ga.get(tableId, startDate, endDate, metric, options);
}

我真的很感谢任何人对我的帮助或建议。我正在尝试从chrome扩展中查询google analytic的API。这个是可能的吗？

Answer 1

未在GA上进行专门测试，但这是处理需要外部服务器提供API的脚本的一般方法：

1. 内容脚本不能向其他网站发出请求，因此它应该通过sending a message
2. The请求后台页执行此操作。后台页包括清单中引用的脚本，此文件必须存在于扩展中，它不是远程加载的脚本。
   1. 在我们添加corresponding CSP rule (添加到清单中)后，后台页可以与外部
   2. 服务器通信。
   3. 现在后台页侦听器已接收到来自步骤1的消息。它调用GA并将结果发送回原始选项卡的内容脚本(收到第一条消息时保存了tabId)。

• manifest.json：

"content_scripts"：[{ "matches"：""，"run_at"："document_start"，"all_frames"：true，"js"："content.js“} ]，"background"：{”脚本“："background.js"，"ga.js”}，"content_security_policy"："script-src 'self‘https://ssl.google-analytics.com；object-src 'self'"，.............

• content.js：

type({chrome.runtime.sendMessage："getGA"，data: some_data_for_GA})；chrome.runtime.onMessage.addListener(function(msg) { if (msg.type == "GA") { //将msg.data应用于页面元素...................} });

• background.js：

chrome.runtime.onMessage.addListener(function(msg，发送方，sendResponse) { var tabId = sender.tab.id，frameId = sender.frameId；if (msg.type == "getGA") { gapi.client.analytics.data.ga.get({ .....................//需要时使用msg.data }).execute(function(response) { sendMessageToFrameId(tabId，frameId，{type："GA"，data: response})；})；} })；function sendMessageToFrameId(tabId，frameId，msg) { // 1. frameId从Chrome41开始工作，在之前的版本中抛出// 2.没有frameId的Chrome45发送消息到错误的标签尝试{ chrome.tabs.sendMessage(tabId，msg，{frameId: frameId})；} catch(e) { chrome.tabs.sendMessage(tabId，msg)；} }