使用 JavaScript 或 jQuery 检测 MacOSX 或 Windows 计算机的最佳方法

所以我尝试移动一个“关闭”按钮到左侧当用户在 Mac 上和右侧当用户在 PC 上。现在我通过检查用户代理来完成这项工作,但是它太容易受到欺骗,无法进行可靠的操作系统检测。有没有一个万无一失的方法来检测运行浏览器的操作系统是 Mac OS X 还是 Windows?如果没有,还有什么比用户代理嗅探更好的呢?

132862 次浏览

这是你正在寻找的吗? 否则,让我知道,我会删除这个职位。

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

演示: < a href = “ http://www.stoimen.com/jquery.client.plugin/”rel = “ nofollow noReferrer”> http://www.stoimen.com/jquery.client.plugin/

这是基于离奇模式 BrowserDetect 的 jQuery 浏览器/os 检测插件。

对于热心的读者:
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

当 userAgent 字符串更改时,不欺骗 窗口,导航器,平台属性。 我在 Mac 上测试过,如果我将 userAgent 更改为 iPhone 或 Chrome Windows,领航员,平台仍然是 MacIntel。

navigator.platform is not spoofed when the userAgent string is changed

该属性也是 只读

navigator.platform is read-only


我能想出下面这张表

Mac 电脑

Mac68K Macintosh 68K 系统。
MacPPC < em > Macintosh PowerPC 系统。
麦金塔英特尔系统。
MacIntel < em > 苹果硅(ARM)

IOS 设备

iPhone IPhone.
IPodTouch.
平板电脑。


现代的 mac 返回 navigator.platform == "MacIntel",但是为了给一些“未来的证明”不使用精确匹配,希望他们将来会变成像 MacARMMacQuantum这样的东西。

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;
<pre id="out"></pre>


Since most O.S. use the close button on the right, you can just move the close button to the left when the user is on a MacLike O.S., otherwise isn't a problem if you put it on the most common side, the right.

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/

就这么简单:

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


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

Stackoverflow.com的帮助下检测苹果设备(Mac 电脑,iPhone 等)的方法:
到目前为止,Navator.Platform 的可能值列表是什么?

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
}

我认为所有基于 Chrome 或 Chromium 的浏览器都会在 macOS 平台上返回 MacIntel,而不考虑硬件架构。

有关详细信息,请查看 Chromium Source 代码。

完成: 一些浏览器支持 navigator.userAgentData.platform,这是一个只读属性。

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

请注意,Navigator.platform 不推荐

你可以试试这个:

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>

正如前面的答案中所提到的,不推荐使用 Navator.Platform。 我们应该使用 Navator.userAgentData,但它仍然缺乏支持(firefox,safari 在2022年不支持它)。

注意,userAgentData 只能通过 https 在兼容的浏览器上工作。

这里有一个脚本,它将使用 UserAgentData,同时回到旧的执行方法。

function get_platform() {
// 2022 way of detecting. Note : this userAgentData feature is available only in secure contexts (HTTPS)
if (typeof navigator.userAgentData !== 'undefined' && navigator.userAgentData != null) {
return navigator.userAgentData.platform;
}
// Deprecated but still works for most of the browser
if (typeof navigator.platform !== 'undefined') {
if (typeof navigator.userAgent !== 'undefined' && /android/.test(navigator.userAgent.toLowerCase())) {
// android device’s navigator.platform is often set as 'linux', so let’s use userAgent for them
return 'android';
}
return navigator.platform;
}
return 'unknown';
}


let platform = get_platform().toLowerCase();


let isOSX = /mac/.test(platform); // Mac desktop
let isIOS = ['iphone', 'ipad', 'ipod'].indexOf(platform); // Mac iOs
let isApple = isOSX || isIOS; // Apple device (desktop or iOS)
let isWindows = /win/.test(platform); // Windows
let isAndroid = /android/.test(platform); // Android
let isLinux = /linux/.test(platform); // Linux