如何在Angular 14项目中获取客户端系统UUID

浏览器的安全机制限制了前端（包括Angular）直接访问客户端系统的硬件UUID（比如通过wmic csproduct get uuid获取的系统UUID）——这类操作涉及用户隐私与系统权限，前端无法直接执行系统命令或读取硬件级别的底层信息。以下是几种可行的替代方案：

• 方案1：基于浏览器指纹生成稳定标识
  收集浏览器的多个特征（如用户代理字符串、屏幕分辨率、时区、系统语言、CPU核心数等），通过哈希算法生成一个稳定的唯一标识。只要用户不大幅修改浏览器配置或更换设备，这个标识就能保持恒定。
  实现示例：

  generateBrowserFingerprint(): string {
    const browserFeatures = [
      navigator.userAgent,
      navigator.language,
      `${screen.width}x${screen.height}`,
      new Date().getTimezoneOffset(),
      navigator.hardwareConcurrency
    ];
    return this.calculateHash(browserFeatures.join('|'));
  }
  
  private calculateHash(str: string): string {
    let hash = 0;
    for (let i = 0; i < str.length; i++) {
      hash = ((hash << 5) - hash) + str.charCodeAt(i);
      hash |= 0; // 转换为32位整数
    }
    return hash.toString(16);
  }
  

• 方案2：后端配合生成持久化设备标识
  若项目有后端服务，可在用户首次访问时，由后端生成唯一ID（如标准UUID），前端将其存储在localStorage或cookie中。除非用户主动清除浏览器存储，否则这个标识会长期保留，实现客户端的恒定识别。
  核心流程：

  1. 前端页面加载时，检查localStorage是否存在预存标识；
  2. 若不存在，请求后端生成唯一ID并返回；
  3. 前端将ID存入localStorage，后续所有请求都携带该ID供后端识别客户端。

• 方案3：Electron封装（桌面应用场景）
  如果你的Angular项目最终打包为桌面应用（如使用Electron），则可借助Electron的Node.js环境执行系统命令获取硬件UUID：

  const { exec } = require('child_process');
  exec('wmic csproduct get uuid', (error, stdout, stderr) => {
    if (error) {
      console.error(`执行错误: ${error.message}`);
      return;
    }
    if (stderr) {
      console.error(`错误输出: ${stderr}`);
      return;
    }
    const systemUUID = stdout.trim().split('\n')[1].trim();
    console.log('系统UUID:', systemUUID);
  });
  

  此方案仅适用于桌面应用，因为Electron允许访问Node.js API与系统级命令。

内容的提问来源于stack exchange，提问作者ganesh