11540 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Avoir Google Analytics chargé via fichier externe

Hello tous,

je me suis amusé à faire une page de test pour charger Google Analytics via un fichier externe (autant le dire de suite, c'est dans l'idée d'être compliant avec les checklist Opquast desktop, notamment éviter les scripts en ligne).

Normalement le code de GA doit être mis dans le head.

Avant de râler, je précise :
1) je suis une quiche en JS
2) c'est du bricolage pour l'amusement, et je viens ici pour chopper justement de meilleures idées.

Grosso merdo, voici l'idée, la page de test :

<!DOCTYPE html>
<html lang="fr"> 
<head>
</head>
<body role="document">
<div id="page">

TOTO
   
</div>
<script src="test.js" async="async"></script>
</body>
</html>


Dans le fichier test.js, y a le code Analytics :


  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-xxxxxxxxxx-1']);
  _gaq.push(['_trackPageview']); 

  (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);
  })();


Le tout marche.

Par contre, j'ai besoin parfois de faire passer une valeur à la fonction 
_gaq.push(['_trackPageview']);
, par exemple 
_gaq.push(['_trackPageview', '/coucou']);


(on appelle ça les virtual page trackers, cf cet article si vous voyez pas de quoi je parle

Comme le JS est externalisé, bien évidemment, il faut que cette information vienne de la page, alors je me suis dit : pourquoi ne pas utiliser les attributs data-*, genre un data-ga sur le body.

donc ça donnerait ça :


<!DOCTYPE html>
<html lang="fr"> 
<head>
</head>
<body role="document" data-ga="/plop">
<div id="page">

TOTO
   
</div>
<script src="test.js" async="async"></script>
</body>
</html>


et le test.js ressemblerait à ça :


var data = document.getElementsByTagName("body")[0].getAttribute("data-ga");

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-xxxxxxxxxxx-1']);
   if (data){
       _gaq.push(['_trackPageview', data]); 
   } 
   else { _gaq.push(['_trackPageview']);}

  (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);
  })();


De ce que j'ai pu tester à la rache sous Firefox, ça marche.

Maintenant, mes questions :

Est-ce que le JS que j'ai écrit à la rache va tourner partout ? (si ça peut aller jusqu'à IE7 voir 6)
D'après ce que j'ai vu, getElementsByTagName est ok partout, mais pour le getAttribute, je ne sais pas.

Et si y a un connaisseur de Google Analytics qui se serait penché sur cette question, je prends des retours.

Sinon, si vous avez d'autres idées, je prends Smiley smile

Merci,
Nico
Modifié par Nico3333fr (03 Apr 2014 - 00:18)
Salut,

<HS>
Nico3333fr a écrit :
je suis une quiche en JS

Pour quelqu'un qui a des origines lorraines, c'est normal, non ? Smiley lol
</HS>
Nico3333fr a écrit :
Est-ce que le JS que j'ai écrit à la rache va tourner partout ? (si ça peut aller jusqu'à IE7 voir 6)
D'après ce que j'ai vu, getElementsByTagName est ok partout, mais pour le getAttribute, je ne sais pas.

Aucun souci avec la méthode getAttribute () : c'est la propriété dataset qui n'est pas reconnue par les versions d'IE antérieures à la 11, Opera Mini et les versions du navigateur Android antérieures à la 3.

Maintenant, reste à savoir si les démons de Mountain View apprécieront ton initiative, quand même elle serait on ne peut plus recommandable. Smiley rolleyes
Sujet clos
Aller à