帆布指纹调研

Posted 2022-01-29 夏天然后

canvas指纹

1. 什么是帆布指纹

canvas指纹理论上可以唯一标识一个浏览器，即使用户删除了浏览器的任何隐私记录（例如cookie，localStorage，indexedDB等等），这个值在每次生成的时候都依然是相同的。

2. 帆布指纹作用

搜索引擎可以根据这个值跟踪某个人的行为与习惯。即使你每次以隐身模式访问baidu，百度依然可以确定每次访问是不是你，然后给你定向地推送广告。

3. 工作原理是什么

用JS创建一个canvas画布，然后在画布上面画几个图形，正方形，圆形等，然后写几个字。然后把这个canvas base64编码，最后生成base64编码的hash值，这个hash值就是canvas指纹。（hash算法可以使用非常主流的md5算法）

4. 为什么这个hash值能够唯一标识一个浏览器呢？

那是因为这个hash值本质上是浏览器+操作系统+GPU+图形驱动器的唯一性，任何俩个不相同的浏览器，或者不同电脑上面的相同浏览器 都会存在细丝末毫的不同，而这个不同会导致浏览器绘制的图像肉眼看起来相同，但是某几个像素点可能存在几个像素的偏移或者灰度偏移，然后生成的hash值就完全不一样了。

这里给出wikipedia的链接

5. 是百分百准确吗?

这个指纹在最新的Chrome浏览器上（version74）显示都是相同的了，或者说相同几率很高。很可能Google Chrome团队已经解决底层操作系统与硬件差异带来的这个问题了。

但是这项技术依然被广泛采用，因为根据这项技术衍生的技术还有 audio指纹，webgl指纹，fonts字体指纹。这些技术的组合叫做浏览器指纹。

6. 实现

找到了一段代码, 可以测试

链接 : https://jsbin.com/qisodaz/edit?html,js,output

关于audio，webgl，canvas 等指纹的更多信息

可以看看这个 https://github.com/AJLoveChina/fingerprintDemo

这篇文章写得也不错

https://www.cnblogs.com/xiezhengcai/p/4252008.html

参考链接

1. https://en.wikipedia.org/wiki/Canvas_fingerprinting
2. https://github.com/Valve/fingerprintjs2
3. https://amiunique.org/ 检测自己是否全球唯一的网站
4. https://chrome.google.com/webstore/detail/canvas-fingerprint-defend/lanfdkkpgfjfdikkncbnojekcppdebfp?hl=en 防止网站获取用户真实的canvas指纹插件（Chrome平台，其它平台也有）（感兴趣可以了解一下其工作原理）