Проблема с использованием Google Analytics с Require.js - PullRequest
8 голосов
/ 25 июля 2011

Я использую require.js (http://requirejs.org/) для ряда функций на моем сайте, и пока он работает нормально. Я столкнулся с проблемой при попытке включить код Google Analytics, хотяКажется, что код отказывается добавить utm.gif и не отправляет маяк в Google. Мне интересно, является ли это областью действия.

define(function() {
    var Analytics = {};
    Analytics.Apply = function() {
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-XXXXX-X']);
    _gaq.push(['_trackPageview']);

    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);
}
return Analytics;
});

ga.debug не выдает ошибок и utm.gif не отображается. Если я перемещаю код за пределы require.js (я имею в виду модульный javascript, использующий require.js, поэтому просто добавляю его на страницу), utm.gif успешно добавляется на страницу и ga.debugотсылает свой маяк.

Я обнаружил, что этот сайт, похоже, успешно использует его, но я не уверен, что этот сайт делает по-другому: http://paceyourself.net/2011/05/14/managing-client-side-javascript-with-requirejs/

Кто-нибудь еще сталкивался с проблемамиобъединяя require.js и GA?

Ответы [ 5 ]

9 голосов
/ 12 июля 2013

Ни один из других ответов не помог мне, но мне удалось выяснить, что работает, после прочтения документации Google Analytics .

в вашем основном app.js

requirejs.config({
    paths: {
        ga: '//www.google-analytics.com/analytics'
    }
});

requirejs(['analytics'], function () {
    ...
});

в своем собственном файле analytics.js:

define(['ga'], function () {
    window.ga('create', 'UA-XXXXXX-1');
    window.ga('send', 'pageview');
});

Это работает, поскольку requirejs гарантирует, что к моменту выполнения функции analytics.js завершит загрузку. Это означает, что функция window.ga готова принимать команды.

5 голосов
/ 26 июля 2011

См. Эту ветку группы requirejs для обсуждения проблемы.

3 голосов
/ 22 апреля 2013

Для последней версии Google Analytics фрагмент кода, который я использую с RequireJS, - -

<script>
  window.GoogleAnalyticsObject = 'ga';
  window.ga = { q: [['create', 'UA-40327700-1', 'jspm.io'], ['send', 'pageview']], l: Date.now() };
  require(['http://www.google-analytics.com/analytics.js']);
</script>
0 голосов
/ 16 августа 2013

Другие решения не работали для меня при использовании более новой analytics.js. Вставка URL-адреса напрямую как зависимости не работала, потому что requirejs не смог определить, когда скрипт завершил загрузку. Плагин async для requirejs, похоже, тоже не работает для меня (хотя я использую его для API Google Maps).

У меня сработал следующий подход:

define(function (require) {

  var module;

  // Setup temporary Google Analytics objects.
  window.GoogleAnalyticsObject = "ga";
  window.ga = function () { (window.ga.q = window.ga.q || []).push(arguments); };
  window.ga.l = 1 * new Date();

  // Immediately add a pageview event to the queue.
  window.ga("create", "{{TrackingID}}", "{{Domain}}");
  window.ga("send", "pageview");

  // Create a function that wraps `window.ga`.
  // This allows dependant modules to use `window.ga` without knowingly
  // programming against a global object.
  module = function () { window.ga.apply(this, arguments); };

  // Asynchronously load Google Analytics, letting it take over our `window.ga`
  // object after it loads. This allows us to add events to `window.ga` even
  // before the library has fully loaded.
  require(["http://www.google-analytics.com/analytics.js"]);

  return module;

});
0 голосов
/ 31 мая 2013

Вот и мы:

define([ 'http://www.google-analytics.com/ga.js' ], function ( ga ) {
    ga = { q: [['create', 'UA-18710277-1', 'jspm.io'], ['send', 'pageview']], l: Date.now() };
});

Это модуль, которым я сейчас пользуюсь, шляпа @ user2305274

...