Skip to main content
Participant
May 3, 2018
Answered

iOS detection(html5/Canvas)

  • May 3, 2018
  • 1 reply
  • 909 views

Hello,

I'm currently looking for a way to detect if a user is accessing my content using an iOS device. I've been having issues related to iOS' audio streaming limitations. My ultimate goal is to detect if iOS is being used, then disable the audio if true. If anyone could help or point me in the right direction that would be greatly appreciated.

This topic has been closed for replies.
Correct answer dylanp3259

Here's the code that I got working!

Posted to help future wanderers of the forum wasteland.

//Browser Test----------------------------------------------------------------------

var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

var isFirefox = typeof InstallTrigger !== 'undefined';

var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);

var isIE = /*@cc_on!@*/false || !!document.documentMode;

var isEdge = !isIE && !!window.StyleMedia;

var isChrome = !!window.chrome && !!window.chrome.webstore;

var isBlink = (isChrome || isOpera) && !!window.CSS;

/* Results: */

console.log("isOpera", isOpera);

console.log("isFirefox", isFirefox);

console.log("isSafari", isSafari);

console.log("isIE", isIE);

console.log("isEdge", isEdge);

console.log("isChrome", isChrome);

console.log("isBlink", isBlink);

1 reply

Legend
May 3, 2018

The streaming limitations are imposed by the browser, not the operating system. So what you really want is to detect which browser you're running in.

This is the code I use to detect common mobile browsers:

var ua = navigator.userAgent;

var isAndroidChrome = /Chrome\/[\d\.]+.*Mobile/.test(ua);

var isIosChrome = /CriOS/.test(ua);

var isIosSafari = /(iPod|iPad|iPhone)+.*AppleWebKit.+Version\/[\d\.]+.*Safari/.test(ua);

Caveat: I've been using this code unchanged for about four years now, so it may or may not still be correct.

Participant
May 3, 2018

Now would I be able to just drop this code into Animate(canvas)?

dylanp3259AuthorCorrect answer
Participant
May 7, 2018

Here's the code that I got working!

Posted to help future wanderers of the forum wasteland.

//Browser Test----------------------------------------------------------------------

var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

var isFirefox = typeof InstallTrigger !== 'undefined';

var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);

var isIE = /*@cc_on!@*/false || !!document.documentMode;

var isEdge = !isIE && !!window.StyleMedia;

var isChrome = !!window.chrome && !!window.chrome.webstore;

var isBlink = (isChrome || isOpera) && !!window.CSS;

/* Results: */

console.log("isOpera", isOpera);

console.log("isFirefox", isFirefox);

console.log("isSafari", isSafari);

console.log("isIE", isIE);

console.log("isEdge", isEdge);

console.log("isChrome", isChrome);

console.log("isBlink", isBlink);