Cómo utilizar Google Analytics con Phonegap sin un plugin?


Estoy haciendo una aplicación y quiero obtener análisis de los usuarios. Traté de usar el plugin Phonegap, pero no tuve suerte al intentar implementarlo.

Me preguntaba si era posible obtener Google Analytics tratando la aplicación como una página web normal y poniendo algo de javascript en la cabeza de mi página.

¿Hay una mejor manera de hacer esto? y es el Phonegap Google Analytics QUE mucho mejor de lo que estoy tratando de hacer?

Author: Mike, 2012-06-14

11 answers

[editar] Google Analytics ahora funciona con localstorage en aplicaciones híbridas.

Google Analytics ahora tiene un opciones explicadas aquí para usar localStorage en lugar de cookies y también hay un truco para que funcione en webviews (urlfile://). Así que en lugar de usar el código que sugerí antes, puedes hacer esto:

// THIS IS FOR LOCALSTORAGE
var GA_LOCAL_STORAGE_KEY = 'ga:clientId';
ga('create', 'UA-XXXXX-Y', {
  'storage': 'none',
  'clientId': localStorage.getItem(GA_LOCAL_STORAGE_KEY)
});
ga(function(tracker) {
  localStorage.setItem(GA_LOCAL_STORAGE_KEY, tracker.get('clientId'));
});

// THIS IS FOR FILE URL SUPPORT
ga('set', 'checkProtocolTask', function(){ /* noop */});

// And then as usual...
ga('send', 'pageview');

Contenido de la respuesta anterior:

La solución de pokki sugerida por Alex está funcionando bien con algunos ajustes para eliminar la necesidad de Pokki.

I se creó un proyecto git para esta versión limpia aquí:

Https://github.com/ggendre/GALocalStorage

Funciona muy bien en Android 4.1 y ios6, probaré más dispositivo muy pronto. Espero que esto ayude ! :)

 21
Author: Guillaume Gendre,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-01-08 11:12:50

Echa un vistazo al video para verlo en acción:

Http://screencast.com/t/6vkWlZOp

Después de algunas investigaciones, encontré una solución. Me encontré con este hilo en el Grupo de Google Phonegap: https://groups.google.com/forum/#! msg/phonegap/uqYjTmd4w_E / YD1QPmLSxf4J (gracias TimW y Dan Levine!) En este hilo he encontrado que es posible utilizar Google Analytics sin un plugin. Todo lo que tienes que hacer es descargar el ga.archivo js de Google http://www.google-analytics.com/ga.js (simplemente guarde la página en su carpeta www)

Entonces modifica el ga.archivo js agregándole un carácter. Busquen en el GA.archivo js para la palabra "archivo:" y sustituirlo por "_file:".

En el hilo que enlacé arriba, "TimW" explica el razonamiento para esto:

Esencialmente, Google Analytics no funcionará si se utiliza desde un archivo: / / / url. En iOS / PhoneGap este es el caso. Para resolver esto problema que debes primero descargue el ga.archivo js de Google e incluir como parte de su construcción local. Notarás que este archivo es ofuscada. Buscar en el archivo la cadena "file:" que debería ocurrir sólo una vez. Cuando lo encuentre, agregue un subrayado al principio (por lo que se convierte en "_file:"). Esto evita que coincida con el protocolo de la página ubicación (que es "archivo:").

Después de añadir un carácter a la ga.js, simplemente incluya lo siguiente en la parte superior de su página:

<script type="text/javascript" src="ga.js"></script>
    <script>
 var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-YOUR_ID_HERE']);
    _gaq.push(['_setDomainName', 'none']);
    _gaq.push(['_trackPageview', 'NAME_OF_PAGE']);
    </script>

Probé esto en el simulador, y obtuve una prueba de que estaba funcionando usando la vista en Tiempo Real en Google Analytics. El simulador estaba trabajando en iOS 5.0. Mi teléfono todavía está en iOS 4.2, y cuando lo probé en mi dispositivo, no se mostró en el seguimiento en tiempo Real.

En el hilo, alguien mencionó los mismos problemas con Android 4.0+... Esperemos que haya una mejor solución para esto en el futuro, pero por ahora esta es la forma más fácil y menos complicada de obtener análisis básicos para mi aplicación. No puede hacer seguimiento fuera de línea, pero eso es un poco espeluznante de todos modos.

