Une fois de plus, nous voyons que l'utilisation d’un détecteur de navigateur force les navigateurs à s'identifier eux-mêmes différemment (incorrectement, si vous préférez).

Les autres fournisseurs de navigateurs mettent généralement le vrai nom de leur navigateur dans le code d’identification, MSIE ou Opera etc... .Ils ont également rajouté compatible après le numéro de version de Mozilla, pour indiquer qu'ils n'étaient pas vraiment Mozilla mais seulement compatible avec celui-ci. Cette façon de faire est également devenue une habitude.

D'autre part, jusqu'à Mozilla Netscape n’a jamais ajouté Netscape à ce code d’identification. Par conséquent il n'y a pas vraiment de façon de détecter Netscape 4 ou les versions inférieur. Si ce n'est aucun autre navigateur et s'il n’y a pas compatible dans le code d’identification, nous pouvons assumer que c'est un Netscape 1 à 4.

Donc pour détecter un navigateur, nous recherchons les bons codes d’identifications (ou leurs absence).

La version

Après Mozilla viens un slash puis le numéro de version. Dans Netscape avant la version 6 le numéro de version est identique à la version du navigateur actuel, mais d'autres fournisseurs (notamment Microsoft) n'ont pas été contraints par ceci. Au lieu de cela, ils ont choisi le numéro de version de Mozilla dont ils se sentaient le plus compatibles.

Tous les fournisseurs de navigateurs excepté Netscape ont pris l’habitude d’inclure le vrai numéro de version derrière le vrai nom de leur navigateur, séparé par un espace ou un slash. Ainsi une fois que nous avons identifié le nom du navigateur, nous recherchons le deuxième caractère qui est la version du navigateur.

Pour Netscape, nous prenons le numéro qui ce trouve derrière Mozilla/ à la place. C'est correct pour tout les Netscapes jusqu'à la version 6. Malheureusement Mozilla ne suit aucune règle. Si le numéro de version de Mozilla est 5 (ce qui est correct, puisque le '6' n’est qu’une astuces commerciale), mais le nom du navigateur est de la forme Netscape6/6.0 , ne suivant pas la règle que j'ai énoncée plus haut. J'ai donc décidé de ne rien faire à ce sujet, Mozilla est détecté en tant que 'Netscape 5 '.

Système d'exploitation

La détection d'OS est assez simple, à partir du moment ou vous savez comment elle fonctionne. Internet Explorateur dit Windows, tandis que Netscape indique Win, par conséquent détectez toujours Windows en recherchant Win. Il n’est donc pas étonnamment, que le code Mac l’emploie de l'OS Macintosh. Si vous trouvez X11 signifie que l'ordinateur utilise X-Windows pour Unix, si en plus le code Linux est trouvé l'OS est Linux.

Le script

Vous détectez quel navigateur est utilisé par le script suivant :

var detect = navigator.userAgent.toLowerCase();
var OS,browser,version,total,thestring;

if (checkIt('konqueror'))
{
	browser = "Konqueror";
	OS = "Linux";
}
else if (checkIt('safari')) browser = "Safari"
else if (checkIt('omniweb')) browser = "OmniWeb"
else if (checkIt('opera')) browser = "Opera"
else if (checkIt('webtv')) browser = "WebTV";
else if (checkIt('icab')) browser = "iCab"
else if (checkIt('msie')) browser = "Internet Explorer"
else if (!checkIt('compatible'))
{
	browser = "Netscape Navigator"
	version = detect.charAt(8);
}
else browser = "An unknown browser";

if (!version) version = detect.charAt(place + thestring.length);

if (!OS)
{
	if (checkIt('linux')) OS = "Linux";
	else if (checkIt('x11')) OS = "Unix";
	else if (checkIt('mac')) OS = "Mac"
	else if (checkIt('win')) OS = "Windows"
	else OS = "an unknown operating system";
}

function checkIt(string)
{
	place = detect.indexOf(string) + 1;
	thestring = string;
	return place;
}

Explication

Nous commençons par prendre navigator.userAgent et on met toute la chaîne de caractères en minuscule (toLowerCase) (de sorte qu’il fonctionne aussi si les navigateurs buguent avec les majuscules).

var detect = navigator.userAgent.toLowerCase();

J'emploie une fonction d'aide, checkIt(). C'est la fonction qui fait la véritable détection pour la chaîne de caractères. Elle renvoie le numéro d'index du nom de navigateur dans la chaîne. Si le nom n'est pas dans celle-ci, elle renvoie zéro.

