Suivi des informations sur les visiteurs (analytique) pour un site pages Web ASP.NET (Razor)

par Tom FitzMacken

Cet article explique comment utiliser une assistance pour ajouter l’analytique de site web aux pages d’un site web pages Web ASP.NET (Razor).

Ce que vous allez apprendre :

  • Comment envoyer des informations sur le trafic de votre site web à un fournisseur d’analytique.

Voici les fonctionnalités de programmation ASP.NET introduites dans l’article :

  • L’assistance Analytics .

Versions logicielles utilisées dans le tutoriel

  • pages Web ASP.NET (Razor) 2
  • bibliothèque ASP.NET Web Helpers (package NuGet)

Analytique est un terme général pour la technologie qui mesure le trafic sur votre site web afin que vous puissiez comprendre comment les utilisateurs utilisent le site. De nombreux services d’analytique sont disponibles, y compris les services de Google, Yahoo, StatCounter, etc.

Le fonctionnement de l’analytique est que vous créez un compte auprès du fournisseur d’analytique, où vous inscrivez le site que vous souhaitez suivre. Le fournisseur vous envoie un extrait de code JavaScript qui inclut un ID ou un code de suivi pour votre compte. Vous ajoutez l’extrait de code JavaScript aux pages web du site que vous souhaitez suivre. (En règle générale, vous ajoutez l’extrait de code analytique à un pied de page ou à une page de mise en page ou à un autre balisage HTML qui apparaît sur chaque page de votre site.) Lorsque les utilisateurs demandent une page qui contient l’un de ces extraits de code JavaScript, l’extrait de code envoie des informations sur la page active au fournisseur d’analytique, qui enregistre divers détails sur la page.

Lorsque vous souhaitez consulter les statistiques de votre site, vous vous connectez au site web du fournisseur d’analytique. Vous pouvez ensuite afficher toutes sortes de rapports sur votre site, comme :

  • Nombre de pages vues pour chaque page. Cela vous indique (à peu près) combien de personnes visitent le site, et quelles pages de votre site sont les plus populaires.

  • Combien de temps les utilisateurs passent sur des pages spécifiques. Cela peut vous indiquer si votre page d’accueil maintient l’intérêt des gens.

  • Les sites sur lesquels les gens étaient avant de visiter votre site. Cela vous aide à comprendre si votre trafic provient de liens, de recherches, etc.

  • Quand les gens visitent votre site et combien de temps ils restent.

  • Quels sont les pays d’origine de vos visiteurs.

  • Navigateurs et systèmes d’exploitation utilisés par vos visiteurs.

    Ch14traffic-1

Utilisation d’une assistance pour ajouter des analyses à une page

pages Web ASP.NET inclut plusieurs assistances analytiques (Analytics.GetGoogleHtml, Analytics.GetYahooHtml, et Analytics.GetStatCounterHtml) qui facilitent la gestion des extraits de code JavaScript utilisés pour l’analytique. Au lieu de déterminer comment et où placer le code JavaScript, il vous suffit d’ajouter l’assistance à une page. Les seules informations que vous devez fournir sont le nom, l’ID ou le code de suivi de votre compte. (Pour StatCounter, vous devez également fournir quelques valeurs supplémentaires.)

Dans cette procédure, vous allez créer une page de mise en page qui utilise l’assistance GetGoogleHtml . Si vous disposez déjà d’un compte auprès d’un des autres fournisseurs d’analytique, vous pouvez utiliser ce compte à la place et apporter de légères modifications en fonction des besoins.

Notes

Lorsque vous créez un compte d’analytique, vous inscrivez l’URL du site que vous souhaitez suivre. Si vous testez tout sur votre ordinateur local, vous ne suivrez pas le trafic réel (le seul trafic est vous), vous ne pourrez donc pas enregistrer et afficher les statistiques du site. Toutefois, cette procédure montre comment ajouter une assistance analytique à une page. Lorsque vous publiez votre site, le site actif envoie des informations à votre fournisseur d’analytique.

  1. Ajoutez la bibliothèque ASP.NET Web Helpers à votre site web, comme décrit dans Installation d’assistances dans un site pages Web ASP.NET, si vous ne l’avez pas déjà ajoutée.

  2. Créez un compte avec Google Analytics et enregistrez le nom du compte.

  3. Créez une page de mise en page nommée Analytics.cshtml et ajoutez le balisage suivant :

    @using Microsoft.Web.Helpers;
    <!DOCTYPE html>
    <html>
      <head>
        <title>Analytics Test</title>
      </head>
      <body>
        <h1>Analytics Test Page</h1>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,
        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
        <div id="footer">
          &copy; 2012 MySite
        </div>
        @Analytics.GetGoogleHtml("myaccount")
      </body>
    </html>
    

    Notes

    Vous devez placer l’appel à l’assistance Analytics dans le corps de votre page web (avant la </body> balise). Sinon, le navigateur n’exécutera pas le script.

    Si vous utilisez un autre fournisseur d’analytique, utilisez plutôt l’une des assistances suivantes :

    • (Yahoo) @Analytics.GetYahooHtml("myaccount")
    • (StatCounter) @Analytics.GetStatCounterHtml("project", "security")
  4. Remplacez par myaccount le nom du compte, de l’ID ou du code de suivi que vous avez créé à l’étape 1.

  5. Exécutez la page dans le navigateur. (Vérifiez que la page est sélectionnée dans l’espace de travail Fichiers avant de l’exécuter.)

  6. Dans le navigateur, affichez la source de la page. Vous pourrez voir le code analytique rendu :

    <!DOCTYPE html>
    <html>
      <head>
        <title>Analytics Test</title>
      </head>
      <body>
        <h1>Analytics Test Page</h1>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,
        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        <div id="footer">
          &copy; 2012 MySite
        </div>
        <script type="text/javascript">
          var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
          document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
        </script>
        <script type="text/javascript">
          try{
          var pageTracker = _gat._getTracker("myaccount");
          pageTracker._trackPageview();
          } catch(err) {}
        </script>
      </body>
    </html>
    
  7. Connectez-vous au site Google Analytics et examinez les statistiques de votre site. Si vous exécutez la page sur un site actif, vous voyez une entrée qui enregistre la visite dans votre page.

Ressources supplémentaires