Android telefonu Javascript / jQuery ile algıla


122

Kullanılan cihazın bir mobil web sitesi için Android olduğunu nasıl anlarım?

Android platformuna belirli css özelliklerini uygulamam gerekiyor.

Teşekkürler

Yanıtlar:


223

Şuna bir bakın: 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();
}

Düzenleme : Bazı yorumlarda belirtildiği gibi, bu, vakaların% 99'unda işe yarayacaktır, ancak bazı uç durumlar kapsanmamaktadır. JS'de çok daha gelişmiş ve kurşun geçirmez bir çözüme ihtiyacınız varsa, platform.js'yi kullanmalısınız: https://github.com/bestiejs/platform.js


5
Ayrıca android tabletler için kontrol etmeyi unutmayın: googlewebmastercentral.blogspot.com/2011/03/...

2
Örneğin, Kindle Fire HD cihazları tarafından bildirilen kullanıcı aracıları 'android' kelimesini hiç içermediğinden, bunun android cihazlar için her zaman işe yaramadığını belirtmek gerekir.
djbp

3
Navigator.userAgent yaklaşımı, samsung galaxy cihazlarda çalışmaz. Tarayıcı özelliklerinde "Android" yok.
AsafK

2
JS çözümünün ilk iki satırı şu şekilde basitleştirilebilir:var isAndroid = /Android/i.test(navigator.userAgent)
Dave Koo

4
Çözümünüz işe yaramıyor. İşte bir Nokia Lumia kullanıcı aracısı. Ve tahmin et ne oldu? android ile eşleşiyor: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


2

Bence Michal'in cevabı en iyisi, ancak bunu bir adım öteye taşıyabilir ve orijinal soruya göre bir Android CSS'yi dinamik olarak yükleyebiliriz:

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);
}

1
Medya sorgularını kullanırken neden bunu yapmak isteyesiniz? JS cihaz algılaması, uygulamanızı yüklemek için bir davetiye eklemek gibi yalnızca geliştirme amaçlı olmalıdır. Sayfa oluşturma asla buna güvenmemelidir çünkü performans sorunlarınız ve korkunç bir kullanılabilirlik deneyimi yaşayacaksınız.
camilokawerin

1
@camilokawerin Yanıtınız yazara yönlendirilmelidir. Ben sadece sorusuna bir cevap veriyordum. Yine de platforma özgü CSS'yi istediğiniz durumlar vardır. Örneğin, arayüzün görsel stilinin cihazla eşleşmesini istiyorsanız.
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')
    }
})()

-3

js sürümü, iPad'i de yakalar:

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

3
Çalışmıyor, çünkü sorunun gerektirdiği gibi yalnızca Android'i değil, birçok cihazı yakaladı.
NickG

1
En azından şuna benzer bir şey kullanın: /android.*(?=mobile)/i.test(navigator.userAgent); Android telefonu tespit etmek için. Ancak bu normal ifade "pahalı" nicelik belirteçleri içerir, bu nedenle Philip'in 2 ayrı testle cevabı daha uygun olabilir.
Vadim P.
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.