İOS / Android İşletim sistemini algılama

Biraz araştırma yaptım ve bu soru ortaya çıktı, ama istediğim gibi değil. Bir uygulamayı indirmek için bir yer olan bir QR kod açılış olan bir istemci için bir sayfa inşa ediyorum. Bu yüzden bir sayfaya 2 QR kodu yazdırması gerekmiyor, mevcut işletim sistemini (Apple / Android / Diğer [desteklenmiyor]) tespit etmek ve öğelerimı bu değere göre değiştirmek istiyorum.

Ben script "tespitmobilebrowsers" baktım ve bu sadece kullanıcının hiç mobil olup olmadığını söylemeyi amaçlayan, oysa ben kullanıcının hangi işletim sistemi çalıştığını anlamak ve en iyi uygulama sürümünü önermek istiyorum.

Bu soruya benzer bulduğum diğer cevaplar eski veya güvenilmez görünüyordu (Android tablet tarayıcıları için herhangi bir algılama yok), bu yüzden yeni bir şey arıyorum. Bunu nasıl başarabilirim? (Tercihen bu sırayla jQuery - Javascript - PHP kullanarak).

Kullanıcı aracısı dizesini test edebilirsiniz:

/**
 * 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";
}

Çözüm 1: Kullanıcı Aracısı Koklama

Android ve iPhone için:

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

Böğürtlen ve Windows telefonu da dahil olmak üzere tüm mobil cihazları tespit etmek istiyorsanız, bu kapsamlı sürümü kullanabilirsiniz:

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
}

Eksileri : Kullanıcı telefonları dizeleri değişiyor ve yeni telefonlar ve markalar gün geçtikçe güncelleniyor. Bu nedenle, tüm mobil cihazları desteklemek istiyorsanız bu listeyi güncel tutmanız gerekir.

Çözüm 2: Mobil Algılama JS Kütüphanesi

Bunu yapmak için mobil algılama JS kitaplığını kullanabilirsiniz.

Eksileri : Bu JavaScript tabanlı cihaz algılama özellikleri SADECE iPhone, Android ve Palm WebOS cihazları gibi en yeni nesil akıllı telefonlar için kullanılabilir. Bu cihaz algılama özellikleri, eski BlackBerry, PalmOS ve Windows Mobile cihazları da dahil olmak üzere JavaScript desteği yetersiz olan eski akıllı telefonlarda ÇALIŞMAZ.

Bir kullanabilirsiniz navigator.platform tarayıcı yüklü olduğu işletim sistemini almak için.

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

Bu sorun burada zaten çözülmüştür: jQuery'de bir mobil cihazı tespit etmenin en iyi yolu nedir? .

Kabul edilen cevapta, temelde bir iPhone, iPod, Android cihaz veya doğru olacak her şeyi test ediyorlar. Sadece if( /Android/i.test(navigator.userAgent) ) { // some code.. }Android kullanıcı aracıları için örneğin gerçekte geri dönmesini istediklerinizi saklayın .

Ancak, kullanıcı aracıları değiştirilebildiğinden gerçekten güvenilir değildir. En iyi şey, tüm mobil platformlar için evrensel bir şey geliştirmektir.

Ayrıca php üzerinde kullanıcı aracısı ile bunu elde edebilirsiniz:

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

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

exit();

}

Web siteniz için React Js kullanıyorsanız, https://www.npmjs.com/package/react-device-detect kullanın

Ayrıca gereksiniminize göre çalışacak Firbase Dinamik bağlantılar oluşturabilirsiniz. Birden fazla platformu destekler. Bu bağlantı elle veya programlama yoluyla oluşturulabilir. Daha sonra bu bağlantıyı QR koduna gömebilirsiniz.

Hedef uygulama yüklüyse, bağlantı kullanıcıyı uygulamaya yönlendirir. Yüklü değilse Play Store / App store / Yapılandırılan herhangi bir web sitesine yönlendirilir.

Bu ve diğer istemci algılamaları için bu js kütüphanesini öneririm: http://hictech.github.io/navJs/tester/index.html

Özel cevap kullanımınız için:

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

Cordova-cihaz-eklentisini kullanarak,

device.platform

android için "Android" ve pencereler için "windows" olacak. Cihazda ve tarayıcıda simüle ederken çalışır. Cihaz değerlerini görüntüleyecek bir tost:

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