Différencier votre application InSITE d'un simple navigateur Internet depuis votre site web

Introduction
Intégration

1 - Introduction

Les outils d'analyse de fréquentation de site Internet, comme Google Analytics, permettent d'identifier et de répertorier les navigateurs des visiteurs, selon différents critères tels que le modèle ou la version, de Firefox, Chrome, etc. Ces informations sont contenues dans la propriétés « User-Agent » du Navigateur. Cela permet notamment de détecter s'il s'agit d'une version mobile d'un navigateur.
A partir de la version 1.1.4 de InSITE, il est possible d'identifier et de dissocier une App InSITE développée par Déoliance, d'un simple navigateur.

L'utilité est de pouvoir personnaliser un site Internet, pour proposer par exemple, le téléchargement de l'application mobile, seulement si l'utilisateur ne l'utilise pas déjà.

2 - Intégration

2.1 - Nomenclature du User-Agent d'InSITE

le User-Agent utilisé par InSITE utilise la nomenclature suivante:

INFO InSITE-App/VERSION

INFO	Diverses informations ou compatibilités Navigateur/OS
InSITE-App	Mot clef permettant d'identifier une application mobile InSITE
VERSION	Version de l'application mobile InSITE

2.2 - Exemples de syntaxe

Sur smartphone SAMSUNG Galaxy S5:

Mozilla/5.0 (Linux; Android 4.4.2; SM-G900F Build/KOT49H) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/30.0.0.0 Mobile Safari/537.36 InSITE-App/1.1.4

Sur smartphone iPhone 6s:

Mozilla/5.0 (iPhone; CPU iPhone OS 9_3 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Mobile/13E234 InSITE-App/1.1.4

2.3 - Utilisation

Voici un premier exemple en PHP, afin de masquer le logo d'un site web, si l'on estime qu'il est facultatif dans InSITE, qui contient déjà un logo et le nom de l'application dans la barre de titre :

<!DOCTYPE html>
<html>
   <head>
      <title>Déoliance</title>
   </head>
   <body>
      <?php
         $useragent = $_SERVER['HTTP_USER_AGENT'];
         if(preg_match("/InSITE\-App/",$useragent))
         {
             //Ce visiteur navigue depuis l'App, alors on n'affiche pas le logo
         }else{
             //Ce visiteur n'utilise pas l'App, on lui affiche le logo
             echo "<img src=\"../../../img/logo.png\" alt=\"logo\" style=\"width:300px;height:100px;\">";
         }
         ?>
   </body>
</html>

A noter qu'il est possible d'affiner la recherche afin d'adapter le site web spécialement à une version de l'application.

Voici un autre exemple, cette fois en Javascript, permettant d'afficher un message d'information lorsqu'un visiteur n'utilise pas l'application mobile.

<!DOCTYPE html>
<html>
<head>
<title>Déoliance</title>
<script type="text/javascript">
    if (navigator.userAgent.match(/InSITE\-App/))
    {
        //Ce visiteur navigue depuis l'App, alors on n'affiche aucun message
    }else{
        //Ce visiteur n'utilise pas l'App, alors on l'informe de son existance
        alert("Vous pouvez-également utiliser notre application mobile.");
    }
</script>
</head>
<body>
    <h1>Bienvenue sur notre site Internet</h1>
</body>
</html>

Dernière modification : 23/03/2016