Fingerprint2 获取浏览器的指纹应用（唯一标识），生成游客身份

Fingerprint2 获取浏览器的指纹应用，生成游客身份，并应用到uniapp实际开发中

什么是浏览器指纹？

我们每个人都有自己的指纹，可以用来标识我们的唯一身份，最常见的应用就是手机指纹识别、指纹支付、指纹打卡。
浏览器也拥有自己的指纹标识，这指的是仅通过浏览器的各种信息，如CPU核心数、显卡信息、系统字体、屏幕分辨率、浏览器插件等组合成的一个字符串，相当于绝对定位一个用户，并且不受浏览器隐私窗口的影响。
这样一来，当你访问一个网站的时候，因为浏览器具有唯一指纹，浏览器可以直接识别你，尽管不知道你是谁。而这也被应用到开发中产生的浏览器游客身份。

Fingerprint2 生成浏览器指纹应用

Fingerprint2 是一款开源的设备指纹生成器。主要用于判断用户是否是新增用户，或者判断设备是否为新增访问设备。
官网 https://github.com/Valve/fingerprintjs2

Fingerprint2 在uniapp中的使用

1.npm下载Fingerprint2库

npm install fingerprintjs2 -S

2.在项目中引入Fingerprint2

不管是vue项目，还是uniapp项目，都是有App.vue和main.js这两个文件的，我是在App.vue引入Fingerprint2的，因为这个也不需要全局使用，直接在App.vue，整个项目最开始的地方产生一个指纹然后存储到本地存储里面就好了。
当然你如果有其他需求，可以在main.js里面全局注册一下使用

import Fingerprint2 from 'fingerprintjs2'

3.生成浏览器指纹，并存储到本地存储里面

var fingerprint = Fingerprint2.get(function(components) {
   const values = components.map(function(component,index) {
      if (index === 0) { //把微信浏览器里UA的wifi或4G等网络替换成空,不然切换网络会ID不一样
         return component.value.replace(/\bNetType\/\w+\b/, '')
      }
      return component.value
    })
    // 生成最终id murmur   
    const murmur = Fingerprint2.x64hash128(values.join(''), 31);
    uni.setStorageSync('uniquecode',murmur)
});

图例

这样下来每次打开同一个浏览器都会生成浏览器的唯一标识，不管刷新还是关闭浏览器，都是唯一的
拿到这个唯一标识之后，你就可以根据这个标识生成游客身份

4.写到最后

这里基于uniapp项目来写的，对于vue项目完全是适用的，大家完全可以举一反三来用起来

以上就是生成浏览器唯一标识的使用方法了，有任何问题欢迎大家指出并讨论