2016-02-26 15 views
5

Ho un'app Rails 4.2 che ho distribuito con Heroku e ho provato ad aggiungere Google Analytics. Tuttavia, Google Analytics non sta rilevando alcuna sessione.Aggiunta di Google Analytics all'app per Rails 4.2

Qualche suggerimento perché e come risolvere questo?

CODICE

/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> 

/app/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

Solo così sai, stai mescolando due diverse versioni delle librerie di monitoraggio web di Google Analytics in questa domanda. Nel tuo '_footer.html.erb' stai utilizzando lo [snippet di monitoraggio analytics.js] (https://developers.google.com/analytics/devguides/collection/analyticsjs/), ma nel tuo' analytics.js. file coffee' stai usando il codice legacy ga.js, che non farà nulla perché non hai mai caricato la libreria ga.js, hai caricato analytics.js. –

risposta

7

Il modo in cui si sta aggiungendo lo script è il modo sbagliato, dal momento che non funziona a causa di Turbolinks , sai che il codice che hai nel tuo _footer non funzionerà come previsto poiché quel pezzo di markup non verrà ricaricato a causa di Turbolinks.

Ti fornirò la mia implementazione personalizzata di Google Analytics per tutte le mie app.

Nelle tue app/Attività/javascript creare un nuovo file chiamato google_analytics.js.coffee e aggiungere il seguente script:

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() 

Come si può vedere che aggiunge il supporto per Turbolinks, questo è un ambiente pulito e migliore modo di aggiungere Google Analytics alla tua app. Spero che funzioni per te.

+0

Grazie. E nel file /app/assets/javascripts/application.js: 'dovrei sostituire' // = richiede analytics' con '// = require analytics'? – Bhav

+1

non hai bisogno di modificare il tuo application.js dato che hai già '// = require_tree .' non hai bisogno di' // = richiedere analytics' ... – SsouLlesS

+0

@SsouLlesS Sembra fantastico! C'è un modo per limitarlo all'ambiente di produzione? – slehmann36