Определить, является ли устройство iOS

Мне интересно, можно ли определить, работает ли браузер на iOS, подобно тому, как вы можете обнаруживать функции с помощью Modernizr (хотя это, очевидно, обнаружение устройств, а не обнаружение функций).

обычно я бы предпочел обнаружение функций, но мне нужно выяснить, является ли устройство iOS из-за того, как они обрабатывают видео в соответствии с этим вопросом YouTube API не работает с iPad / iPhone / не Флэш-устройства

11 ответов


обнаружение iOS

я не поклонник нюхания агента пользователя, но вот как вы это сделаете:

var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;

другой способ-полагаться на navigator.platform:

var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);

iOS будет true или false

почему не MSStream

Microsoft ввела слово iPhone в для того, чтобы попытаться обмануть Gmail как-то. Поэтому мы должны исключить его. Больше информации об этом здесь и здесь.

ниже обновлено IE11 userAgent (Internet Explorer для Windows Phone 8.1 обновление):

Mozilla / 5.0 (мобильный; Windows Phone 8.1; Android 4.0; ARM; Trident / 7.0; Касания; РВ:11.0; IEMobile/11.0; Nokia; а и Lumia 930), как iPhone 7_0_3 ОС Mac OS X AppleWebKit/537 (KHTML, как и Gecko) мобильное сафари / 537


легко добавить больше устройств, без использования обычных Выражения:

function iOS() {

  var iDevices = [
    'iPad Simulator',
    'iPhone Simulator',
    'iPod Simulator',
    'iPad',
    'iPhone',
    'iPod'
  ];

  if (!!navigator.platform) {
    while (iDevices.length) {
      if (navigator.platform === iDevices.pop()){ return true; }
    }
  }

  return false;
}

iOS() будет true или false

Примечание: и navigator.userAgent и navigator.platform может быть подделан пользователем или расширением браузера.


обнаружение версии iOS

наиболее распространенным способом обнаружения версии iOS является синтаксический анализ из строки агента пользователя. Но есть и характеристика определение вывод*;

мы точно знаем, что history API представил в под управлением ios4 - matchMedia API на на iOS5 - webAudio API на в iOS6 - WebSpeech API на с iOS7 и так далее..

Примечание: следующий код не является надежным и сломается, если какая-либо из этих функций HTML5 устарела в новой версии iOS. Вас предупредили!

function iOSversion() {

  if (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) {
    if (!!window.indexedDB) { return 'iOS 8 and up'; }
    if (!!window.SpeechSynthesisUtterance) { return 'iOS 7'; }
    if (!!window.webkitAudioContext) { return 'iOS 6'; }
    if (!!window.matchMedia) { return 'iOS 5'; }
    if (!!window.history && 'pushState' in window.history) { return 'iOS 4'; }
    return 'iOS 3 or earlier';
  }

  return 'Not an iOS device';
}

Если вы используете Modernizr, вы можете добавить пользовательское тестирование.

не имеет значения, какой режим обнаружения вы решили использовать (userAgent, navigator.поставщик или навигатор.платформа), вы всегда можете обернуть его для более легкого использования позже.

//Add Modernizr test
Modernizr.addTest('isios', function() {
    return navigator.userAgent.match(/(iPad|iPhone|iPod)/g);
});

//usage
if (Modernizr.isios) {
    //this adds ios class to body
    Modernizr.prefixed('ios');
} else {
    //this adds notios class to body
    Modernizr.prefixed('notios');
}

существует этот пользовательский Modernizr тесты:https://gist.github.com/855078


Это устанавливает переменную _iOSDevice to правда или false

_iOSDevice = !!navigator.platform.match(/iPhone|iPod|iPad/);

пользовательские агенты на устройствах iOS говорят iPhone или iPad в них. Я просто фильтрую по этим ключевым словам.


упрощенная, легкая для того чтобы расширить версию.

var iOS = ['iPad', 'iPhone', 'iPod'].indexOf(navigator.platform) >= 0;

Я написал это пару лет назад, но я верю, что он все еще работает:

if(navigator.vendor != null && navigator.vendor.match(/Apple Computer, Inc./) && navigator.userAgent.match(/iPhone/i) || (navigator.userAgent.match(/iPod/i))) 

    {

        alert("Ipod or Iphone");

    }

else if (navigator.vendor != null && navigator.vendor.match(/Apple Computer, Inc./) && navigator.userAgent.match(/iPad/i))  

    {

        alert("Ipad");

    }

else if (navigator.vendor != null && navigator.vendor.match(/Apple Computer, Inc./) && navigator.userAgent.indexOf('Safari') != -1)

    {

        alert("Safari");

    }

else if (navigator.vendor == null || navigator.vendor != null)

    {

        alert("Not Apple Based Browser");

    }

по возможности при добавлении тестов Modernizr вы должны добавить тест для функции, а не устройства или операционной системы. Нет ничего плохого в добавлении десяти тестов для тестирования iPhone, если это то, что нужно. Некоторые вещи просто не могут быть обнаружены.

    Modernizr.addTest('inpagevideo', function ()
    {
        return navigator.userAgent.match(/(iPhone|iPod)/g) ? false : true;
    });

например, на iPhone (а не iPad) видео не может быть воспроизведено встроенным на веб-странице, он открывает полный экран. Поэтому я создал тест "no-inpage-video"

вы можете использовать это в css (Modernizr добавляет класс .no-inpagevideo до <html> - тег, если тест не пройден)

.no-inpagevideo video.product-video 
{
     display: none;
}

это скроет видео на iPhone (то, что я на самом деле делаю в этом случае, показывает альтернативное изображение с onclick для воспроизведения видео - я просто не хочу, чтобы видео-плеер по умолчанию и кнопка воспроизведения показывались).


Вау, здесь много длинного хитрого кода. Будь проще, пожалуйста!

это ИМХО быстро, сохранить и хорошо работает:

 iOS = /^iP/.test(navigator.platform);

 // or, more future-proof (in theory, probably not in practice):

 iOS = /^iP(hone|[ao]d)/.test(navigator.platform);

 // or, if you prefer readability:

 iOS = /^(iPhone|iPad|iPod)/.test(navigator.platform);
  • это быстрее, потому что регулярное выражение проверяет ^starting положение строки платформы сначала и останавливается, если нет " iP "(быстрее, чем поиск длинной строки UA до конца в любом случае)
  • это безопаснее, чем проверка UA (при условии навигатора.платформа менее вероятно подделана)
  • обнаруживает iPhone / iPad Simulator

чтобы обнаружить версию iOS, нужно уничтожить пользовательский агент с помощью кода Javascript следующим образом:

 var res = navigator.userAgent.match(/; CPU.*OS (\d_\d)/);
    if(res) {
        var strVer = res[res.length-1];
        strVer = strVer.replace("_", ".");
        version = strVer * 1;
    }

var isiOSSafari = (navigator.userAgent.match(/like Mac OS X/i)) ? true: false;