2016-02-26 75 views
5

我已經使用Heroku部署了一個Rails 4.2應用程序,並且我試圖將Google Analytics添加到它。但是,Google Analytics並未收集任何會話。將Google Analytics添加到Rails 4.2應用程序

任何建議爲什麼以及如何解決這個問題?

CODE

/app/layouts/_footer.html.erb:

<% if Rails.env.production? %> 
    <script> 
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ 
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), 
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) 
    })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); 

    ga('create', 'UA-XXXXXXXX-X', 'herokuapp.com'); 
    ga('send', 'pageview'); 

    </script> 
<% end %> 

/app/layouts/application.html.erb:

<!DOCTYPE html> 
<html> 
<head> 
    <title>Title</title> 
<%= Gon::Base.render_data({}) %> 
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> 
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 
    <%= csrf_meta_tags %> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
</head> 
<body> 

<div class="container"> 
    <%= yield %> 
</div> 

<%= render 'layouts/footer' %> 

</body> 
</html> 

/應用/ assets/javascripts/analytics.js.coffee:

$(document).on 'page:change', -> 
if window._gaq? 
    _gaq.push ['_trackPageview'] 
else if window.pageTracker? 
    pageTracker._trackPageview() 

/app/assets/javascripts/application.js:

//= require jquery 
//= require analytics 
//= require bootstrap 
//= require jquery_ujs 
//= require jquery.ui.all 
//= require Chart 
//= require jquery.turbolinks 
//= require lodash 
//= require_tree . 

的Gemfile:

source 'https://rubygems.org' 

gem 'rails',    '4.2.2' 
gem 'bootstrap-sass',  '3.2.0.0' 
gem 'sass-rails',   '5.0.2' 
gem 'uglifier',    '2.5.3' 
gem 'coffee-rails',   '4.1.0' 
gem 'jquery-rails',   '4.0.3' 
gem 'jquery-ui-rails', '~> 4.2.1' 
gem 'turbolinks',   '2.3.0' 
gem 'jquery-turbolinks' 
gem 'jbuilder',    '2.2.3' 
gem 'sdoc',     '0.4.0', group: :doc 
gem 'chart-js-rails' 
gem 'gon' 
gem 'lodash-rails' 

group :development, :test do 
    gem 'sqlite3',  '1.3.9' 
    gem 'byebug',  '3.4.0' 
    gem 'web-console', '2.0.0.beta3' 
    gem 'spring',  '1.1.3' 
end 

group :production do 
    gem 'pg',    '0.17.1' 
    gem 'rails_12factor', '0.0.2' 
end 
+0

就這樣您知道,您在此問題中混合了兩種不同版本的Google Analytics(分析)網絡跟蹤庫。在您的'_footer.html.erb'中,您正在使用[analytics.js跟蹤代碼段](https://developers.google.com/analytics/devguides/collection/analyticsjs/),但在您的'analytics.js中。咖啡'文件,您使用的遺留ga.js代碼,它不會做任何事情,因爲您從未加載ga.js庫,您加載了analytics.js。 –

回答

7

要添加腳本的方式是錯誤的方式,因爲它不會因Turbolinks工作,你知道_footer中的代碼不會按預期運行,因爲這段標記不會因爲Turbolink而重新加載。

我會給你我所有我的rails應用程序的谷歌分析的自定義實現。

在您的應用程序/資產/ JavaScript的創建一個新的文件名爲google_analytics.js.coffee並添加下面的腳本:

class @GoogleAnalytics 

    @load: -> 
    # Google Analytics depends on a global _gaq array. window is the global scope. 
    window._gaq = [] 
    window._gaq.push ["_setAccount", GoogleAnalytics.analyticsId()] 

    # Create a script element and insert it in the DOM 
    ga = document.createElement("script") 
    ga.type = "text/javascript" 
    ga.async = true 
    ga.src = ((if "https:" is document.location.protocol then "https://ssl" else "http://www")) + ".google-analytics.com/ga.js" 
    firstScript = document.getElementsByTagName("script")[0] 
    firstScript.parentNode.insertBefore ga, firstScript 

    # If Turbolinks is supported, set up a callback to track pageviews on page:change. 
    # If it isn't supported, just track the pageview now. 
    if typeof Turbolinks isnt 'undefined' and Turbolinks.supported 
     document.addEventListener "page:change", (-> 
     GoogleAnalytics.trackPageview() 
    ), true 
    else 
     GoogleAnalytics.trackPageview() 

    @trackPageview: (url) -> 
    unless GoogleAnalytics.isLocalRequest() 
     if url 
     window._gaq.push ["_trackPageview", url] 
     else 
     window._gaq.push ["_trackPageview"] 
     window._gaq.push ["_trackPageLoadTime"] 

    @isLocalRequest: -> 
    GoogleAnalytics.documentDomainIncludes "local" 

    @documentDomainIncludes: (str) -> 
    document.domain.indexOf(str) isnt -1 

    @analyticsId: -> 
    # your google analytics ID(s) here... 
    'UA-xxxxxxxx-x' 

GoogleAnalytics.load() 

正如你可以看到它增加了對Turbolinks支持,這是一個乾淨的,更好的將Google分析添加到您的應用的方式。希望對你有效。

+0

謝謝。而在'/app/assets/javascripts/application.js:'文件中,我應該用'// = require analytics'替換'// = require analytics'? – Bhav

+1

你不需要修改你的application.js,因爲你已經擁有了'// require_tree .'你根本不需要'// =需要分析'... – SsouLlesS

+0

@SsouLlesS看起來不錯!有沒有辦法將其限制在生產環境中? – slehmann36

相關問題