Определить, является ли устройство 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;
}