Best way to detect Mac OS X or Windows computers with JavaScript or jQuery

Question

So I'm trying to move a "close" button to the left side when the user is on Mac and the right side when the user is on PC. Now I'm doing it by examining the user agent, but it can be too easily spoofed for reliable OS detection. Is there a surefire way to detect whether the OS on which the browser is running is Mac OS X or Windows? If not, what's better than user agent sniffing?

Answer 1

The window.navigator.platform property is not spoofed when the userAgent string is changed. I tested on my Mac if I change the userAgent to iPhone or Chrome Windows, navigator.platform remains MacIntel.

The property is also read-only

---

I could came up with the following table

Mac Computers

Mac68K Macintosh 68K system.
MacPPC Macintosh PowerPC system.
MacIntel Macintosh Intel system.

iOS Devices

iPhone iPhone.
iPod iPod Touch.
iPad iPad.

---

Modern macs returns navigator.platform == "MacIntel" but to give some "future proof" don't use exact matching, hopefully they will change to something like MacARM or MacQuantum in future.

var isMac = navigator.platform.toUpperCase().indexOf('MAC')>=0;

To include iOS that also use the "left side"

var isMacLike = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);
var isIOS = /(iPhone|iPod|iPad)/i.test(navigator.platform);

var is_OSX = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);
var is_iOS = /(iPhone|iPod|iPad)/i.test(navigator.platform);

var is_Mac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
var is_iPhone = navigator.platform == "iPhone";
var is_iPod = navigator.platform == "iPod";
var is_iPad = navigator.platform == "iPad";

/* Output */
var out = document.getElementById('out');
if (!is_OSX) out.innerHTML += "This NOT a Mac or an iOS Device!";
if (is_Mac) out.innerHTML += "This is a Mac Computer!
";
if (is_iOS) out.innerHTML += "You're using an iOS Device!
";
if (is_iPhone) out.innerHTML += "This is an iPhone!";
if (is_iPod) out.innerHTML += "This is an iPod Touch!";
if (is_iPad) out.innerHTML += "This is an iPad!";
out.innerHTML += "
Platform: " + navigator.platform;

<pre id="out"></pre>