javascript - google - gtag event
javascript: ¿Detectar si Google Analytics está cargado todavía? (10)
Estoy trabajando en un proyecto aquí que almacenará cierta información en las variables personalizadas de Google Analytics. El script que estoy construyendo necesita detectar si GA se ha cargado todavía antes de que pueda enviar datos. El proyecto está siendo diseñado para funcionar en cualquier tipo de sitio que utilice GA. El problema es detectar de manera confiable si GA ha terminado de cargarse o no y está disponible.
Un par de variabilidades aquí:
Hay múltiples métodos de carga de GA. Scripts más antiguos desde los días de Urchin hasta los últimos scripts asíncronos. Algunos de estos están en línea, algunos son asíncronos. Además, algunos sitios realizan métodos personalizados de carga de GA, como en mi trabajo. Usamos YUI getScript para cargarlo.
Nombres variable-variable. En algunos scripts, el nombre de variable asignado a GA es
pageTracker
. En otros, su_gaq
. Luego está la infinidad de nombres de variables personalizados que los sitios podrían usar para su implementación de GA.
Entonces, ¿alguien tiene alguna idea sobre cuál podría ser una forma confiable de verificar si Google Analytics se está utilizando en la página y si se ha cargado?
Estilo ECMA2015
let checkIfAnalyticsLoaded = () => {
return new Promise((resolve, reject) => {
let timeStart = Date.now();
const TIMEOUT = 3000;
let _isLoaded = function() {
if (Date.now() - timeStart > TIMEOUT) {
reject(''Timeout. Google analytics not injected!'');
return;
}
if (window.ga && ga.create) {
resolve(ga);
return;
} else {
setTimeout(_isLoaded, 500);
}
};
_isLoaded();
});
}
checkIfAnalyticsLoaded()
.then((result => {
console.log(''LOADED'', result);
}))
.catch(console.error);
Así es como lo hice:
var ga = window[window[''GoogleAnalyticsObject''] || ''ga''];
if (typeof ga == ''function'') {
// call ga object here
ga(''send'', ''event'', ''Social Share Button'', ''click'', ''facebook'');
}
Esto, puede poner el código arriba / antes del Código de seguimiento de Google Analytics :
function check_ga() {
if (typeof ga === ''function'') {
console.log(''Loaded :''+ ga);
} else {
console.log(''Not loaded'');
setTimeout(check_ga,500);
}
}
check_ga();
Demostración: http://jsbin.com/rijiyojume/edit?html,console
O bien, si puede ejecutar un script después del código de seguimiento de Google Analytics :
ga(function(tracker) {
console.log(tracker.get(''clientId''));
});
Demostración: http://jsbin.com/wiqategifo/1/edit?html,console
Ref: #ready-callback
Estoy usando esto, pero construí una función auxiliar que me permite pasar una función y argumentos, y se llaman cuando se carga Google Analytics. Comprueba una vez cada medio segundo y deja de verificar después de un minuto si Google Analytics no se ha cargado. Pensé que esto podría ser útil para otros.
Uso:
function add(a,b){alert(a + '' + '' + b + '' = '' + (a+b));}
_mygaq(add,1,2);
Código:
function _mygaq(fn) {
this._count = this._count || 0;
this._running = this._running || false;
this._q = this._q || [];
if(arguments.length>0){
this._q.push({"f":fn,"p":Array.prototype.slice.call(arguments,1)});
} else {
this._count++;
}
if ((window._gat && window._gat._getTracker) || window.urchinTracker) {
this._count = 0;
this._running = false;
while (this._q.length > 0){
var _innr = this._q[0];
this._q = this._q.slice(1);
_innr.f.apply(_innr.f, _innr.p);
}
} else {
if( (arguments.length==0) || (!this._running && arguments.length>0)){
if(this._count < 120) setTimeout(''_mygaq()'', 500);
this._running = true;
}
}
}
La versión ajustada para esperar a que Google Analytics no solo haya terminado de cargarse, sino que también haya generado el ID de cliente (en caso de que lo necesite, como yo). También agregó un límite en la cantidad de reintentos (20).
var retryCounter = 0;
function checkIfAnalyticsLoaded() {
if ((typeof ga === ''function'' && ga.loaded) || retryCounter++ > 20) {
// ga() puts your method in the Command Queue,
// which is applied after GA is done with initialization
ga(yourFunctionHere());
} else {
// Retry.
setTimeout(checkIfAnalyticsLoaded, 500);
}
}
// Auto load
(function () {
checkIfAnalyticsLoaded();
})();
Ninguno de los métodos anteriores funcionó bien para mí. Tal vez porque estoy cargando GA a través de GTM, no estoy seguro. Pero este método simple funcionó desde la consola para mí:
ga.loaded
Si está intentando verificar desde su secuencia de comandos, es posible que deba esperar un poco, ya que GA se carga después de que el documento esté listo:
var t = setTimeout(function(){
console.log(ga.loaded);
}, 999);
Soy demasiado humilde para responder a la respuesta de Annie, que funciona pero tiene errores de sintaxis. Los nombres de Analytics tienen subrayado primero y la sintaxis de setTimeout () fue al revés (e incompleta). Debería ser esto:
function checkIfAnalyticsLoaded() {
if (window._gat && window._gat._getTracker) {
// Do tracking with new-style analytics
} else if (window.urchinTracker) {
// Do tracking with old-style analytics
} else {
// Probably want to cap the total number of times you call this.
setTimeout(checkIfAnalyticsLoaded, 500);
}
}
También puede buscar en el nuevo Seguimiento asíncrono y, luego, no tendrá que verificar que puede hacer lo que sea y enviará los datos tan pronto como se carguen ...
Tengo una solución diferente para esto si a alguien le importa probarlo. Esto supone que su objeto de Google Analytics es ''ga''. Cambia tu tiempo de espera y max intenta adaptarse a tu aplicación.
<script type="text/javascript">
var counter = 1;
function checkIfAnalyticsLoaded() {
if (window.ga) {
//LOADED!
} else {
counter = counter + 1;
if (counter < 6){
setTimeout(''checkIfAnalyticsLoaded()'', 200);
} else {
//LOADED!
}
}
}
window.onload = checkIfAnalyticsLoaded();
</script>
function checkIfAnalyticsLoaded() {
if (window._gaq && window._gaq._getTracker) {
// Do tracking with new-style analytics
} else if (window.urchinTracker) {
// Do tracking with old-style analytics
} else {
// Retry. Probably want to cap the total number of times you call this.
setTimeout(checkIfAnalyticsLoaded, 500);
}
}