Мне интересно, как лучше всего реализовать код отслеживания Google Analytics вместе с турбо-связью в Rails 4. Будет ли нормальный сниппет работать? Я также видел драгоценные камни для этого, но я не уверен, что он делает.
Rails 4 turbolinks с Google Analytics
Ответ 1
Я думаю, что лучше использовать новую универсальную аналитику (из файла analytics.js).
Универсальное решение для аналитики
(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', "#{GA_UA}", "#{GA_URL}");
ga('send', 'pageview');
И затем, когда вы хотите отправить событие, например, вы можете использовать
<script> ga('send', "event", "#{category}", "#{action}", "#{label}", "#{count}"); </script>
Будьте осторожны, чтобы сделать этот код в теле, а не в голове. Турбо-ссылки заменяют только тело.
И будьте осторожны:
1) GA_URL должен соответствовать URL-адресу ваших страниц
2) События отображаются в режиме реального времени, но на вкладке событий они появляются только после 24h +
3) Свойство вашей учетной записи должно быть "универсальным" для этого решения для работы
Документы Universal Analytics:
https://support.google.com/analytics/answer/2790010?hl=en&ref_topic=2790009
Ответ 2
Мне нравится решение vladCovaliov, потому что кажется, что большинство новых учетных записей используют Universal Analytics по умолчанию (что также лучше, на мой взгляд). Тем не менее, я думаю, что этот ответ должен сочетаться с другими предложениями, которые комментируют начальную страницу, использовать событие page:change и отслеживать просмотры страниц, а не события.
Например, в <head>:
<% 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', 'auto');
//ga('send', 'pageview');
</script>
<% else %>
<script>
function ga () {
var params = Array.prototype.slice.call(arguments, ga.length);
console.log("GoogleAnalytics: " + params);
};
</script>
<% end %>
И затем в файле js, который вы загрузили через конвейер активов:
$(document).on('page:change', function() {
ga('send', 'pageview', window.location.pathname);
});
Это приведет к записи просмотра страницы для каждой загружаемой страницы с помощью Turbolinks или без нее. Обратите внимание, что требуется window.location.pathname, иначе вы можете получить URL-адрес первой страницы, загруженной для всех последующих загрузок страниц. (Это также дает вам приятное место для редактирования URL-адреса, если вы хотите, например, выделить сегменты маршрута :id из URL-адресов RESTful.)
Вы также можете легко вызвать:
ga('send', "event", category, action, label, count);
Сообщать о событиях для других интересных событий javascript на вашем сайте.
Ответ 3
Я пошел с другим подходом, который я видел на каком-то веб-сайте, но это кажется разумным.
Добавьте GA в свой заголовок, как обычно, но с небольшой модификацией комментирования события trackPageview, которое происходит автоматически.
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-FOOBAR']);
//_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
Затем добавьте это где-нибудь в свой body, потому что тело перезагружается для turbolinks.
<% if Rails.env.production? %>
<script>_gaq.push(['_trackPageview']);</script>
<% end %>
Производственная проверка является необязательной, но это отличный способ не иметь хот файлы с отслеживанием хостов GA, если вы активно развиваетесь. Другим преимуществом является то, что вам не нужно беспокоиться о том, чтобы возиться со страницей: изменять или переводить страницы: загружать привязки и что вы можете быть уверены, что она будет работать в любом браузере, который отслеживается GA, не беспокоясь о двойных ударах или что-то странное.
Ответ 4
Быстрый взгляд на источник показывает, что единственное, что делает этот камень, это добавить некоторый javascript в конвейер ресурсов
# google-analytics-turbolinks/lib/assets/javascripts/google-analytics-turbolinks.js.coffee
if window.history?.pushState and window.history.replaceState
document.addEventListener 'page:change', (event) =>
# Google Analytics
if window.ga != undefined
ga('set', 'location', location.href.split('#')[0])
ga('send', 'pageview')
else if window._gaq != undefined
_gaq.push(['_trackPageview'])
else if window.pageTracker != undefined
pageTracker._trackPageview();
Вот и все. Вы можете использовать драгоценный камень или добавить что-то вроде этого фрагмента кода вручную в свои javascript-активы.
Ответ 5
Я ценю ответ scottwb, но, к сожалению, он не работает с Rails 5. В Rails 5 события Turbolinks были переименованы. Событие "page: change" было переименовано в "turbolinks: load". Вот почему его пример больше не работает.
Вы можете найти обзор того, как они были переименованы здесь: https://github.com/turbolinks/turbolinks/blob/master/src/turbolinks/compatibility.coffee
Так как это заняло у меня некоторое время, чтобы понять, я публикую правильную реализацию Rails 5 для всех, кто идет за мной.
Поместите следующий код в свой <head>
<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', 'auto');
//ga('send', 'pageview'); //moved to an asset file because of turbolinks
</script>
И затем в файле js (например. application.js) в конвейере вашего ресурса:
$(document).on('turbolinks:load', function() {
ga('send', 'pageview', window.location.pathname + window.location.search);
});
Не забудьте заменить "UA-XXXXXXXX-X" на свой идентификатор Google Analytics.
Ответ 6
Это решение сработало наилучшим образом для меня: http://reed.github.io/turbolinks-compatibility/google_analytics.html.
Для этого требуется, по крайней мере, Turbolinks v2.1.0 или выше.
Ответ 7
Мы просто взяли стандартный фрагмент, предоставленный Google, переведем его на CoffeeScript, а затем изменили последнее действие, поэтому оно связано как с событиями "ready" и "page: load". Мы также добавили условный оператор только для отправки данных, если текущий посетитель не находится у администратора (поэтому наши данные остаются как можно более чистыми).
((i, s, o, g, r, a, m) ->
i["GoogleAnalyticsObject"] = r
i[r] = i[r] or ->
(i[r].q = i[r].q or []).push arguments
return
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
return
) window, document, "script", "//www.google-analytics.com/analytics.js", "ga"
ga "create", 'UA-XXXXXXXX-XX', "yourdomain.com"
$(document).on 'ready page:load', ->
ga "send", "pageview", window.location.pathname unless $('body').data('admin') is true
Ответ 8
В соответствии с этим сайтом вам нужно только внести небольшую модификацию. Проблема с Turbolinks заключается в том, что она обновляет только часть веб-сайта, поэтому Google Analytics часто не видит, что страница изменилась. Таким образом, вы должны уведомить об этом вручную, добавив следующий CoffeeScript в файл в папке assets/javascript:
$(document).on 'page:change', ->
if window._gaq?
_gaq.push ['_trackPageview']
else if window.pageTracker?
pageTracker._trackPageview()
ПРИМЕЧАНИЕ: это не мой код, он берется непосредственно с ранее связанного веб-сайта