大家知道有些网站是会员制,而且对会员所用的机器会有一个绑定,这就意味着一个用户只能在固定的机器上或浏览器上登陆,如果换了电脑或浏览器那很不幸,请联系商家解绑,类似的还有某些企业通过下载终端的方式进行绑定,当然这样对用户体验有很大的影响,总而言之都是为了保护企业的利益,你懂的!言归正传,既然说到绑定机器,那他们是怎么实现的呢?当然方法很多,今天我们说一下通过获取浏览器指纹的方式来识别用户是否更换了机器(尝试用js获取用户物理地址的还是放弃吧,IE可能还给你点机会, 反正我是不想再研究了,能力有限).

　　下边我们直接用js获取用户浏览器指纹,先上代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.staticfile.org/fingerprintjs2/2.1.0/fingerprint2.min.js"></script>
    <script>
        function finger() {
            let excludes = {};
            excludes.audio = true;
            excludes.fontsFlash = true;
            excludes.webgl = true;
            excludes.canvas = true;
            excludes.enumerateDevices = true;
            let options = {excludes: excludes};
            Fingerprint2.get(options, function (components) {
                const values = components.map(function (component) {
                    return component.value
                });
                const murmur = Fingerprint2.x64hash128(values.join(''), 31);
                alert(murmur)
            });
        }
    </script>
</head>
<body>
<button onclick="finger()">点击</button>
</body>
</html>

　　代码很简单,有点前端基础的都能看懂,这里主要是利用了前端fingerprint2这个库来实现,这里我主要通过audio,fontsFlash,webgl,canvas,enumerateDevices这几项来识别的,返回的是一个MD5值,可以尝试清除缓存刷新,发现它是不会变化的,如果换个浏览器或换台机器,它会返回不同的值,当然配置项不止这几个,可以根据自己的实际情况配置,获取到用户浏览器指纹再加上用户的ip就可以防止用户使用代理ip对信息进行采集,具体实现也不多说了.

  • userAgent: navigator.userAgent
  • language: 语言
  • colorDepth: 返回目标设备或缓冲器上的调色板的比特深度 screen.colorDepth
  • deviceMemory: 以千兆字节为单位返回设备内存量。该值是通过舍入到最接近的2的幂并将该数除以1024而给出的近似值
  • pixelRatio: 像素比 devicePixelRatio
  • hardwareConcurrency: navigator.hardwareConcurrency 返回可用于运行在用户的计算机上的线程的逻辑处理器的数量
  • screenResolution: 检测屏幕宽高，并根据屏幕方向矫正返回值[width,height]
  • availableScreenResolution: 返回屏幕分辨率[width,height]，无头浏览器无法获取
  • timezoneOffset: 返回从当前区域设置（主机系统设置）到UTC的时区差异（以分钟为单位）
  • timezone: 时区
  • sessionStorage: 是否支持 sessionStorage，不支持时返回错误
  • localStorage: 是否支持 localStorage
  • indexedDb: 是否支持 indexedDb
  • addBehavior :此时可能未定义body或以编程方式删除
  • openDatabase: 返回是否支持 Web SQL
  • cpuClass: 返回浏览器系统的 CPU 等级,一般无法获取
  • platform: 返回表示浏览器平台的字符串,该规范允许浏览器始终返回空字符串，因此不要依赖此属性来获得可靠的答案
  • doNotTrack: 返回用户的“不跟踪”设置。如果用户请求不被网站，内容或广告跟踪，则为“1”
  • plugins: 返回浏览器安装的插件列表
  • canvas: 如果浏览器支持canvas则返回生成baes64数据
  • webgl: 返回浏览器对webgl绘图协议的支持情况汇总
  • webglVendorAndRenderer: 返会显卡型号相关信息
  • adBlock: 返回是否安装去广告插件
  • hasLiedLanguages: 返回用户是否改变了首选语言
  • hasLiedResolution: 返回用户是否改变了分辨率
  • hasLiedOs: 返回用户是否改变了操作系统
  • hasLiedBrowser: 返回用户是否改变了浏览器
  • touchSupport: 返回最大触摸点数，是否支持touch，是否支持ontouchstart事件
  • fonts: 返回从64种字体种筛选出的可用字体
  • fontsFlash: Flash字体枚举,如果没有swfobject，不会触发
  • audio: 返回音频指纹
  • enumerateDevices: navigator.mediaDevices 请求可用媒体输入和输出设备的列表，例如麦克风，相机，耳机等