帆布指纹识别(canvas fingerprinting)
广告联盟或许网站运营者都希望能够精准定位并标识每一个个体,通过对用户行为的分析(浏览了哪些页面?搜索了哪些关键字?对什么感兴趣?点了哪些按钮?用了哪些功能?看了哪些商品?把哪些放入了购物车等等),为用户推送更加精准的广告(精准化营销)。同时,通过对用户的标识,可以将不同站点的用户进行关联。
在过去,实现上述cookie是最受欢迎的一种。但由于移动互联网的发展,移动设备限制、用户禁用cookie。使得cookie愈来愈不受待见。伴随着html5的成熟,通过canvas fingerprinting技术标识一个唯一的浏览器逐渐被接受。它的特点是不通过cookie,用户基本无法屏蔽它 。
其实现原理:
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
var txt = 'http://security.tencent.com/';
ctx.textBaseline = "top";
ctx.font = "14px 'Arial'";
ctx.textBaseline = "tencent";
ctx.fillStyle = "#f60";
ctx.fillRect(125,1,62,20);
ctx.fillStyle = "#069";
ctx.fillText(txt, 2, 15);
ctx.fillStyle = "rgba(102, 204, 0, 0.7)";
ctx.fillText(txt, 4, 17);
获取绘画的内容,需要使用到canvas.toDataURL()方法,该方法返回的是图片内容的base64编码字符串。对于PNG文件格式,以块(chunk)划分,最后一块是一段32位的CRC校验,提取这段CRC校验码便可以用于用户的唯一标识
var b64 = canvas.toDataURL().replace("data:image/png;base64,","");
var bin = atob(b64);
var crc = bin2hex(bin.slice(-16,-12));
console.log(crc);
通过验证,crc在一定程度上标识了浏览器的唯一性,但是,在相同设备,相同浏览器上,重复特别严重。国外有一个经过优化后的表示浏览器的唯一性的js,https://github.com/Valve/fingerprintJS
它除了利用canvas以外,还加入了其它的影响因素,这些因素包括
- 浏览器http请求中的用户代理-navigator.userAgent
- 浏览器的语言(中文、英文……)-navigator.language
- 设备屏幕的色彩信息-screen.colorDepth
- 设备屏幕的宽高-screen.height screen.width
- 格林威治时间和本地时间之间的时差-Date().getTimezoneOffset()
- 是否支持sessionStorage-window.sessionStorage
- 是否支持localStorage-window.localStorage
- 是否支持indexdDB-window.indexedDB
- 是否支持-docment.body.addBehavior(IE5的一个属性)
- 是否支持调用本地数据库-window.openDatabase
- 浏览器所在系统的CPU等级-navigator.cupClass
- 客户端的操作系统-navigator.platform
- 是否支持Do not track功能-navigator.doNotTrack
- 获取浏览器部分插件信息-flash plugin、Adobe PDF reader、QuickTime、real players、ShockWave player、Windows media player、Silverlight、Skype
- canvas指纹
官网数据显示,该标识精准度达94%,基于原理 https://panopticlick.eff.org/browser-uniqueness.pdf
国内一程序员在此基础上做了 测试,测试结果https://docs.zoho.com/sheet/ropen.do?rid=08m2ga1cf6790c0eb4d8c8f7e54ca6ddb9b72
| 表格 1 | |||||||||||||
| 手机型号 | 系统 | Android原生 or Safari | uc浏览器 | qq浏览器 | 微信浏览器 | 备注 | |||||||
| 算法优化过的fingerprint | 简单的示例代码 | 算法优化过的fingerprint | 简单的示例代码 | 版本 | 算法优化过的fingerprint | 简单的示例代码 | 版本 | 算法优化过的fingerprint | 简单的示例代码 | 版本 | |||
| SonyEricsson LT15i | Android 2.3.4 | 3069863566 | 390fde4f | 1317560509 | 9ce51412 | v9.9.0.459 | 2177181476 | 3ea97fca | v5.2 | ||||
| Sony X10i | Android 2.3.3 | 3113311216 | js出错 | 2637631051 | 9ce51412 | v9.9.0.459 | 2131234727 | 3ea97fca | v5.2 | 2678610518 | js出错 | v5.3.1 | 原生的刷新优化过生成的id不会变化 |
| 摩托罗拉 MB526 | Android 2.3.6 | 2364220961 | js出错 | - | - | - | - | - | - | - | - | - | 无sd卡无法安装浏览器应用程序 |
| 华为 u9508 | Android 4.0.4 | 3905553191 | 7e41cc0f | 4273392099 | b699d48c | v9.9.0.459 | 1587050929 | 78de4112 | v5.2.0.870 | 4026915635 | 7e41cc0f | v5.3.1 | |
| OPPO X907 | Android 4.0.3 | 726684502 | 7e41cc0f | 2089481481 | d07a1ee9 | v9.9.0.459 | 3231943450 | 78de4112 | v5.2 | 888269767 | 7e41cc0f | v5.3.1 | |
| htc t528w | Android 4.1.1 | 319655688 | a6cb1bf9 | 2479004385 | 56d50248 | v9.8 | 356698439 | 244ae093 | v5.2.1.880 | 2025279959 | a6cb1bf9 | v5.3.1 | |
| 2307781626 | d07a1ee9 | v9.9.0.459 | |||||||||||
| 红米移动版 | Android 4.2.1 | 2391689733 | 9c6ad73c | 1950263795 | 244ae093 | v5.2.1.880 | 1813996467 | 244ae093 | v5.4beta | ||||
| HUAWEI A199 | Android 4.1.2 | 786613426 | 9c6ad73c | 1568290891 | 00000000 | v8.7.2 | 3315869337 | c1e8ddab | v4.2 | 3514548781 | 9c6ad73c | v5.3.1 | UCv8.7.2不支持canvas,每次刷新优化后生成的id会变化,示例代码生成id一直是8个0 |
| 1118832592 | b699d48c | v9.9.0.459 | 1980938942 | 244ae093 | v5.2 | ||||||||
| HUAWEI P6-T00 | Android 4.2.2 | 2890925815 | 9c6ad73c | 452391340 | b699d48c | v9.9.0.459 | 3877925850 | 244ae093 | v5.2 | 3836773909 | 9c6ad73c | v5.3.1 | |
| 魅族 M353 | Android 4.2.1 | 1914110408 | 9c6ad73c | 3750243844 | 431d50f8 | v9.9.0.459 | 3750421827 | 244ae093 | v5.2 | 1096133187 | 9c6ad73c | v5.3.0 | |
| 482295408 | 9c6ad73c | v5.3.1 | |||||||||||
| HTC 802w | Android 4.2.2 | 2657761243 | 9c6ad73c | 2182659327 | dedbb2de | v9.8.0.435 | 2352114048 | 244ae093 | v5.2 | 1328536463 | 9c6ad73c | v4.5 | |
| 2206482289 | 2bc8041a | v9.9.0.459 | 172064929 | 9c6ad73c | v5.3.1 | ||||||||
| 红米 noet | Android 4.2.2 | 398161035 | 9c6ad73c | 197430937 | d07a1ee9 | v9.8.9.457 | 860144104 | 9c6ad73c | v5.0 | 2695087349 | 9c6ad73c | v5.3.1 | |
| 三星 GT-N7100 | Android 4.2.2 | 3229417935 | 9c6ad73c | 755839663 | 9fb1a593 | v9.8.9.457 | 1643973998 | b31ee991 | v5.2 | 2036662041 | 9c6ad73c | v5.1 | |
| 854278007 | 9c6ad73c | v5.3.1 | |||||||||||
| Lenovo K900 | Android 4.2.1 | 1758074907 | 9c6ad73c | 3465119114 | 9c6ad73c | v5.3.1 | |||||||
| 三星 galaxy s5 | Android 4.4.2 | 498065608 | 29725ab4 | 749934522 | d2a60b1d | v9.8.9.457 | 2294751620 | cd456c4a | v5.2.1.880 | 1887934795 | 8140f6e0 | v5.2 | |
| 3807187249 | 8140f6e0 | v5.3.1 | |||||||||||
| 三星 GT-I9505 | Android 4.3 | 118099825 | 4f8f416c | 1898858301 | 4228c48e | v9.9.0.459 | 2205938319 | a3ee5a29 | v5.2 | 4256482719 | fbf76091 | v5.3.1 | |
| 三星 note3 | Android 4.3 | 3923466876 | 4f8f416c | 1961962933 | 0482a2ac | 灵动版 | 408784441 | 0482a2ac | v5.0.2.710 | 4221776986 | 0482a2ac | v5.3.1 | |
| 4023807084 | 4546f3bb | v9.8.0.435 | |||||||||||
| vivo x3t | Android 4.2.1 | 2341248451 | da5b08ce | 1512563799 | c36972ca | v9.9.0.459 | 3677055007 | 33834835 | v5.1.0.780 | 3748495542 | da5b08ce | v5.2.1 | 原生浏览器版本v2.3.1 |
| 2341248451 | da5b08ce | 2080629171 | 33834835 | v5.2.1.880 | 293292691 | da5b08ce | v5.3.1 | 原生浏览器版本v2.3.3 | |||||
| vivo X1 | Android 4.1.1 | 752680764 | da5b08ce | 4192034694 | c36972ca | v9.9.0.459 | 4029696985 | 33834835 | v5.2 | 1912866602 | da5b08ce | v5.3.1 | |
| 三星 GT-I9502 | Android 4.2.2 | 3824555000 | d457e86b | 4271101143 | 53288053 | v9.7.9439 | 958189852 | 31dbc3dd | v5.0.0.650 | 3721105672 | 759549f9 | v4.5.1 | |
| 861119218 | 09ca4266 | v9.9.0.459 | 442109150 | 759549f9 | v5.3.1 | ||||||||
| LG nexus5 | Android 4.3 | 1934848714 | 91aedadb | 2787277112 | a0d15a90 | v9.9.0.459 | 2462651612 | 91aedadb | v5.2.1.880 | 3690133431 | 91aedadb | v5.3.1 | |
| 三星 GT-S7562 | Android 4.0.4 | 2614919294 | 0d5b2b4b | 436079966 | 0b27d3d8 | v9.7.5.418 | 35268090 | b437c248 | v5.2 | 1659108745 | 0d5b2b4b | v5.3.1 | |
| 502410648 | d155acfa | v9.8.9.457 | |||||||||||
| Huawei P1 U9200 | Android 4.0.3 | 3177416712 | 2d694a48 | 4051711183 | 56d50248 | v9.6.0.378 | 4124042100 | fa189661 | v4.5 | 1601581701 | 7e41cc0f | v5.3.1 | |
| 3743446141 | d07a1ee9 | v9.8.9.457 | |||||||||||
| Nokia X | Android 4.1.2 | 3598202588 | 7ba05ba8 | 765903625 | 859aa2b8 | v9.9.0.459 | 3070076558 | 418420bf | v5.2 | 2591054263 | bee57099 | v5.0.3 | |
| 1779200183 | bee57099 | v5.3.1 | |||||||||||
| iphone 3GS | iOS 6.0 | 2754182167 | 9fcce736 | 2426993793 | 9fcce736 | v9.7.1.450 | 4019179322 | 9fcce736 | v4.3 | 3034320187 | 9fcce736 | v5.3.1 | |
| touch 4 | iOS 6.0.1 | 1326709631 | 9fcce736 | 2614633304 | 9fcce736 | v4.5 | 3107294191 | 9fcce736 | v5.3.1 | ||||
| iphone5s | iOS 7.1.2 | 3595104389 | 03048452 | 913535178 | 03048452 | v9.8.0.451 | 2722128024 | 03048452 | v5.3.1 | ||||
| ipad 2 | iOS 7.0.4 | 128750767 | 03048452 | 379240706 | 03048452 | v2.4.2.414 | 3271622238 | 03048452 | v4.2.1 | ||||
| iphone 4S | iOS 7.0.6 | 2862380899 | 9fd0577f | 2558051848 | 9fd0577f | v9.7.5.438 | 3620524272 | 9fd0577f | v5.2.1 | 2859315108 | 9fd0577f | v5.3.1 | |
| touch 5G | iOS 7.1.1 | 2702325906 | 9fd0577f | 3772802722 | 9fd0577f | v9.8.0.451 | 2970288195 | 9fd0577f | v5.2.1 | 495467843 | 9fd0577f | v5.3.1 | |
| iphone 5c | iOS 8.0 | 1300849469 | 9fd0577f | 2561622031 | 9fd0577f | v9.8.0.451 | 3288966699 | 9fd0577f | v5.2.1 | 3767977964 | 9fd0577f | v5.3.1 | |
| 备注说明 | 有特殊背景色的单元格说明有重复,同背景色同字体颜色的,是相同的数据 | ||||||||||||
其测试结论
1.由于涉及设备以及浏览器的判定因素非常多,重复性很低,31台设备皆无重复
但是可以设想,毕竟是通过各种属性值去判断唯一性,理想情况下如果两台设备相同浏览器各种设置也相同,还是会出现重复
2.也正因为涉及的因素多,一旦设备系统更新 or 浏览器版本更新 or 浏览器关键插件有变化(版本更新 or 新增卸载关键插件) ,生成的ID都会改变,由于浏览器版本更新还是比较频繁的,很容易失去之前跟踪的用户
结论:canvas指纹只能作为一参考属性去判断设备的唯一性,不能只用这一个因素来判定设备唯一性。fingerPrint.js也不能取代cookie,但是可以作为辅助,如果用户清除了cookie的情况下,还可以通过fingerPrint.js跟踪到该用户重新set cookie(结论参考)
在一些场景下:
中间可以通过搞一个抽奖,要用户输入手机号码验证后抽奖,来做一些连接。
帆布指纹识别(canvas fingerprinting)的更多相关文章
- HTML5 + JS 网站追踪技术:帆布指纹识别 Canvas FingerPrinting Universally Unique Identifier,简称UUID
1 1 1 HTML5 + JS 网站追踪技术:帆布指纹识别 Canvas FingerPrinting 1 一般情况下,网站或者广告联盟都会非常想要一种技术方式可以在网络上精确定位到每一个个体,这 ...
- [转]取代cookie的网站追踪技术:”帆布指纹识别”初探
[前言] 一般情况下,网站或者广告联盟都会非常想要一种技术方式可以在网络上精确定位到每一个个体,这样可以通过收集这些个体的数据,通过分析后更加精准的去推送广告(精准化营销)或其他有针对性的一些活动.C ...
- HTML5 & canvas fingerprinting
HTML5 & canvas fingerprinting demo https://codepen.io/xgqfrms/full/BaoMWMp window.addEventListen ...
- 基于HTML Canvas实现“指纹识别”技术
https://browserleaks.com/canvas 说明所谓指纹识别是指为每个设备标识唯一标识符(以下简称UUID).诸如移动原生的APP都可以通过调用相关设备API来获取相应的UUID. ...
- FingerprintJS - 在浏览器端实现指纹识别
FingerprintJS 是一个快速的浏览器指纹库,纯 JavaScript 实现,没有依赖关系.默认情况下,使用 Murmur Hash 算法返回一个32位整数.Hash 函数可以很容易地更换. ...
- WAF指纹识别和XSS过滤器绕过技巧
[译文] -- “Modern Web Application Firewalls Fingerprinting and Bypassing XSS Filters” 0x1 前言 之前在乌云drop ...
- android指纹识别、拼图游戏、仿MIUI长截屏、bilibili最美创意等源码
Android精选源码 一个动画效果的播放控件,播放,暂停,停止之间的动画 用 RxJava 实现 Android 指纹识别代码 Android仿滴滴打车(滴滴UI)源码 Android高仿哔哩哔哩动 ...
- Android指纹识别深入浅出分析到实战(6.0以下系统适配方案)
指纹识别这个名词听起来并不陌生,但是实际开发过程中用得并不多.Google从Android6.0(api23)开始才提供标准指纹识别支持,并对外提供指纹识别相关的接口.本文除了能适配6.0及以上系统, ...
- Android开发学习之路-指纹识别api
在android6.0之后谷歌对指纹识别进行了官方支持,今天还在放假,所以就随意尝试了一下这个api,但是遇到了各种各样的问题 ①在使用FingerPrintManager这个类实现的时候发现了很多问 ...
随机推荐
- Android开发学习之路-该怎么学Android(Service和Activity通信为例)
在大部分地方,比如书本或者学校和培训机构,教学Android的方式都基本类似,就是告诉先上原理方法,然后对着代码讲一下. 但是,这往往不是一个很好的方法,为什么? ① 学生要掌握这个方法的用途,只能通 ...
- webservice返回值为Map类型的处理方法
在写一个webservice的时候,方法的返回值是一个复杂类型,处理方法是写一个结果类(Javabean)作为返回值.想着webservice方法返回值为Map的没写过,然后就试着写了一个简单的Dem ...
- 研究一下javascript的模块规范(CommonJs/AMD/CMD)
最近写react需要使用nodejs作为开发环境,需要通过npm安装一些第三方的依赖库,因此慢慢感觉到nodejs基础薄弱对我带来了一些不安全感,尤其是javascript模块这一块听到了很多概念,比 ...
- Lookup component 用法
Lookup component 类似于Tsql的join子句, select a.* ,b.* from dbo.tis a left join dbo. tdes b on a.code=b.co ...
- SQL Server 自动增长过大
一.背景 我们遇到的问题如下图所示:自动增长无端端就按照这样的比例进行增长: (Figure1:问题所在) 尝试使用SSMS修改自动增长值,就会出现下面的错误: (Figure2:错误信息) 遇到上面 ...
- ExtJs4 基础必备
认识ExtJs的开发包 下载路径:http://www.sencha.com/products/extjs/download/ 解压有20多兆,别怕,真正运行的没这么大.认识下这个包的文件结构吧. b ...
- Last-Modified、If-Modified-Since 实现缓存和 OutputCache 的区别
先梳理三个概念: OutputCache:页面输出缓存,一般 ASP.NET 应用程序会用到. Last-Modified:Http 响应头(Http Reponse Header),由服务器发给客户 ...
- [OpenCV] Samples 13: opencv_version
cv::CommandLineParser的使用. I suppose CommandLineParser::has("something") should be true whe ...
- jar包依赖性查询
项目中碰到jar包冲突,需要排除一些jar包时先要了解jar的依赖关系,maven提供了命令行来查询: mvn dependency:tree 返回依赖的属性结构
- 记录下帮助一位网友解决的关于android子控件的onTouch或onClick和父OnTouch 冲突的问题。
前三天收到位网友的私信求助,问题大概如标题所示.具体是下面的情况,个人感觉,这个问题挺有趣,也会在实际项目开发中很常见.不想看前奏的请直接跳至解决方法. 问题原型: 父控件是自定义的 LinearLa ...