Telegram
+38 (067) 538 00 81
Междоменное связывание с разными доменами
Эта статья будет особенно актуальна для различных сервисов, типа callbackHunter, онлайн-чатов и иже с ними, которые работают в iframe.

Вообще говоря, междоменное связывание, если у вас один основной домен, процедура простая, но что делать, если домены разные, а данные получать нужно?

Сначала немного истории, собственно о том, что это такое и как это работает.
Собственно — зачем? Ну переходят пользователи с одного домена на второй и хорошо, трафик никуда не теряется, всё круто. Но есть момент — обрывается сессия, т.е. для GA пользователь, который перешел с одного домена на второй будет двумя разными посещениями, и как следствия — источник для второго домена будет первый, а не реальный, с которого был переход, также время будет считать не корректно, транзакции будут приписываться на первый домен, а не, скажем, на рекламную кампанию. В общем, много данных будут теряться и затираться, что и концов не найти. Поэтому придумали междоменное связывание.

В те далёкие времена, когда еще не было Google Tag Manager, и проблему с междоменным связыванием нужно было решать, парни из команды Google Analytics придумал специальный плагин autoLink, задача которого была передавать специальный параметр (а именно ClientID) при переходе по ссылке или форме с одного домена на другой. И в куки пользователя записывались данные сразу по обоим доменам, участвующим в междоменном связывании.

Делалось это просто, путем модификации кода UA, для основного домена изменялся код:

ga('create', 'UA-XXXXXXX-Y', 'auto', {'allowLinker': true});
ga('require', 'linker');
ga('linker:autoLink', ['example-2.com'] );

И почти тоже самое для второго домена:

ga('create', 'UA-XXXXXXX-Y', 'auto', {'allowLinker': true});
ga('require', 'linker');
ga('linker:autoLink', ['example-1.com'] );

С появлением Google Tag Manager настройка всего этого стала значительно проще, модифицировался тэг UA, где нужно было добавить поля:

Где gaDomain, переменная типа «константа»:
И в том же тэге UA:
Где переменная gaCrossDomains, типа «константа»:
Публикуем и всё работает.

Но для iframes всё немного сложнее, ссылки и формы, которые необходимо модифицировать обычно грузятся несколько позже, чем GTM и UA внутри, поэтому есть определенная проблема в их маркировке.

И чтобы это корректно работало, нужно, чтобы сначала загрузились все iframe, и уже после — контейнер GTM, что мы и сделаем.
Во-первых — меняем код iframe
Скорей всего, вид вашего кода такой:

<iframe src=»http://www.domainB.com»></iframe>

Но мы меняем его на такой: 
&lt;iframe src="about:blank" data-iframe-src="http://www.domainB.com"&gt;&lt;/iframe&gt;
&lt;noscript&gt;&lt;iframe src="http://www.domainB.com"&gt;&lt;/iframe&gt;&lt;/noscript&gt;
Во-вторых изменяем правило вызова
тега GA
Чтобы всё корректно работало, для маркировки ссылок в iframe нужна:

  • HTML документ полностью загрузился
  • Код Google Analytics загрузился
В GTM уже есть событие gtm.dom, говорящее о полной загрузки HTML, но нам как-то нужно понять загрузился ли GA.

Для этих целей мы используем hit callback — js код, который пушит event в GTM по факту загрузки GA. Для этого делаем переменную типа custom javascript и называем его notifyGAHitCallback: 
function() {
  return function() {
    dataLayer.push({
      'event' : 'gaHitCallback'
    });
    return true;
  }
}
Должно получиться что-то такое:
А в тэге GA, добавляем поле:
После чего создаем еще одну переменную, которая будет проверять корректность загрузки всего этого добра (имя: checkDomAndGALoaded, типа custom JavaScript):
function() {
  var i = dataLayer.length,
      gaLoaded = false,
      domLoaded = false;
  while(i--) {
    if(dataLayer[i].event === 'gtm.dom') {
      domLoaded = true;
    }
    if(dataLayer[i].event === 'gaHitCallback') {
      gaLoaded = true;
    } 
  }
  return domLoaded &amp;&amp; gaLoaded ? '1' : '0';
}
Должно выйти что-то похожее:
Собственно, в случае если всё загрузилось как надо, то код возвращает 1, если нет, то 0.

Поэтому делаем правило, с именем domAndGALoaded и условиями:

{{event}} matches RegEx (gtm\.dom|gaHitCallback)
and
{{checkDomAndGALoaded}} equals 1

Получить что-то такое:
Которое мы и используем для активации тега UA, вместо ALL PAGES.
В третьих — изменить ссылки в iframe
Делаем новый тэг типа custom HTML, где правило вызова наше правило domAndGALoaded, куда пишем:
&lt;script&gt;
(function() {
  var iframes = document.getElementsByTagName('iframe'),
         i = iframes.length,
         iframe, src, uaLinker, gaLinker, trackers;
  //if universal analytics
  if(typeof ga !== 'undefined' &amp;&amp; typeof ga.getAll === 'function') {
    trackers = ga.getAll();
    if(trackers.length) {
      uaLinker = new window.gaplugins.Linker(trackers[0]);
    } 
  }
  //if classic analytics
  if(typeof _gat !== 'undefined' &amp;&amp; typeof _gat._getTrackers === 'function') {
    trackers = _gat._getTrackers();
    if(trackers.length) {
      gaLinker = trackers[0];
    }
  }
  //now loop through all iframes, decorate the source url and remove the display none
  while(i--) {
    iframe = iframes[i];
    if(iframe.src === 'about:blank' &amp;&amp; iframe.getAttribute('data-iframe-src')) {
      src=iframe.getAttribute('data-iframe-src');
      if(uaLinker) {
        src = uaLinker.decorate(src); 
      }
      if(gaLinker) {
        src = gaLinker._getLinkerUrl(src);
      }
      iframe.src=src;
    }
  }
}());
&lt;/script&gt;
И выходит:
Публикуем и получаем нормальное междоменное отслеживание iframe.

По мотивам http://www.knewledge.com/en/blog/2013/11/cross-domain-tracking-for-iframes-with-gtm/
Made on
Tilda