使用 JavaScript 或 jQuery 检测 Mac OS X 或 Windows 计算机的最佳方法答案

【问题标题】：Best way to detect Mac OS X or Windows computers with JavaScript or jQuery使用 JavaScript 或 jQuery 检测 Mac OS X 或 Windows 计算机的最佳方法
【发布时间】：2012-05-10 05:26:42
【问题描述】：

因此，当用户使用 Mac 时，我尝试将“关闭”按钮移动到左侧，而当用户使用 PC 时，我尝试将“关闭”按钮移动到右侧。现在我通过检查用户代理来做到这一点，但它很容易被欺骗而无法进行可靠的操作系统检测。是否有可靠的方法来检测运行浏览器的操作系统是 Mac OS X 还是 Windows？如果没有，还有什么比用户代理嗅探更好的呢？

【问题讨论】：

如果用户操纵了useragent，那不是他或她的问题吗？当你让他们有一个无效的用户代理（例如，当它让他们访问你不希望他们拥有的东西时）伤害他们时，我会担心它，但是对于这样的事情，为什么你有压力吗？让他们在脚上开枪，必须承担后果 - 伙计，不要流汗。
嗯，与其说是答案，不如说更像是一个提示。您可以使用条件 cmets 检测 IE。这是对 Windows 检测库的 +1。但如果 IE 在另一个操作系统（如 Linux 上的 Wine）的模拟器中运行，这将失败。对了，linux呢？
@MahmoudAl-Qudsi 即使没有欺骗，移动版 Firefox 也经常伪装成 Safari，Opera 在某些版本中经常伪装成 Firefox。如果不进行欺骗，用户代理仍然非常不可靠。
可能重复：stackoverflow.com/q/7044944/55209
但这个问题的答案只是“用户代理”。

标签： javascript jquery

【解决方案1】：

更改 userAgent 字符串时，window.navigator.platform 属性不会被欺骗。如果我将 userAgent 更改为 iPhone 或 Chrome Windows，我在我的 Mac 上进行了测试，navigator.platform 仍然是 MacIntel。

该属性也是只读的

我可以想出下表

Mac 电脑

Mac68K Macintosh 68K 系统。
MacPPC Macintosh PowerPC 系统。
MacIntel Macintosh Intel 系统。

iOS 设备

iPhone iPhone。
iPod iPod Touch。
iPad iPad。

现代 mac 返回 navigator.platform == "MacIntel"，但为了提供一些“未来证明”，不要使用精确匹配，希望它们将来会更改为 MacARM 或 MacQuantum。

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

包括也使用“左侧”的 iOS

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!\n";
if (is_iOS) out.innerHTML += "You're using an iOS Device!\n";
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 += "\nPlatform: " + navigator.platform;

&lt;pre id="out"&gt;&lt;/pre&gt;

由于大多数操作系统使用右侧的关闭按钮，当用户在 MacLike OS 上时，您可以将关闭按钮向左移动，否则将其放在最常见的一侧，即右侧是没有问题的。

setTimeout(test, 1000); //delay for demonstration

function test() {

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

  if (mac) {
    document.getElementById('close').classList.add("left");
  }
}

#window {
  position: absolute;
  margin: 1em;
  width: 300px;
  padding: 10px;
  border: 1px solid gray;
  background-color: #DDD;
  text-align: center;
  box-shadow: 0px 1px 3px #000;
}
#close {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 22px;
  height: 22px;
  margin: -12px;
  box-shadow: 0px 1px 3px #000;
  background-color: #000;
  border: 2px solid #FFF;
  border-radius: 22px;
  color: #FFF;
  text-align: center;
  font: 14px"Comic Sans MS", Monaco;
}
#close.left{
  left: 0px;
}

<div id="window">
  <div id="close">x</div>
  <p>Hello!</p>
  <p>If the "close button" change to the left side</p>
  <p>you're on a Mac like system!</p>
</div>

http://www.nczonline.net/blog/2007/12/17/don-t-forget-navigator-platform/

【讨论】：

@Vitim.us 非常感谢您的详细回答，您真的拯救了我的一天 :)
MacQuantum 成就了我的一天。 ?
@Qix 更好的改进是将str.match(regexp) ? true : false 替换为regexp.test(string)。 RegExp.prototype.test() 方法本身返回一个布尔值。因此，我的首选代码是const platformIsMacLike = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);。
自 2019 年以来 iPad（即 iPadOS）认为他们是 MacIntel :rolleyes:
请注意，此属性为 now considered obsolete，并计划在任何时间被任何浏览器删除，因此这不再是正确答案，并且作为高度赞成的答案可能应该更新以解释如何在 navigator.platform 不再存在的世界中检测平台。