A pesar de que los usuarios de iOS 4 y Android son una minoría en el mercado (ver gráfico circular):

Http://static7.businessinsider.com/image/4fd65fac6bb3f7925700000f/chart-of-the-day-ios-vs-android-june-2012.jpg

Me gustaría obtener datos de todos los sistemas operativos.

 34
Author: Mike,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-06-15 08:20:40

Estamos en febrero de 2017 y no hay necesidad de editar analytics.js, ni para una biblioteca o plugin más, o al menos no tenía necesidad de ellos. Muchas cosas que se dijeron en los últimos años están obsoletas o simplemente obsoletas, así que aquí está mi guía completa actualizada.

1. La configuración.archivo xml

En su configuración.xml, debe permitir la solicitud entre sitios:

<access origin="https://www.google-analytics.com" />

2. El HTML

En tu meta etiqueta CSP, si eliges tenga uno, también debe permitir llamadas a Google. Puede parecer:

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: 'unsafe-inline' 'unsafe-eval' https://ssl.gstatic.com https://www.google-analytics.com;">

3. El javascript

Aquí está el código comentado para una aplicación web que puede ejecutarse tanto en el navegador como en una aplicación empaquetada de Cordova. Puede ignorar el bloque else si no le importa el navegador.

// the default GA code, nothing to change
(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');

var fields = {
  // note: you can use a single tracking id for both the app and the website,
  // don't worry it won't mix the data. More about this in the 3rd section
  trackingId: 'UA-XXXXXXXX-Y'
};

// if we are in the app (the protocol will be file://)
if(document.URL.indexOf('http://') !== 0){

  // we store and provide the clientId ourselves in localstorage since there are no
  // cookies in Cordova
  fields.clientId = localStorage.getItem('ga:clientId');
  // disable GA's cookie storage functions
  fields.storage = 'none';

  ga('create', fields);

  // prevent tasks that would abort tracking
  ga('set', {
    // don't abort if the protocol is not http(s)
    checkProtocolTask: null,
    // don't expect cookies to be enabled
    checkStorageTask: null
  });

  // a callback function to get the clientId and store it ourselves
  ga(function(tracker){
    localStorage.setItem('ga:clientId', tracker.get('clientId'));
  });

  // send a screenview event
  ga('send', {
    // these are the three required properties, check GA's doc for the optional ones
    hitType: 'screenview',
    // you can edit these two values as you wish
    screenName: '/index.html',
    appName: 'YourAppName'
  });
}
// if we are in a browser
else {

  ga('create', fields);

  // send a pageview event
  ga('send', {
    // this is required, there are optional properties too if you want them
    hitType: 'pageview'
  });
}

3. Tu cuenta de GA

  • Para monitorear el tráfico de la aplicación móvil, cree una vista del tipo App.

Si no es necesario monitoree el tráfico de su aplicación web desde un sitio web, puede dejar de leer aquí, de lo contrario siga leyendo. Asumo que está utilizando una sola cuenta para el seguimiento tanto del sitio web como de la aplicación.

  • Aplicar el filtro personalizado llamado " Aplicación? = > yes " en la vista creada para que solo muestre los screenview hits. Hay una guía oficial aquí
  • Luego, para rastrear el tráfico desde el sitio web, cree una segunda vista del tipo Website. Aplicar un filtro personalizado "¿Solicitud? => no" en él.
  • Si desea una vista combinada de su tráfico en línea y en la aplicación, cree una tercera vista del tipo App. Por defecto (sin filtro), mostrará todos los datos.

Notas complementarias

  • Todo pasa por https ahora, ya no es necesario el protocolo http en su <access> y CSP
  • Tenga en cuenta que escribir *.google-analytics.com en el CSP no funcionaría. Aunque esa política funciona en Chrome (56), no lo hace en Córdoba (5.6.0)
  • Google analytics no requiere ningún permiso de aplicación como ACCESS_NETWORK_STATE o ACCESS_WIFI_STATE como he leído en otro lugar
  • Todo esto se probó con una aplicación de Android (espero que funcione en aplicaciones de iOS también), con el plugin Crosswalk instalado
 21
Author: Louis Ameline,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-02-14 01:47:19

Estaba usando la aplicación Ionic (basada en Cordova) como un sitio web móvil y GA estaba trabajando para ello. Cuando envié la misma aplicación a ios nativo, dejó de funcionar.

Cuestión 1.
Al revisar los registros de simulator, encontró que GA no se estaba cargando correctamente. Estaba probando la carga file://. Para arreglar esto, antepuse https: a la url de GA bajo

(window,document,'script','//www.google-analytics.com/analytics.js','ga')

Cuestión 2. De forma predeterminada, Google anula la solicitud si el protocolo de página no es http o https. Para arreglar esto

ga('set', 'checkProtocolTask', null);

Y usted debe ser establecido. Después de hacer estos cambios, pude confirmar los eventos en GA. Espero que te ayude a ti también.

 3
Author: Nirav Gandhi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-01-28 09:16:37

No funcionó para mí. El problema es que google code utiliza cookies y no funciona con url de archivo://.

Encontré una buena implementación que usa localStorage en lugar de cookies: https://developers.pokki.com/docs/tutorials.php

 2
Author: Alex,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-12-23 12:54:23

He implementado el segment.io -análisis.biblioteca js en una aplicación HTML5 / meteor.

No tengo plugin de análisis en phonegap (3.1). Funcionó inmediatamente para iOS.

Después de la implementación, los análisis de la aplicación Android no se mostraron durante aproximadamente 4 horas. Luego comenzó a funcionar sin cambios en la configuración de phonegap o meteor.

Esperemos que esto ayude a alguien a evitar unas horas de buscar un error misterioso.

Nota: Asegúrese de que el origen de acceso correcto esté establecido arriba, p. ej. añadir

 1
Author: kate,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-02-25 10:57:57

Este complemento de phonegap ayudará a integrar google analytics en la aplicación phonegap. Lea este blog para obtener más información sobre cómo integrar google analytics en phonegap. también puede descargar el código de demostración de trabajo desde aquí.

 1
Author: Shashi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-04-02 12:05:13

Para cualquiera que tenga problemas con la gran solución de Guillaume Gendre en Android 4.1 u otra plataforma específica, esto podría resolverlos.

Si los registros de la consola de Android muestran "Error desconocido de Chromium: 0", es probable que deba refinar sus permisos de acceso en la configuración.XML. Arreglé mi problema y lo describí aquí .

 0
Author: Wytze,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 12:10:26

Solución rápida y sucia. Use puede usar un iframe de luz oculta como este;

<iframe src="http://www.yourwebsite.com/userControls/GoogleAnalytics.html?param=extraParamHere" style="visibility: hidden"></iframe>

Y cada vez que solicite una página en la aplicación PhoneGap, vuelva a cargar este iframe para inicializar la pista.

 0
Author: Teoman shipahi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-05-16 04:43:09

Puede usar la biblioteca GALocalstorage, y funciona bien en dispositivos móviles

Es fácil de configurar

<script type="text/javascript" src="js/libs/GALocalStorage.js"></script>
<script>
    ga_storage._setAccount('UA-37167XXX-1'); //Replace with your own
    ga_storage._trackPageview('/index.html');

</script>

Y eso es todo, ninguna modificación o cualquier otra cosa.

Necesitas crear Website Account en Google analytics para usar esta biblioteca

Biblioteca en GitHub

 0
Author: RezaRahmati,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-02-25 16:10:28

NOTA: El ID de rastreo del cliente de Google Analytics generado para la plataforma móvil solo es compatible con IOS y Android.So si desea realizar un Seguimiento de su google Analytics,Asegúrese de que lo ha Creado para el sitio web. Solo ID de seguimiento para el trabajo del sitio web con el teléfono gap todas las aplicaciones de la plataforma. A continuación, Simplemente puede descargar GALocalStorage desde el siguiente enlace y luego colocarlo en su carpeta js en la carpeta www

www
 |__
    js
      |__
          GALocalStorage.js

A continuación, escriba el siguiente código bajo su etiqueta , y su inicio mostrando los usuarios activos en tiempo real en su tablero.

Https://github.com/ggendre/GALocalStorage

       <script>
        ga_storage._setAccount('UA-XXXXXXXX-X'); //Replace with your own
        ga_storage._trackPageview('Home Screen');
        </script>
 0
Author: 9to5ios,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-07-09 11:24:24