前端如何在 Chrome 中最大限度收集硬件信息

在 Chrome 这样的现代浏览器里，想直接获取用户的“真实硬件信息”（例如 CPU 型号、显卡型号、主板信息、序列号等）是非常受限制的，因为浏览器为了防止指纹追踪和隐私泄露，故意屏蔽或模糊了很多硬件细节。

1. 前端（纯浏览器 JavaScript）能获取到的硬件信息

纯 JS 在浏览器沙箱里，只能拿到一些有限信息，比如：

console.log(navigator.userAgent);            // 浏览器和系统大致信息
console.log(navigator.platform);             // 平台信息（Windows/Mac/Linux）
console.log(navigator.hardwareConcurrency);  // CPU 逻辑核心数
console.log(navigator.deviceMemory);         // 设备内存（GB，可能是近似值）
console.log(screen.width, screen.height);    // 屏幕分辨率
console.log(screen.colorDepth);               // 色彩深度

可用 API 示例：

• navigator.userAgentData（Chrome 89+）：

navigator.userAgentData.getHighEntropyValues([
  "platform", "platformVersion", "architecture", "model", "uaFullVersion"
]).then(console.log);

但注意：这个 API 返回的信息也是经过隐私处理的，比如不会直接告诉你 CPU 型号，只会给 architecture: "x86" 这种粗略信息。

• WebGL
  通过 WebGL 渲染器信息可以获取到显卡型号（部分情况下会模糊成 "ANGLE"）：

const canvas = document.createElement('canvas');
const gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl');
const debugInfo = gl.getExtension('WEBGL_debug_renderer_info');
if (debugInfo) {
  console.log(gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL)); // GPU 型号
  console.log(gl.getParameter(debugInfo.UNMASKED_VENDOR_WEBGL));   // GPU 厂商
}

2. 前端不能直接获取的硬件信息

浏览器中 禁止直接访问：

• 主板型号、序列号
• 硬盘信息
• CPU 具体型号（只能知道核心数）
• 网络适配器的 MAC 地址
• 设备唯一 ID

如果需要这些信息，必须：

• 用户明确授权 并运行原生程序（如 EXE、APP、PWA with native bridge）
• 或者通过浏览器调用 WebUSB、WebSerial、WebHID 等 API，但这些 API 需要用户手动同意并连接特定设备

3. 进阶手段（需要用户同意）

• WebUSB / WebHID：可与硬件直接通讯（用户必须手动授权）
• 本地应用配合：例如在客户端运行本地程序（Electron、C++、Python），获取硬件信息后通过 WebSocket / HTTP 发送到网页
• 浏览器插件（Extension）：扩展有更高权限，但仍不能随意拿序列号

总结

在 Chrome 里，你最多能用 JS 获取 CPU 核心数、内存大小、显卡型号、屏幕信息，而无法直接获得“真实硬件唯一标识”。
如果你是为了做 设备指纹 或 防作弊检测，可以综合：

• UA / 分辨率 / 内存 / 核心数
• WebGL GPU 信息
• Canvas 指纹、Audio 指纹
  来生成一个较稳定的 ID，但也不是百分百真实硬件信息。