Phát hiện điện thoại Android qua Javascript / jQuery


122

Làm cách nào để tôi phát hiện ra rằng thiết bị đang sử dụng là Android cho một trang web di động?

Tôi cần áp dụng một số thuộc tính css nhất định cho nền tảng Android.

Cảm ơn

Câu trả lời:


223

Hãy xem đó: 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();
}

Chỉnh sửa : Như đã chỉ ra trong một số nhận xét, điều này sẽ hoạt động trong 99% trường hợp, nhưng một số trường hợp cạnh không được bảo vệ. Nếu bạn cần một giải pháp nâng cao và chống đạn hơn nhiều trong JS, bạn nên sử dụng platform.js: https://github.com/bestiejs/platform.js


5
cũng đừng quên kiểm tra máy tính bảng Android: googlewebmastercentral.blogspot.com/2011/03/…

2
Cần lưu ý rằng điều này không phải lúc nào cũng hoạt động đối với các thiết bị Android, chẳng hạn như các tác nhân người dùng được báo cáo bởi thiết bị Kindle Fire HD hoàn toàn không chứa từ 'android'.
djbp

3
Cách tiếp cận Navigator.userAgent không hoạt động trên các thiết bị samsung galaxy. Không có 'Android' trong thông số trình duyệt.
AsafK

2
Hai dòng đầu tiên của giải pháp JS có thể được đơn giản hóa để:var isAndroid = /Android/i.test(navigator.userAgent)
Dave Koo

4
Giải pháp của bạn không hoạt động. Đây là đại lý người dùng Nokia Lumia. Và đoán xem? nó khớp như 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


2

Tôi nghĩ câu trả lời của Michal là tốt nhất, nhưng chúng ta có thể tiến thêm một bước nữa và tải động một CSS Android theo câu hỏi ban đầu:

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
Tại sao bạn muốn làm điều đó, trong khi bạn có thể sử dụng các truy vấn phương tiện? Tính năng phát hiện thiết bị JS chỉ nhằm mục đích nâng cao, chẳng hạn như thêm lời mời cài đặt ứng dụng của bạn. Kết xuất trang không bao giờ nên dựa vào nó vì bạn sẽ gặp vấn đề về hiệu suất và trải nghiệm khả năng sử dụng tồi tệ.
camilokawerin

1
@camilokawerin Phản hồi của bạn nên được chuyển đến tác giả. Tôi chỉ đơn giản là cung cấp câu trả lời cho câu hỏi của anh ấy. Có những trường hợp bạn muốn CSS dành riêng cho nền tảng. Ví dụ: nếu bạn muốn phong cách trực quan của giao diện phù hợp với thiết bị.
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

phiên bản js, bắt được iPad quá:

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

3
Không hoạt động vì nó bắt được nhiều thiết bị, không chỉ Android như câu hỏi yêu cầu.
NickG

1
Sử dụng ít nhất một cái gì đó như sau: /android.*(?=mobile)/i.test(navigator.userAgent); để phát hiện điện thoại Android. Nhưng regex này chứa các định lượng "đắt tiền", vì vậy câu trả lời của Philip với 2 phép thử riêng biệt có thể phù hợp hơn.
Vadim P.
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.