帆布指紋識別（canvas fingerprinting）

廣告聯盟或許網站運營者都但願可以精準定位並標識每個個體，經過對用戶行爲的分析（瀏覽了哪些頁面？搜索了哪些關鍵字？對什麼感興趣？點了哪些按鈕？用了哪些功能？看了哪些商品？把哪些放入了購物車等等），爲用戶推送更加精準的廣告（精準化營銷）。同時，經過對用戶的標識，能夠將不一樣站點的用戶進行關聯。

在過去，實現上述cookie是最受歡迎的一種。但因爲移動互聯網的發展，移動設備限制、用戶禁用cookie。使得cookie越來越不受待見。伴隨着html5的成熟，經過canvas fingerprinting技術標識一個惟一的瀏覽器逐漸被接受。它的特色是不經過cookie，用戶基本沒法屏蔽它 。

其實現原理：

 1 var canvas = document.createElement('canvas');
 2 var ctx = canvas.getContext('2d');
 3 var txt = 'http://security.tencent.com/';
 4 ctx.textBaseline = "top";
 5 ctx.font = "14px 'Arial'";
 6 ctx.textBaseline = "tencent";
 7 ctx.fillStyle = "#f60";
 8 ctx.fillRect(125,1,62,20);
 9 ctx.fillStyle = "#069";
10 ctx.fillText(txt, 2, 15);
11 ctx.fillStyle = "rgba(102, 204, 0, 0.7)";
12 ctx.fillText(txt, 4, 17);

獲取繪畫的內容，須要使用到canvas.toDataURL()方法，該方法返回的是圖片內容的base64編碼字符串。對於PNG文件格式，以塊(chunk)劃分，最後一塊是一段32位的CRC校驗，提取這段CRC校驗碼即可以用於用戶的惟一標識

1 var b64 = canvas.toDataURL().replace("data:image/png;base64,","");
2 var bin = atob(b64);
3 var crc = bin2hex(bin.slice(-16,-12));
4 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個活動分別是掃二維碼打開一個網址，在另一個網頁內操做，在第三個網頁內進行別的操做，而後被採集後在後臺經過指紋進行關聯，獲得本次戰役的目標 中間能夠經過搞一個抽獎，要用戶輸入手機號碼驗證後抽獎，來作一些鏈接。