Определение операционной системы iOS / Android

186

Я провел некоторое исследование, и этот вопрос возник, но не так, как я намереваюсь. Я создаю страницу для клиента с посадкой QR-кода, где можно загрузить приложение. Поэтому ему не нужно распечатывать 2 QR-кода на странице, я хотел бы определить текущую операционную систему (Apple / Android / Other [не поддерживается]) и изменить мои элементы на основе этого значения.

Я посмотрел на скрипт «detectmobilebrowsers», и он просто нацелен на то, чтобы сказать, является ли пользователь мобильным или нет, тогда как я хотел бы выяснить, в какой операционной системе работает пользователь, и предложить лучшую версию приложения.

Другие ответы, которые я нашел похожими на этот вопрос, казались либо устаревшими, либо ненадежными (не обнаруживается для браузеров на планшетах Android), поэтому я в поиске чего-то нового. Как мне этого добиться? (Предпочтительно использовать jQuery - Javascript - PHP в этом порядке).

Александр Лозада
источник
2
Пользовательский агент не говорит вам, что вам нужно знать?
Бабак Наффас
2
Эта проблема уже решена здесь: stackoverflow.com/questions/3514784/…
gretro
1
@gretro, который описывает, является ли пользователь мобильным, а не операционной системой, на которой он работает. Бабак, будет ли что-то вроде navigator.platform решением? Я не знаком с пользовательскими агентами. Как я могу убедиться, что он будет работать на всех устройствах Android независимо от версии?
Александр Лозада
Не существует гарантированного способа его обнаружения, поскольку пользовательский агент - единственное, на что вы можете перейти. Проверьте здесь для получения дополнительной информации ... whatsmyos.com
Восстановите Монику Челлио
2
@ Александр Лозада: На принятом ответе они в основном проверяют, является ли это iPhone, iPod, устройство Android или что-то еще, чтобы вернуть истину. Просто оставьте те, которые вы хотите, например if( /Android/i.test(navigator.userAgent) ) { // some code.. }, вернет true только для пользовательских агентов Android.
Гретро

Ответы:

389

Вы можете проверить строку агента пользователя:

/**
 * 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";
}
feeela
источник
И ОП может посмотреть этот список на случай, если ваш тест нуждается в доработке
Хуан Мендес,
3
Потрясающие. Используя мобильный режим Chrome, вы можете протестировать его в настольных браузерах.
DaFunkyAlex
4
@feeela иногда это что-то вроде установки apks, которую невозможно обнаружить.
Даниэль Любаров
2
Я добавил else if (userAgent.match(/Windows Phone/i)) { return 'WindowsPhone'; } до Android еще, если для обнаружения Windows Phone. Пока, кажется, работает нормально.
Артур
4
От stackoverflow.com/a/9039885/177710 : при проверке iOSмы должны также проверить, !window.MSStreamчтобы IE11 не считался iOS;-)
Оливер
12

Решение 1. Пользовательский агент нюхает

Для Android и iPhone:

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

Если вы хотите обнаружить все мобильные устройства, включая Blackberry и Windows Phone, вы можете использовать эту полную версию:

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
}

Минусы : Строки агента пользователя меняются и обновляются по мере появления новых телефонов и брендов с каждым днем. Поэтому вам нужно обновлять этот список, если вы хотите поддерживать все мобильные устройства.

Решение 2: библиотека JS для мобильного обнаружения

Вы можете использовать мобильную библиотеку JS для обнаружения для .

Минусы : эти функции обнаружения устройств на основе JavaScript могут работать ТОЛЬКО для смартфонов новейшего поколения, таких как устройства iPhone, Android и Palm WebOS. Эти функции обнаружения устройств могут НЕ работать для более старых смартфонов с плохой поддержкой JavaScript, включая старые устройства BlackBerry, PalmOS и Windows Mobile.

Иман Седиги
источник
4

Можно использовать navigator.platform, чтобы получить операционную систему, на которой установлен браузер.

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();
АКАШ ХАТРИ
источник
13
На Samsung Galaxy Grand Prime, который я сейчас тестирую, navigator.platform возвращает '' Linux armv7l ''
mico
3

Эта проблема уже решена здесь: Каков наилучший способ обнаружения мобильного устройства в jQuery? ,

На принятом ответе они в основном проверяют, является ли это iPhone, iPod, устройство Android или что-то еще, чтобы вернуть истину. Просто оставьте те, которые вы хотите, напримерif( /Android/i.test(navigator.userAgent) ) { // some code.. } , вернет true только для пользовательских агентов Android.

Тем не менее, пользовательские агенты не очень надежны, так как они могут быть изменены. Лучше всего разработать нечто универсальное для всех мобильных платформ.

gretro
источник
Если это в jQuery, чем это отличается от ванильного JS. С таким же успехом это может быть в C.
Алекс Джон
2

Вы также можете добиться этого с помощью пользовательского агента на 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();

}

Хамед Яранди
источник
2

Если вы используете React Js для вашего сайта, используйте https://www.npmjs.com/package/react-device-detect

Kira
источник
4
Обратите внимание, что это немного сложный импорт (~ 23 КБ) только для проверки iOS против Android.
jessepinho
@jessepinho: правда. Оглядываясь назад, я бы не стал делать так, чтобы мой строй был легким. Но это помогло заставить вещи работать.
Кира
1

Вы также можете создавать динамические ссылки Firbase которые будут работать в соответствии с вашими требованиями. Он поддерживает несколько платформ. Эту ссылку можно создать как вручную, так и с помощью программирования. Затем вы можете вставить эту ссылку в QR-код.

Если целевое приложение установлено, ссылка перенаправит пользователя в приложение. Если он не установлен, он будет перенаправлен в Play Store / App store / любой другой настроенный веб-сайт.

Сагар
источник
1

Для этого и других видов обнаружения клиентов я предлагаю эту библиотеку js: http://hictech.github.io/navJs/tester/index.html

Для вашего конкретного ответа используйте:

navJS.isIOS() || navJS.isAndroid()
Марко Аллори
источник
0

Используя cordova-device-plugin, вы можете обнаружить

device.platform

будет «Android» для Android и «Windows» для Windows. Работает на устройстве и при моделировании в браузере. Вот тост, который будет отображать значения устройства:

    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);
pollaris
источник