【解决方案2】：

就这么简单：

function isMacintosh() {
  return navigator.platform.indexOf('Mac') > -1
}

function isWindows() {
  return navigator.platform.indexOf('Win') > -1
}

【讨论】：

嗯，这涵盖了两个操作系统。这是一个更全面（但可能仍然不完整）的列表，其中包括 Linux、BSD、Android、Palm、Sony Playstation 等：stackoverflow.com/questions/19877924/…
如果你想覆盖更多的操作系统，那么你应该去像Platform.js这样的库：github.com/bestiejs/platform.js
@BennyNeugebauer isPC 不应等于 !isMacintosh();。如果用户在 linux 或任何其他不同的平台上怎么办？它会检测到它们不在mac上，并认为它们在PC上。
@DrorBar startsWith 方法是在 ECMAScript 2015（第 6 版）中引入的。如果您希望检查在不支持 ES6 的浏览器中工作，则必须使用 indexOf（它具有更广泛的兼容性）。
请注意，navigator.platform 不再是 Web 标准的一部分，因此这可能需要进行编辑以说明虽然这在 2015 年有效，但它不再是正确的解决方案。

【解决方案3】：

这就是你要找的吗？否则，请告诉我，我将删除此帖子。

试试这个 jQuery 插件：http://archive.plugins.jquery.com/project/client-detect

演示： http://www.stoimen.com/jquery.client.plugin/

这是一个基于 quirksmode BrowserDetect 的 jQuery 浏览器/操作系统检测插件。

热心读者：
http://www.stoimen.com/blog/2009/07/16/jquery-browser-and-os-detection-plugin/
http://www.quirksmode.org/js/support.html

更多关于插件的代码在这里：http://www.stoimen.com/jquery.client.plugin/jquery.client.js

【讨论】：

老兄！我欺骗了我的用户代理，它仍然在 Mac 版 Safari 上检测到我！谢谢 BRUV。
@JacksonGariety 不用担心 bruv :)) 在这里阅读更多详细信息有整个代码树脂 :) stoimen.com/jquery.client.plugin/jquery.client.js 祝你有个愉快的 brosniac :) 干杯！
@Derek hiya bruv - 它使用 quirkmode 浏览器插件并检测浏览器/操作系统，请参阅此处 quirksmode.org/js/detect.html 并进一步参阅 stoimen.com/jquery.client.plugin/jquery.client.js 和 quirksmode.org/js/support.html 希望这有意义 bruv :)
没关系，这似乎只是在使用用户代理......这有点糟糕。
不是我正在寻找的答案。有可能吗？

【解决方案4】：

你可以测试一下：

function getOS() {
  let userAgent = window.navigator.userAgent.toLowerCase(),
    macosPlatforms = /(macintosh|macintel|macppc|mac68k|macos)/i,
    windowsPlatforms = /(win32|win64|windows|wince)/i,
    iosPlatforms = /(iphone|ipad|ipod)/i,
    os = null;

  if (macosPlatforms.test(userAgent)) {
    os = "macos";
  } else if (iosPlatforms.test(userAgent)) {
    os = "ios";
  } else if (windowsPlatforms.test(userAgent)) {
    os = "windows";
  } else if (/android/.test(userAgent)) {
    os = "android";
  } else if (!os && /linux/.test(userAgent)) {
    os = "linux";
  }

  return os;
}

document.getElementById('your-os').textContent = getOS();

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
        <h1 id="your-os"></h1>
  </body>
</html>

【讨论】：

【解决方案5】：

为了完成：Some browsers 支持navigator.userAgentData.platform，这是一个只读属性。

console.log(navigator.userAgentData.platform);
// macOs

请注意Navigator.platform is deprecated。

【讨论】：

【解决方案6】：

让我知道这是否有效。在 StackOverflow.com 的帮助下检测 Apple 设备（Mac 电脑、iPhone 等）的方法：
What is the list of possible values for navigator.platform as of today?

var deviceDetect = navigator.platform;
var appleDevicesArr = ['MacIntel', 'MacPPC', 'Mac68K', 'Macintosh', 'iPhone', 
'iPod', 'iPad', 'iPhone Simulator', 'iPod Simulator', 'iPad Simulator', 'Pike 
v7.6 release 92', 'Pike v7.8 release 517'];

// If on Apple device
if(appleDevicesArr.includes(deviceDetect)) {
    // Execute code
}
// If NOT on Apple device
else {
    // Execute code
}

【讨论】：

【解决方案7】：

我认为无论硬件架构如何，所有基于 Chrome 或 Chromium 的浏览器都会在 macOS 平台上返回 MacIntel。

Check the Chromium Source code for further details.

【讨论】：