Rileva il telefono Android tramite Javascript / jQuery

122

Come faccio a rilevare che il dispositivo in uso è un Android per un sito Web mobile?

Devo applicare alcuni attributi CSS alla piattaforma Android.

Grazie

javascript jquery android

— Xavier
fonte

223

Dai un'occhiata a questo: 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();
}

Modifica : come sottolineato in alcuni commenti, funzionerà nel 99% dei casi, ma alcuni casi limite non sono coperti. Se hai bisogno di una soluzione molto più avanzata e antiproiettile in JS, dovresti usare platform.js: https://github.com/bestiejs/platform.js

— Michael Lumbroso
fonte

5

non dimenticare di controllare anche per tablet Android: googlewebmastercentral.blogspot.com/2011/03/…

2

Vale la pena notare che questo non funziona sempre per i dispositivi Android poiché, ad esempio, gli agenti utente segnalati dai dispositivi Kindle Fire HD non contengono affatto la parola "android".

— djbp

3

L'approccio navigator.userAgent non funziona sui dispositivi Samsung Galaxy. Non c'è "Android" nelle specifiche del browser.

— AsafK

2

Le prime due righe della soluzione JS possono essere semplificate in:var isAndroid = /Android/i.test(navigator.userAgent)

— Dave Koo

4

La tua soluzione non funziona. Ecco un programma utente Nokia Lumia. E indovina cosa? corrisponde a 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

Che ne dici di questa battuta?

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

Il imodificatore viene utilizzato per eseguire la corrispondenza senza distinzione tra maiuscole e minuscole.

Tecnica tratta dal progetto di test Cordova AdMob: https://github.com/floatinghotpot/cordova-admob-pro/wiki/00.-How-To-Use-with-PhoneGap-Build

— Mars Robertson
fonte

2

Penso che la risposta di Michal sia la migliore, ma possiamo fare un ulteriore passo avanti e caricare dinamicamente un CSS Android come da domanda originale:

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
fonte

1

Perché dovresti farlo, mentre puoi usare le media query? Il rilevamento del dispositivo JS dovrebbe essere solo per il miglioramento, come l'aggiunta di un invito per installare la tua app. Il rendering della pagina non dovrebbe mai fare affidamento su di esso perché avrai problemi di prestazioni e un'orribile esperienza di usabilità.

— camilokawerin

1

@camilokawerin La tua risposta dovrebbe essere indirizzata all'autore. Stavo semplicemente fornendo una risposta alla sua domanda. Tuttavia, ci sono casi in cui desideri un CSS specifico per la piattaforma. Ad esempio, se desideri che lo stile visivo dell'interfaccia corrisponda al dispositivo.

— 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
fonte

-3

js, cattura anche l'iPad:

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

— jonny
fonte

3

Non funziona perché cattura molti dispositivi, non solo Android come richiede la domanda.

— NickG

1

Usa almeno qualcosa del genere: /android.*(?=mobile)/i.test(navigator.userAgent); per rilevare il telefono Android. Ma questa regex contiene quantificatori "costosi", quindi la risposta di Philip con 2 test separati potrebbe essere più appropriata.

— Vadim P.