web-dev-qa-db-fra.com

Détecter si le navigateur est exécuté sur un périphérique Android ou iOS

Je dois modifier certains boutons et du texte sur un site Web mobile, selon que l'utilisateur le visualise sur un navigateur Android ou iOS. Existe-t-il un moyen fiable d'effectuer la vérification?

66
soleil
var isMobile = {
    Windows: function() {
        return /IEMobile/i.test(navigator.userAgent);
    },
    Android: function() {
        return /Android/i.test(navigator.userAgent);
    },
    BlackBerry: function() {
        return /BlackBerry/i.test(navigator.userAgent);
    },
    iOS: function() {
        return /iPhone|iPad|iPod/i.test(navigator.userAgent);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Windows());
    }
};
143
Anoop

Je voudrais utiliser le navigator.useragent propriété pour obtenir la chaîne useragent, l'analyser et détecter le système d'exploitation.

Here est un exemple de la façon dont vous pouvez le faire.

Mise à jour:

En raison de la popularité de cette question, j'ai pensé ajouter quelques informations supplémentaires à ma réponse.

En général, le reniflement du navigateur n'est presque jamais la meilleure solution. Pourquoi? Eh bien, il y a beaucoup de raisons, mais en voici deux bonnes:

  1. Dans presque tous les cas, lorsque les utilisateurs se tournent vers la recherche de navigateur, la détection de fonctionnalités serait une meilleure option . Dans de rares cas Edge, il peut être approprié d’agir en fonction du système d’exploitation/du navigateur que l’utilisateur peut utiliser, mais la plupart du temps, vous utilisez une bibliothèque telle que Modernizr pour détecter la prise en charge d’une fonctionnalité spécifique. une meilleure façon de faire. Essayer d’adapter votre site/votre application à des navigateurs spécifiques plutôt qu’aux fonctionnalités qu’ils prennent en charge est une pente glissante. Au lieu de cela, vérifiez si le navigateur prend en charge les fonctionnalités dont vous avez besoin, puis effectuez une polyfill ou offrez des solutions de rechange à Nice lorsque le support fait défaut.
  2. La détection de navigateur est extrêmement compliquée . Pourquoi? Parce que presque tous les navigateurs se trouvent dans leur chaîne d'agent utilisateur ou manquent d'informations suffisantes pour permettre une certaine identification.

Cela dit, si vous avez vraiment besoin d'utiliser la détection de navigateur/système d'exploitation, ne réinventez pas la roue et n'essayez pas de le faire vous-même: vous serez plongé dans un monde de souffrances et de piètres avertissements! Je vous suggère d'utiliser une bibliothèque telle que WhichBrowser , qui vous fournira un objet JavaScript pratique contenant des informations sur le système d'exploitation, le navigateur, le moteur de rendu et le périphérique.

13
Christofer Eliasson

Vous pouvez utiliser l'objet de navigateur: http://www.w3schools.com/js/js_browser.asp , puis utiliser des instructions if basées sur les propriétés du navigateur.

1
norway28

J'ai utilisé cela pendant un certain temps. Vérification simple pour voir le retour vrai ou faux basé sur est un appareil mobile.

var isMobile = (/Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Windows Phone/i.test(navigator.userAgent)) ? true : false;
0
meme