在我的Rails应用中包含Google Analytics嵌入API第三方信息中心示例javascript

我在这里关注Google Analytics嵌入API这个例子,通过我的应用程序中的Chart.js实现GA第三方仪表板,我在Step 3遇到麻烦,我们将包括所有的javascript库。

我能够在我的application.js加载Embed API

 (function(w,d,s,g,js,fs){ g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}}; js=d.createElement(s);fs=d.getElementsByTagName(s)[0]; js.src='https://apis.google.com/js/platform.js'; fs.parentNode.insertBefore(js,fs);js.onload=function(){g.load('analytics');}; }(window,document,'script')); //= require /public/javascript/Chart.min.j //= require /public/javascript/moment.min.js //= require /public/javascript/embed-api/date-range-selector.js //= require /public/javascript/embed-api/active-users.js 

它在开发工具的Networks部分显示cb=gapi.loaded_0正在加载。 但是,其他库不是。 Charts.min.jsCharts.min.js可在线获取,但我不确定在哪里可以找到embed-api/date-range-selector.js或者embed-api/active-users.js来检索到我的应用程序?

EDIT1在这里找到文件: https : //github.com/googleanalytics/ga-dev-tools

我可能是错的,但我相信Rails资产管道需要某种//= require_self或类似的东西来确保包含当前文件中的代码。 在我看来,该文件中的加载代码段没有运行或正在以错误的顺序运行。

将它保存到单独的文件中可能更容易,更简单,因此您可以确保订单正确。

 // File: /public/javascript/embed-api-snippet.js (function(w,d,s,g,js,fs){ g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}}; js=d.createElement(s);fs=d.getElementsByTagName(s)[0]; js.src='https://apis.google.com/js/platform.js'; fs.parentNode.insertBefore(js,fs);js.onload=function(){g.load('analytics');}; }(window,document,'script')); 

然后将其余代码放在设置文件中,如下所示:

 // File: /public/javascript/embed-api-setup.js gapi.analytics.ready(function() { gapi.analytics.auth.authorize({ container: 'embed-api-auth-container', clientid: 'REPLACE WITH YOUR CLIENT ID', }); // the rest of the setup code... }); 

现在你的清单应该是这样的:

 //= require /public/javascript/embed-api-snippet.js //= require /public/javascript/Chart.min.js //= require /public/javascript/moment.min.js //= require /public/javascript/embed-api/date-range-selector.js //= require /public/javascript/embed-api/active-users.js //= require /public/javascript/embed-api-setup.js 

另外,你说:

这是关于gapi.analytics.auth.authorize部分,我相信它是embed-api / active-user.js的一部分

实际上, gapi.analytics.auth.authorize部分不在ActiveUsers组件中,auth部分是你必须自己编写的(因为客户端ID需要特定于你),它应该在embed-api-setup.js文件,如上所述。

您可以在此处找到 您引用的示例的设置代码。

我在Rails Admin中做了同样的事情。

首先,我做了这个Rails Admin Customization:将html视图嵌入到仪表板中,但我认为它可以是你喜欢的任何视图。

在这个.html.erb文件中,我从他们的网站插入了GA代码:

    Embed API Demos — Pure HTML Dashboards            

接下来,我将所有GA JS,CSS和HTML添加到供应商:

在此处输入图像描述

我希望这有帮助 :)

EDIT1 :有关GA Dashboarding的更多信息,请访问: https : //ga-dev-tools.appspot.com/embed-api/