Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
427 views
in Technique[技术] by (71.8m points)

javascript - 检测设备是否为iOS(Detect if device is iOS)

I'm wondering if it's possible to detect whether a browser is running on iOS, similar to how you can feature detect with Modernizr (although this is obviously device detection rather than feature detection).

(我想知道是否有可能检测浏览器是否在iOS上运行,这与使用Modernizr进行功能检测的方式类似(尽管这显然是设备检测而非功能检测)。)

Normally I would favour feature detection instead, but I need to find out whether a device is iOS because of the way they handle videos as per this question YouTube API not working with iPad / iPhone / non-Flash device

(通常,我宁愿使用功能检测,但我需要根据该问题确定设备是否为iOS,因为它们处理视频的方式YouTube API不适用于iPad / iPhone /非Flash设备)

  ask by SparrwHawk translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Detecting iOS(检测iOS)

I am not a fan of User Agent sniffing, but here is how you would do it:

(我不喜欢User Agent嗅探,但是您可以按照以下方式进行:)

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

Another way is relying on navigator.platform :

(另一种方法是依靠navigator.platform :)

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

iOS will be either true or false

(iOS将是true还是false)

Why not MSStream(为什么不使用MSStream)

Microsoft injected the word iPhone in IE11's userAgent in order to try and fool Gmail somehow.

(微软在IE11的userAgent中添加了iPhone一词,以试图以某种方式欺骗Gmail。)

Therefore we need to exclude it.

(因此,我们需要排除它。)

More info about this here and here .

(关于这方面更多的信息在这里这里 。)

Below is IE11's updated userAgent (Internet Explorer for Windows Phone 8.1 Update):

(以下是IE11的更新的userAgent (用于Windows Phone 8.1更新的Internet Explorer):)

Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Touch; rv:11.0; IEMobile/11.0; NOKIA; Lumia 930) like iPhone OS 7_0_3 Mac OS X AppleWebKit/537 (KHTML, like Gecko) Mobile Safari/537

(Mozilla / 5.0(移动; Windows Phone 8.1; Android 4.0; ARM; Trident / 7.0;触摸; rv:11.0; IEMobile / 11.0; NOKIA; Lumia 930),例如iPhone OS 7_0_3 Mac OS X AppleWebKit / 537(KHTML,例如Gecko)移动版Safari / 537)


Easily add more devices, without using Regular Expressions:

(无需使用正则表达式即可轻松添加更多设备:)

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() will be either true or false

(iOS()将为truefalse)

Note: Both navigator.userAgent and navigator.platform can be faked by the user or a browser extension.

(注意:用户或浏览器扩展都可以伪造navigator.userAgentnavigator.platform 。)


Detecting iOS version(检测iOS版本)

The most common way of detecting the iOS version is by parsing it from the User Agent string .

(检测iOS版本的最常见方法是通过User Agent字符串进行解析 。)

But there is also feature detection inference * ;

(但是也有特征 检测 推论 * ;)

We know for a fact that history API was introduced in iOS4 - matchMedia API in iOS5 - webAudio API in iOS6 - WebSpeech API in iOS7 and so on..

(我们知道一个事实,即history APIiOS4的介绍- matchMedia APIiOS5中 - webAudio APIiOS6的 - WebSpeech APIiOS7等..)

Note: The following code is not reliable and will break if any of these HTML5 features is deprecated in a newer iOS version.

(注意:以下代码不可靠,如果在更新的iOS版本中不赞成使用这些HTML5功能,则这些代码将中断。)

You have been warned!

(你被警告了!)

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';
}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...