如何用JavaScript前端代码判断电脑是ARM还是x86架构
在前端开发中，部分场景需要根据用户设备的CPU架构（ARM或x86）做针对性适配，比如为不同架构加载对应的WASM模块、提示用户下载适配的安装包等。由于JavaScript运行在沙箱环境中，没有直接获取CPU架构的原生API，但可以通过浏览器提供的用户代理字符串（User Agent）和浏览器特性间接推断设备架构。
核心判断思路
目前主流的实现方式是通过解析navigator.userAgent和navigator.platform的信息，结合不同架构设备对应的特征字符串进行判断，以下是常见场景的特征规律：
x86/x86_64架构的桌面设备（Windows、macOS、Linux）通常会在用户代理中包含
Win64、x86_64、amd64、i686、i386等标识ARM架构的设备（比如Apple Silicon芯片的macOS设备、ARM架构的Windows设备、移动端设备）通常会在用户代理中包含
arm、aarch64、arm64等标识移动端设备（手机、平板）大多采用ARM架构，可通过设备类型做辅助判断
实现代码示例
以下是一个通用的判断函数，结合用户代理、平台信息和设备类型做综合推断：
/**
* 判断当前设备CPU架构
* @returns {string} 返回 'x86' | 'arm' | 'unknown'
*/
function getCpuArchitecture() {
const ua = navigator.userAgent.toLowerCase();
const platform = navigator.platform ? navigator.platform.toLowerCase() : '';
// 优先匹配ARM相关特征
const armReg = /arm|aarch64|arm64/;
if (armReg.test(ua) || armReg.test(platform)) {
return 'arm';
}
// 匹配x86相关特征
const x86Reg = /x86_64|x86|amd64|i686|i386|win64|wow64/;
if (x86Reg.test(ua) || x86Reg.test(platform)) {
return 'x86';
}
// 移动端设备默认归为ARM架构
const mobileReg = /mobile|android|iphone|ipad|ipod/;
if (mobileReg.test(ua)) {
return 'arm';
}
// 无法识别时返回unknown
return 'unknown';
}
// 测试调用
console.log('当前设备CPU架构：', getCpuArchitecture());特殊场景说明
Apple Silicon芯片的macOS设备判断
2020年后的Mac设备采用Apple Silicon（ARM架构），其用户代理中会包含arm64标识，上述通用函数已经可以正确识别。如果需要单独判断是否为Apple Silicon设备，可使用以下补充逻辑：
function isAppleSiliconMac() {
const ua = navigator.userAgent.toLowerCase();
const platform = navigator.platform ? navigator.platform.toLowerCase() : '';
// 同时满足mac系统、ARM架构特征两个条件
return /macintosh|mac os x/.test(ua) && (/arm64|aarch64/.test(ua) || /arm64|aarch64/.test(platform));
}局限性说明
这种判断方式依赖于用户代理字符串，存在以下局限性：
如果用户手动修改了浏览器的用户代理字符串，判断结果会失效
部分小众设备或浏览器的用户代理可能没有携带明确的架构标识，会返回
unknownARM架构的Windows设备目前用户代理的标识还不够统一，可能存在误判情况
因此实际使用时，建议将该判断结果作为参考，不要作为唯一的逻辑依据，可结合业务场景做降级处理。
总结
虽然没有原生的JavaScript API可以直接获取CPU架构，但通过解析用户代理和平台信息的特征字符串，已经可以满足大部分常规场景的判断需求。开发者可以根据自身业务场景调整正则匹配规则，补充更多特殊设备的识别逻辑，提升判断准确率。