Détecter le téléphone Android via Javascript / jQuery

122

Comment puis-je détecter que l'appareil utilisé est un Android pour un site Web mobile?

J'ai besoin d'appliquer certains attributs CSS à la plate-forme Android.

Merci

javascript jquery android

— Xavier
source

223

Jetez un œil à cela: http://davidwalsh.name/detect-android

JavaScript:

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf("android") > -1; //&& ua.indexOf("mobile");
if(isAndroid) {
  // Do something!
  // Redirect to Android-site?
  window.location = 'http://android.davidwalsh.name';
}

PHP:

$ua = strtolower($_SERVER['HTTP_USER_AGENT']);
if(stripos($ua,'android') !== false) { // && stripos($ua,'mobile') !== false) {
  header('Location: http://android.davidwalsh.name');
  exit();
}

Edit : Comme indiqué dans certains commentaires, cela fonctionnera dans 99% des cas, mais certains cas marginaux ne sont pas couverts. Si vous avez besoin d'une solution beaucoup plus avancée et à l'épreuve des balles dans JS, vous devez utiliser platform.js: https://github.com/bestiejs/platform.js

— Michael Lumbroso
source

5

n'oubliez pas de vérifier également les tablettes Android: googlewebmastercentral.blogspot.com/2011/03/…

2

Il convient de noter que cela ne fonctionne pas toujours pour les appareils Android car, par exemple, les agents utilisateurs signalés par les appareils Kindle Fire HD ne contiennent pas du tout le mot `` android ''.

— djbp le

3

L'approche navigator.userAgent ne fonctionne pas sur les appareils Samsung Galaxy. Il n'y a pas d'Android dans les spécifications du navigateur.

— AsafK

2

Les deux premières lignes de la solution JS peuvent être simplifiées à:var isAndroid = /Android/i.test(navigator.userAgent)

— Dave Koo

4

Votre solution ne fonctionne pas. Voici un agent utilisateur Nokia Lumia. Et devine quoi? il correspond à Android:

Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Touch; rv:11.0; IEMobile/11.0; NOKIA; Lumia 625; Orange) like iPhone OS 7_0_3 Mac OS X AppleWebKit/537 (KHTML, like Gecko) Mobile Safari/537

— Sam Jason Braddock

47

Que diriez-vous de ce one-liner?

var isAndroid = /(android)/i.test(navigator.userAgent);

Le imodificateur est utilisé pour effectuer une correspondance insensible à la casse.

Technique tirée du projet de test Cordova AdMob: https://github.com/floatinghotpot/cordova-admob-pro/wiki/00.-How-To-Use-with-PhoneGap-Build

— Mars Robertson
source

2

Je pense que la réponse de Michal est la meilleure, mais nous pouvons aller plus loin et charger dynamiquement un CSS Android selon la question d'origine:

var isAndroid = /(android)/i.test(navigator.userAgent);
if (isAndroid) {
    var css = document.createElement("link");
    css.setAttribute("rel", "stylesheet");
    css.setAttribute("type", "text/css");
    css.setAttribute("href", "/css/android.css");
    document.body.appendChild(css);
}

— drlarsen
source

1

Pourquoi voudriez-vous faire cela, alors que vous pouvez utiliser des requêtes multimédias? La détection des appareils JS doit être uniquement destinée à des améliorations, comme l'ajout d'une invitation à installer votre application. Le rendu de la page ne devrait jamais s'en remettre car vous aurez des problèmes de performances et une expérience d'utilisation horrible.

— camilokawerin le

1

@camilokawerin Votre réponse doit être adressée à l'auteur. Je répondais simplement à sa question. Il y a des cas où vous souhaitez un CSS spécifique à la plateforme. Par exemple, si vous souhaitez que le style visuel de l'interface corresponde à l'appareil.

— drlarsen

2

;(function() {
    var redirect = false
    if (navigator.userAgent.match(/iPhone/i)) {
        redirect = true
    }
    if (navigator.userAgent.match(/iPod/i)) {
        redirect = true
    }
    var isAndroid = /(android)/i.test(navigator.userAgent)
    var isMobile = /(mobile)/i.test(navigator.userAgent)
    if (isAndroid && isMobile) {
        redirect = true
    }
    if (redirect) {
        window.location.replace('jQueryMobileSite')
    }
})()

— Phillip Senn
source

-3

js, attrape aussi l'iPad:

var is_mobile = /mobile|android/i.test (navigator.userAgent);

— jonny
source

3

Ne fonctionne pas car il attrape de nombreux appareils, pas seulement Android comme l'exige la question.

— NickG

1

Utilisez au moins quelque chose comme ceci: /android.*(?=mobile)/i.test(navigator.userAgent); pour détecter un téléphone Android. Mais cette expression régulière contient des quantificateurs «coûteux», donc la réponse de Philip avec 2 tests séparés peut être plus appropriée.

— Vadim P.