Phát hiện hệ điều hành iOS / Android

Tôi đã thực hiện một số nghiên cứu, và câu hỏi này đã được đưa ra, nhưng không phải theo cách tôi dự định. Tôi đang xây dựng một trang cho một khách hàng là hạ cánh mã QR, là nơi để tải xuống một ứng dụng. Vì vậy, anh ta không phải in ra 2 mã QR trên một trang, tôi muốn phát hiện hệ điều hành hiện tại (Apple / Android / Khác [không được hỗ trợ]) và sửa đổi các yếu tố của tôi dựa trên giá trị đó.

Tôi đã xem tập lệnh "Detmobilebrowsers" và điều đó chỉ nhằm mục đích cho biết người dùng có di động hay không, trong khi tôi muốn tìm hiểu xem người dùng đang chạy hệ điều hành nào và đề xuất phiên bản ứng dụng tốt nhất.

Các câu trả lời khác mà tôi thấy tương tự như câu hỏi này dường như đã lỗi thời hoặc không đáng tin cậy (không phát hiện ra các trình duyệt máy tính bảng Android), vì vậy tôi đang tìm kiếm một cái gì đó mới. Làm thế nào tôi có thể đạt được điều này? (Tốt nhất là sử dụng jQuery - Javascript - PHP theo thứ tự đó).

Bạn có thể kiểm tra chuỗi tác nhân người dùng:

/**
 * Determine the mobile operating system.
 * This function returns one of 'iOS', 'Android', 'Windows Phone', or 'unknown'.
 *
 * @returns {String}
 */
function getMobileOperatingSystem() {
  var userAgent = navigator.userAgent || navigator.vendor || window.opera;

      // Windows Phone must come first because its UA also contains "Android"
    if (/windows phone/i.test(userAgent)) {
        return "Windows Phone";
    }

    if (/android/i.test(userAgent)) {
        return "Android";
    }

    // iOS detection from: http://stackoverflow.com/a/9039885/177710
    if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
        return "iOS";
    }

    return "unknown";
}

Giải pháp 1: Tác nhân đánh hơi

Dành cho Android và iPhone:

if( /Android|webOS|iPhone|iPad|iPod|Opera Mini/i.test(navigator.userAgent) ) {
 // run your code here
}

Nếu bạn muốn phát hiện tất cả các thiết bị di động bao gồm blackberry và Windows phone thì bạn có thể sử dụng phiên bản toàn diện này:

var deviceIsMobile = false; //At the beginning we set this flag as false. If we can detect the device is a mobile device in the next line, then we set it as true.


if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(navigator.userAgent) 
    || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(navigator.userAgent.substr(0,4))) {
   deviceIsMobile = true;
}

if(deviceIsMobile){
    // run your code here
}

Nhược điểm : Chuỗi đại lý người dùng đang thay đổi và được cập nhật khi điện thoại và thương hiệu mới đang đến từng ngày. Vì vậy, bạn cần cập nhật danh sách này nếu bạn muốn hỗ trợ tất cả các thiết bị di động.

Giải pháp 2: thư viện JS phát hiện di động

Bạn có thể sử dụng thư viện JS phát hiện di động để làm điều này.

Nhược điểm : Các tính năng phát hiện thiết bị dựa trên JavaScript này CHỈ có thể hoạt động cho thế hệ điện thoại thông minh mới nhất, chẳng hạn như các thiết bị iPhone, Android và Palm WebOS. Các tính năng phát hiện thiết bị này có thể KHÔNG hoạt động đối với điện thoại thông minh cũ có hỗ trợ kém cho JavaScript, bao gồm các thiết bị BlackBerry, PalmOS và Windows Mobile cũ hơn.

Người ta có thể sử dụng navigator.pl platform để cài đặt hệ điều hành mà trình duyệt được cài đặt.

function getPlatform() {
   var platform = ["Win32", "Android", "iOS"];

   for (var i = 0; i < platform.length; i++) {

       if (navigator.platform.indexOf(platform[i]) >- 1) {

           return platform[i];
       }
   }
}

getPlatform();

Vấn đề này đã được giải quyết ở đây: Cách tốt nhất để phát hiện thiết bị di động trong jQuery là gì? .

Về câu trả lời được chấp nhận, về cơ bản, họ sẽ kiểm tra xem đó có phải là iPhone, iPod, thiết bị Android hay bất cứ điều gì để trở về đúng không. Chỉ cần giữ những cái bạn muốn chẳng hạnif( /Android/i.test(navigator.userAgent) ) { // some code.. } sẽ chỉ trả về true cho các tác nhân người dùng Android.

Tuy nhiên, tác nhân người dùng không thực sự đáng tin cậy vì chúng có thể được thay đổi. Điều tốt nhất vẫn là phát triển một cái gì đó phổ quát cho tất cả các nền tảng di động.

Bạn cũng có thể đạt được điều này với tác nhân người dùng trên php:

$userAgent = strtolower($_SERVER['HTTP_USER_AGENT']);

if(stripos($userAgent,'android') !== false) { // && stripos($userAgent,'mobile') !== false) {
  header('Location: http://oursite.com/download/yourApp.apk');

exit();

}

Nếu bạn đang sử dụng React Js cho trang web của mình, hãy sử dụng https://www.npmjs.com/package/react-device-detect

Bạn cũng có thể tạo các liên kết Firbase Dynamic sẽ hoạt động theo yêu cầu của bạn. Nó hỗ trợ nhiều nền tảng. Liên kết này có thể được tạo ra, bằng tay cũng như thông qua lập trình. Sau đó, bạn có thể nhúng liên kết này vào mã QR.

Nếu ứng dụng đích được cài đặt, liên kết sẽ chuyển hướng người dùng đến ứng dụng. Nếu không được cài đặt, nó sẽ chuyển hướng đến Play Store / App store / Bất kỳ trang web nào được cấu hình khác.

Đối với điều này và các loại phát hiện khách hàng khác, tôi đề nghị thư viện js này: http://hictech.github.io/navJs/tester/index.html

Đối với câu trả lời cụ thể của bạn sử dụng:

navJS.isIOS() || navJS.isAndroid()

Sử dụng plugin cordova-device-plugin, bạn có thể phát hiện

device.platform

sẽ là "Android" cho Android và "windows" cho windows. Hoạt động trên thiết bị và khi mô phỏng trên trình duyệt. Đây là một bánh mì nướng sẽ hiển thị các giá trị thiết bị:

    window.plugins.toast.showLongTop(
    'Cordova:     ' + device.cordova + '\n' +
    'Model:       ' + device.model + '\n' +
    'Platform:    ' + device.platform + '\n' +
    'UUID:        ' + '\n' +
                      device.uuid + '\n' +
    'Version:     ' + device.version + '\n' +
    'Manufacturer ' + device.manufacturer + '\n' +
    'isVirtual    ' + device.isVirtual + '\n' +
    'Serial       ' + device.serial);