Загрузка Google Analytics после загрузки страницы путем добавления script в голову не всегда работает
В ЕС существует закон cookie, который требует, чтобы вы загружали сторонние скрипты после того, как пользователь выражает согласие, например, щелкая, прокручивая или перемещаясь. Поэтому я загружаю 3 скрипта, выполняя функцию, вызываемую после загрузки документа. Это код:
![введите описание изображения здесь]()
Проблема в том, что она не всегда работает и не всегда терпит неудачу. Я вижу сеансы и активность, но я также знаю, что есть посещения, которые не запускают сценарии, потому что, когда я сам тестировал их на нескольких других компьютерах, не вся активность была сохранена в аналитике.
Что мне следует исправить в функции, чтобы она работала все время?
Ответы
Ответ 1
$(document).ajaxComplete(function() {
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXX-X']);
_gaq.push(['_trackPageview']);
var loadGoogleAnalytics = 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);
}
});
Ответ 2
Вы можете попробовать использовать эту функцию, которая отлично работает для меня:
function loadGoogleAnalytics(trackingId) {
var deferred = $q.defer();
function loadScript() {
var scriptId = 'google-analytics';
if (document.getElementById(scriptId)) {
deferred.resolve();
return;
}
var s = document.createElement('script');
s.id = scriptId;
s.innerText = "(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', '" + trackingId + "', 'auto');";
// most browsers
s.onload = initGA();
// IE 6 & 7
s.onreadystatechange = function () {
if (this.readyState == 'complete') {
initGA();
}
}
document.getElementsByTagName('head')[0].appendChild(s);
}
$window.initGA = function () {
deferred.resolve();
}
loadScript();
return deferred.promise;
}
Ответ 3
Если вы посмотрите этот пост, вы можете немного изменить его, чтобы добиться того, чего вы хотите:
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXX-X']);
_gaq.push(['_trackPageview']);
var loadGoogleAnalytics = 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>
Затем просто вызовите loadGoogleAnalytics()
всякий раз, когда пользователь соглашается с отображением использования Cookie
Ответ 4
Другой ответ, похоже, нацелен на ga.js, который является наследием, тогда как ваш вопрос, похоже, ориентирован на analytics.js(текущий).
Изучая фрагмент 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",
"https://www.google-analytics.com/analytics.js",
"ga"
);
ga("create", "UA-XXXXX-Y", "auto");
ga("send", "pageview");
Трюк прост: Google создает глобальный var GoogleAnalyticsObject
, который представляет собой строку, представляющую имя глобальной GoogleAnalytics. Вы можете видеть, что по умолчанию это "ga"
.
Итак, при загрузке вам нужно создать два глобальных vars: GoogleAnalyticsObject, который является строкой и окном [GoogleAnalyticsObject], который является функцией (которая просто накапливает события, эта функция заменяется при загрузке библиотеки, я думаю). Затем, когда ваш пользователь принимает файлы cookie, вы можете загрузить lib, и все готово:)
Ответ 5
Не могли бы вы попытаться добавить следующее вместо вызова .innerHTML()
//...text above...
TheAnalyticsScript.text = ['ga-script-string', 'fb-script.string','hotjar.string'].join('\n');
$('body').append(TheAnalyticsScript);
Пожалуйста, дайте мне знать, если это сработает.
Ответ 6
Вот мой выбор проблемы. Решение просто исправляет сценарии по умолчанию для возврата функции, которая затем добавляет тег script
только после получения согласия. Посмотрите:
// for GoogleAnalytics
var loadGA = (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();
// call this function after receiving consent
return function loadGA() {
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');
// for Facebook
window.fbAsyncInit = function() {
FB.init({
appId: 'your-app-id',
autoLogAppEvents: true,
xfbml: true,
version: 'v2.10'
});
FB.AppEvents.logPageView();
};
var loadFB = (function(d, s, id) {
//- call this function after receiving consent
return function loadFB() {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {
return;
}
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}
}(document, 'script', 'facebook-jssdk'));
// for HotJar
var loadHJ = (function(h, o, t, j, a, r) {
h.hj = h.hj || function() {
(h.hj.q = h.hj.q || []).push(arguments)
};
h._hjSettings = {
hjid: 1,
hjsv: 5
};
return function loadHJ() {
a = o.getElementsByTagName('head')[0];
r = o.createElement('script');
r.async = 1;
r.src = t + h._hjSettings.hjid + j + h._hjSettings.hjsv;
a.appendChild(r);
}
})(window, document, '//static.hotjar.com/c/hotjar-', '.js?sv=');
// finally when you receive the consent
function onConsentReceived() {
loadGA();
loadFB();
loadHJ();
}
//- meanwhile you can continue using ga(), hj() whatever here...
Каждый из загрузчиков может быть в своем теге script
, но убедитесь в упорядоченности этих тегов.
Ответ 7
Размышляя о том, что делает ваш код, эта функция:
- Создает элемент
<script>
, заполненный строками
- Добавляет его в
<head>
Обратите внимание, что <head>
- это афайк, который должен быть загружен только при начальной загрузке. В зависимости от реализации браузера и т.д. Может быть, что некоторые из ваших браузеров посетителей игнорируют тег <script>
, который вы добавляете после завершения загрузки страницы.
Если я понимаю, что вы хотите сделать правильно, вы хотите:
- Загрузка страницы без скриптов отслеживания
- Показать согласие мода/всплывающее окно
- В режиме "согласен" нажмите эту функцию без, чтобы перезагрузить страницу
Примечание: многие веб-сайты ЕС перезагружают страницу после согласования cookie, потому что они добавляют теги <script>
с отслеживанием на страницу с использованием бэкэнд-рендеринга. Часто нажав "Я согласен с файлами cookie", они хранят cookie типа agreed: true
, который изменяет веб-страницу, отправленную сервером.
Если вам не нужны перезагрузки:
- Установить cookie, когда пользователь согласен
- Обновить страницу
- Добавьте ваш backend (php/ node/ruby /whatever) добавить тег script на основе этого файла cookie
Если вы заботитесь
Измените свою функцию для запуска кодов отслеживания вместо их добавления в DOM.
Просто посмотрите коды отслеживания и разделите их на легко читаемый код. Например, код Ga фактически просто:
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);
И затем
function addTrackers() {
// Execute the tracking things instead of adding them to the DOM
}
Ответ 8
Вместо добавления всей аналитики script вы можете включить ее всегда, но удалить следующую строку:
ga("send", "pageview");
Затем, когда пользователь принимает файлы cookie, запустите функцию аналитики, которая отправляет маяк, используя ту же строку выше. Аналитики фактически не отправляют какие-либо данные, за исключением случаев, когда им конкретно сообщается. Это был бы самый логичный способ сделать то, что вы пытаетесь сделать.