广告联盟或许网站运营者都希望能够精准定位并标识每一个个体,通过对用户行为的分析(浏览了哪些页面?搜索了哪些关键字?对什么感兴趣?点了哪些按钮?用了哪些功能?看了哪些商品?把哪些放入了购物车等等),为用户推送更加精准的广告(精准化营销)。同时,通过对用户的标识,可以将不同站点的用户进行关联。

在过去,实现上述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以外,还加入了其它的影响因素,这些因素包括

  1. 浏览器http请求中的用户代理-navigator.userAgent
  2. 浏览器的语言(中文、英文……)-navigator.language
  3. 设备屏幕的色彩信息-screen.colorDepth
  4. 设备屏幕的宽高-screen.height screen.width
  5. 格林威治时间和本地时间之间的时差-Date().getTimezoneOffset()
  6. 是否支持sessionStorage-window.sessionStorage
  7. 是否支持localStorage-window.localStorage
  8. 是否支持indexdDB-window.indexedDB
  9. 是否支持-docment.body.addBehavior(IE5的一个属性)
  10. 是否支持调用本地数据库-window.openDatabase
  11. 浏览器所在系统的CPU等级-navigator.cupClass
  12. 客户端的操作系统-navigator.platform
  13. 是否支持Do not track功能-navigator.doNotTrack
  14. 获取浏览器部分插件信息-flash plugin、Adobe PDF reader、QuickTime、real players、ShockWave player、Windows media player、Silverlight、Skype
  15. 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(结论参考)

在一些场景下:

 一般一个指纹跟踪不是永久的跟踪的概念,而是在一个战役内进行活动的跟踪,比如可以发布3个活动,3个活动分别是扫二维码打开一个网址,在另外一个网页内操作,在第三个网页内进行别的操作,然后被采集后在后台通过指纹进行关联,得到本次战役的目标

中间可以通过搞一个抽奖,要用户输入手机号码验证后抽奖,来做一些连接。

帆布指纹识别(canvas fingerprinting)的更多相关文章

  1. HTML5 + JS 网站追踪技术:帆布指纹识别 Canvas FingerPrinting Universally Unique Identifier,简称UUID

    1 1 1 HTML5 + JS  网站追踪技术:帆布指纹识别 Canvas FingerPrinting 1 一般情况下,网站或者广告联盟都会非常想要一种技术方式可以在网络上精确定位到每一个个体,这 ...

  2. [转]取代cookie的网站追踪技术:”帆布指纹识别”初探

    [前言] 一般情况下,网站或者广告联盟都会非常想要一种技术方式可以在网络上精确定位到每一个个体,这样可以通过收集这些个体的数据,通过分析后更加精准的去推送广告(精准化营销)或其他有针对性的一些活动.C ...

  3. HTML5 & canvas fingerprinting

    HTML5 & canvas fingerprinting demo https://codepen.io/xgqfrms/full/BaoMWMp window.addEventListen ...

  4. 基于HTML Canvas实现“指纹识别”技术

    https://browserleaks.com/canvas 说明所谓指纹识别是指为每个设备标识唯一标识符(以下简称UUID).诸如移动原生的APP都可以通过调用相关设备API来获取相应的UUID. ...

  5. FingerprintJS - 在浏览器端实现指纹识别

    FingerprintJS 是一个快速的浏览器指纹库,纯 JavaScript 实现,没有依赖关系.默认情况下,使用 Murmur Hash 算法返回一个32位整数.Hash 函数可以很容易地更换. ...

  6. WAF指纹识别和XSS过滤器绕过技巧

    [译文] -- “Modern Web Application Firewalls Fingerprinting and Bypassing XSS Filters” 0x1 前言 之前在乌云drop ...

  7. android指纹识别、拼图游戏、仿MIUI长截屏、bilibili最美创意等源码

    Android精选源码 一个动画效果的播放控件,播放,暂停,停止之间的动画 用 RxJava 实现 Android 指纹识别代码 Android仿滴滴打车(滴滴UI)源码 Android高仿哔哩哔哩动 ...

  8. Android指纹识别深入浅出分析到实战(6.0以下系统适配方案)

    指纹识别这个名词听起来并不陌生,但是实际开发过程中用得并不多.Google从Android6.0(api23)开始才提供标准指纹识别支持,并对外提供指纹识别相关的接口.本文除了能适配6.0及以上系统, ...

  9. Android开发学习之路-指纹识别api

    在android6.0之后谷歌对指纹识别进行了官方支持,今天还在放假,所以就随意尝试了一下这个api,但是遇到了各种各样的问题 ①在使用FingerPrintManager这个类实现的时候发现了很多问 ...

随机推荐

  1. Atitit webservice的发现机制 discover机制

    Atitit webservice的发现机制 discover机制 1.1. Ws disconvert 的组播地址和端口就是37021 1.2. Ws disconvert的发现机制建立在udp组播 ...

  2. WPF入门教程系列二十一——DataGrid示例(一)

    前面我们学习了ListView控件的使用示例,今天我们来学习DataGrid的有关知识.提到DataGrid 不管是Asp.Net中的网页开发还是WinForm应用程序开发都会频繁使用.通过它我们可以 ...

  3. eCharts动态加载各省份的数据

    假如从数据库读出以下数据,如何将数据展示在地图之上 1.部门的名称数据: List deptname=[联通事业部-上海联通项目组, 联通事业部-河南联通项目组, 联通事业部-贵州联通项目组, 联通事 ...

  4. iOS-SDWebimage底层实现原理

    其实有些框架的实现原理,并没有想象中那么难,思想也很简单,主要是更新第三方框架的作者对自己写的代码,进行了多层封装,使代码的可读性降低,也就使得框架看起来比较难.我来实现以下SDWebimage的的曾 ...

  5. ECMAScript6学习笔记 ——let、const、变量解构赋值

    let 不存在变量提升 通过let声明的变量仅在块级作用域内有效 不允许在同一个作用域内重复声明一个变量 防止值公用 var oUl = document.querySelectorAll('ul&g ...

  6. JAVA的静态变量、静态方法、静态类

    静态变量和静态方法都属于静态对象,它与非静态对象的差别需要做个说明. (1)Java静态对象和非静态对象有什么区别? 比对如下: 静态对象                                ...

  7. 自定义配置UEditor 工具栏上的按钮列表

    修改配置项的方法: 1. 方法一:修改 ueditor.config.js 里面的 toolbars 2. 方法二:实例化编辑器的时候传入 toolbars 参数 方法一:在ueditor.confi ...

  8. (转)对Lucene PhraseQuery的slop的理解

    所谓PhraseQuery,就是通过短语来检索,比如我想查"big car"这个短语,那么如果待匹配的document的指定项里包含了"big car"这个短语 ...

  9. OracleDBA之数据库管理

    以下这些东西是我的麦库上存的当时学Oracle的学习笔记今天拿出来和大家分享一下,转载请注明出处,下面用的Oracle的版本是10g,用的时WinServer2003的操作系统,可能有些命令和Orac ...

  10. ZOJ Problem Set - 1292 Integer Inquiry

    题目本身属于简单题,但是注意在输出的时候,题目很变态的对格式做了很多要求: 1.输入的N与下面的block有一个空行 2.每次输出与下一个输入的block有一个空行 3.但是特别注意,当是最后一个输出 ...