JavaScript中获取UUID的多个方法(js获取UUID的三种方式详解)

UUID（更确切的说是UUIDv4）是通用唯一标识符，用于识别实体或信息的一种方式。在JavaScript中，可以通过多种方法获取UUID，本文将从不同的角度对这些方法进行详细的阐述。

一、基于常规算法的UUID获取

这里所说的基于常规算法获取UUID，其实就是通过已经存在的库或者原生的API，生成UUID字符串。以下是两个常见的方法：

方法1：使用Uuid库生成UUID

<script src="https://cdn.bootcdn.net/ajax/libs/uuid/8.3.2/uuid.min.js"></script>
<script>
  const uuidv4 = require('uuid/v4'); // 引入库
  const uuid = uuidv4(); // 生成UUID
  console.log(uuid); // 输出UUID
</script>

首先需要引入uuid库，然后调用库提供的v4方法生成UUID即可。该库支持多种语言，用法简单明了，但需要依赖于第三方库。

方法2：基于window.crypto的API生成UUID

<script>
  function uuidv4() {
    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
      var r = window.crypto.getRandomValues(new Uint8Array(1))[0] % 16 | 0,
          v = c == 'x' ? r : (r & 0x3 | 0x8);
      return v.toString(16);
    });
  }

  const uuid = uuidv4(); // 生成UUID
  console.log(uuid); // 输出UUID
</script>

该方法基于window.crypto的API生成伪随机数，然后通过字符串替换得到UUID字符串。该方法原生支持，无需安装第三方库。

二、基于硬件的UUID获取

一些设备和浏览器提供硬件和软件级别的API以获取硬件相关信息。这些信息通常是唯一的，可以生成称为硬件ID的UUID。以下是一个基于硬件的UUID获取方法：

方法3：基于设备的UUID

<script>
  function generateUUID() {
    var d = new Date().getTime();
    var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
      var r = (d + Math.random() * 16) % 16 | 0;
      d = Math.floor(d / 16);
      return (c == 'x' ? r : (r & 0x7 | 0x8)).toString(16);
    });
    return uuid;
  }

  const uuid = generateUUID(); // 生成UUID
  console.log(uuid); // 输出UUID
</script>

该方法基于设备的时间和Math.random方法生成UUID。这种方法可以在所有设备上运行，但并不是完全唯一的。

三、基于浏览器的UUID获取

浏览器可以通过一些API获取一些唯一的标识符来用于用户跟踪或者识别。以下是两个基于浏览器的UUID获取方法：

方法4：基于cookie的UUID

<script>
  function generateUUID() {
    var uuid = getCookie('uuid');
    if (!uuid) {
      uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        var r = (new Date().getTime() + Math.random() * 16) % 16 | 0;
        return (c == 'x' ? r : (r & 0x7 | 0x8)).toString(16);
      });
      setCookie('uuid', uuid);
    }
    return uuid;
  }

  function setCookie(name, value, expires, path, domain, secure) {
    var cookie = name + '=' + encodeURIComponent(value);
    if (expires) {
      var date = new Date();
      date.setTime(date.getTime() + (expires * 24 * 60 * 60 * 1000));
      cookie += '; expires=' + date.toGMTString();
    }
    if (path) {
      cookie += '; path=' + path;
    }
    if (domain) {
      cookie += '; domain=' + domain;
    }
    if (secure) {
      cookie += '; secure';
    }
    document.cookie = cookie;
  }

  function getCookie(name) {
    var matches = document.cookie.match(new RegExp('(?:^|; )' + name.replace(/([.$?*|{}()[]\/+^])/g, '\$1') + '=([^;]*)'));
    return matches ? decodeURIComponent(matches[1]) : undefined;
  }

  const uuid = generateUUID(); // 生成UUID
  console.log(uuid); // 输出UUID
</script>

该方法基于cookie生成UUID。首先尝试从cookie中获取UUID，如果不存在则生成一个UUID并将其存入cookie中。该方法能够持久化存储UUID，并且可以在所有设备上运行。

方法5：基于Web Storage的UUID

<script>
  function generateUUID() {
    var uuid = sessionStorage.getItem('uuid');
    if (!uuid) {
      uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        var r = (new Date().getTime() + Math.random() * 16) % 16 | 0;
        return (c == 'x' ? r : (r & 0x7 | 0x8)).toString(16);
      });
      sessionStorage.setItem('uuid', uuid);
    }
    return uuid;
  }

  const uuid = generateUUID(); // 生成UUID
  console.log(uuid); // 输出UUID
</script>

该方法基于Web Storage，使用sessionStorage来存储UUID。首先尝试从sessionStorage中获取UUID，如果不存在则生成一个UUID并将其存入sessionStorage中。这种方法也能够持久化存储UUID，并且可以在所有设备上运行。

四、总结

以上就是JavaScript中获取UUID的多个方法，可以根据需要选择不同的方法来获取UUID。基于常规算法的方法不需要依赖第三方库，但可能存在重复UUID的风险；基于硬件的方法可能更为安全，但并非唯一；基于浏览器的方法可以跨设备使用，但需要支持浏览器相关API。在项目中应该根据具体需求灵活选择使用方法。