Elle se rappelle également de place (la place du nom du navigateur dans la chaîne) et de thestring. La fonction est seulement exécutée à partir du moment ou nous avons trouvé le bon navigateur. Après ça, la fonction n’est plus appelée donc place et thestring gardent la valeur qu'ils ont eue en détectant le navigateur. Voir ci-dessous pour les détails.

function checkIt(string)
{
	place = detect.indexOf(string) + 1;
	thestring = string;
	return place;
}

La détection de navigateur

L’astuce de ce script, c’est qu’il commence par les navigateurs les plus rares pour finir par les plus communs. Comme nous avons pu le voir Opera peut assumer l'identité d’Internet Explorer, mais il laisse toujours Opera quelque part dans le code d’identification. Par conséquent nous devons d'abord contrôler si le navigateur est Opera, et c’est seulement s'il ne l’est pas que nous cherchons à voir si c'est Internet Explorer. Cet ordre de détection est très important.

Ainsi nous commençons par les navigateurs exotiques. Konqueror en premier.

if (checkIt('konqueror'))
{

Ce qui vient après le if est seulement exécuté quand le nom Konqueror apparaît dans le code du navigateur. Si c’est le cas, le navigateur est Konqueror et l'OS est Linux, bien que le code d’identification du navigateur puisse ne pas contenir de référence pour cet OS.

	browser = "Konqueror";
	OS = "Linux";
}

Vient maintenant une longue liste de else if. Nous commençons encore par les navigateurs les plus rares.

else if (checkIt('safari')) browser = "Safari"
else if (checkIt('omniweb')) browser = "OmniWeb"
else if (checkIt('opera')) browser = "Opera"
else if (checkIt('webtv')) browser = "WebTV";
else if (checkIt('icab')) browser = "iCab"

Si le navigateur n'est aucun de ce qui précède, nous pouvons sans risque vérifier si c’est Explorer.

else if (checkIt('msie')) browser = "Internet Explorer"

Maintenant pour Netscape. Nous vérifions si la chaîne 'compatible' n'est PAS presente. Si elle n'est pas présente, le navigateur est probablement Netscape. En outre, le numéro de version est toujours situé à la neuvième place dans le code du navigateur (index 8, derrière Mozilla/), ainsi nous pouvons immédiatement détectez le numéro de version.

else if (!checkIt('compatible'))
{
	browser = "Netscape Navigator"
	version = detect.charAt(8);
}

Si ce n'est toujours pas le navigateur, alors je ne sais pas.

else browser = "An unknown browser";

Naturellement vous pouvez facilement rajouter d'autres navigateurs à la liste else if. Rappelez-vous juste qu’il faut d’abord vérifier les navigateurs les plus rares.

Détecter la version

Maintenant pour la version. S'il n'y a pas encore de version détecté (si le navigateur n'est pas Netscape)

if (!version)

nous prenons le caractère derrière le nom du navigateur, en utilisant place et thestring que la fonction checkIt() nous a préparé.

version = detect.charAt(place + thestring.length);

Détecter l’OS

Si un OS n'est pas encore détecté

if (!OS)
{

nous commençons une nouvelle liste de else if :

	if (checkIt('linux')) OS = "Linux";
	else if (checkIt('x11')) OS = "Unix";
	else if (checkIt('mac')) OS = "Mac"
	else if (checkIt('win')) OS = "Windows"
	else OS = "an unknown operating system";
}

qui nous donne le système d'exploitation.

Utiliser le

Maintenant vous avez assez d'information pour prendre des décisions basées sur le navigateur de l'utilisateur. Par exemple :

if (browser != "Internet Explorer")
{
	code not executed in Explorer
}

ou

if (version < 4 || browser == "iCab")
{
	code executed in browser versions 3 and below and iCab
}

Ne pas utiliser la détection de navigateur

Maintenant que vous savez comment détecter les navigateurs, vous devez apprendre quand utiliser la détection de navigateur et quand il faut utiliser une autre méthode de détection. Beaucoup de novices sous estime l’importance d’un détecteur de navigateur.

La raison la plus commune d’utilisation d’un détecteur de navigateur, c’est d’empêcher certains scripts d’être exécuté dans des navigateurs ou ils ne seront pas pris en charge. Cependant, utiliser un détecteur de navigateur pour la détection d’objet n’est pas sans risques puisque vous ne pourrez jamais être sur que la détection de navigateur couvrira toutes les circonstances.

La méthode la plus sure est d’utiliser la détection d'objet: cette méthode regarde si le navigateur peut supporter la méthode ou l’objet JavaScript que vous souhaitez utiliser. Utilisez le script de cette page seulement quand la détection d’objet est impossible.