在 JavaScript 中检测 Apple Silicon mac

Question

有没有办法在 JavaScript 中检测 Apple Silicon Mac？
中的属性navigator似乎不是很有帮助，例如navigator.platform设置为MacIntel和用户代理完全相同。

原因部分：我有两个版本的软件可用，分别用于 Intel 和 Apple Silicon。询问用户“你的 Mac 是 Apple Silicon 还是 Intel？” 不是很好。

Answer 1

我有一个解决方案，但感觉很脆弱。

检查操作系统，因为 Apple Silicon 仅存在于 10_15 或更高版本中：

navigator.userAgent.match(/OS X 10_([789]|1[01234])/)

使用 webgl 检查 GPU：

var w = document.createElement("canvas").getContext("webgl");
var d = w.getExtension('WEBGL_debug_renderer_info');
var g = d && w.getParameter(d.UNMASKED_RENDERER_WEBGL) || "";
if (g.match(/Apple/) && !g.match(/Apple GPU/)) {
   ...definitely arm...
}

如果您看到 Apple GPU，那么就是 Safari 隐藏了 GPU 以防止指纹识别。深入挖掘能力：

if (w.getSupportedExtensions().indexOf("WEBGL_compressed_texture_s3tc_srgb") == -1) {
  ...probably arm...
}

（我将 MacBook Pro 的功能与新的 M1 Air 进行了比较，发现 Air 上缺少这一功能。其他所有功能都相同。）

我采取的方法是给用户一个选择，但使用此测试来选择默认值。

如果有人有其他想法，可以帮助缩小 M1 的范围，我很乐意尝试......

更新：正如 Romain 在评论中指出的那样，Apple 添加了对 Big Sur 中缺少的扩展的支持，因此现在无法使用（在 Safari 中；它仍然可以在 Chrome 和 Firefox 中使用）。

Answer 2

navigator.userAgentData尽管并非所有浏览器都支持，但现在这是可能的。

\n

await navigator.userAgentData.getHighEntropyValues([\'architecture\'])\n\n{\n  architecture: "arm"\n  brands: [{\xe2\x80\xa6}, {\xe2\x80\xa6}, {\xe2\x80\xa6}],\n  mobile: false,\n  platform: "macOS"\n}\n

\n

https://developer.mozilla.org/en-US/docs/Web/API/NavigatorUAData/getHighEntropyValues

\n