canvas指纹验证测试报告

canvas指纹验证测试报告

验证维度

1. 手机系统

   • Android 2.x、4.x
   • iOS 6.x、7.x、8.x

2. 浏览器（各个版本）

   • Safari 或 Android原生浏览器
   • UC浏览器
   • QQ浏览器
   • 微信浏览器

3. canvas指纹ID打印 实现代码(具体代码见附件)

   • 简单的示例代码（testCode/simpleCanvas.js）

     实现流程：

   • 经过优化的fingerprint.js，除了canvas指纹还增加了其他判定因素（testCode/fingerprint.js）

实现流程：

• *因素值*包括

  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指纹

测试设备数量

31台设备

• 3台 Android 2.x
• 21台 Android 4.x
• 2台 iOS 6.x
• 4台 iOS 7.x
• 1台 iOS 8.x

结论

简单的示例代码(仅仅针对canvas一个因素)

对于canvas指纹ID，31台设备测试数据分析结果：

1. 无论Android还是iOS，只要设备系统相近(同类型系统且版本号接近)的情况下，ID易重复

   比如Android 4.2.x系统的大量重复：［9c6ad73c－红色色块］、［244ae093－黄色色块］

2. 在Android系统中，在满足1的条件下，且使用相同浏览器，ID更易重复

   比如在Android 4.2.x系统的大量重复的几个ID中：

   • ［9c6ad73c－红色色块］在原生浏览器中重复的更严重
   • ［244ae093－黄色色块］在QQ浏览器中重复的更严重

3. 在iOS系统中，同设备情况下，不管是用什么浏览器，ID都是相同的

   测试7台iOS设备都符合这条规则

4. iOS测试了7台设备，ID重复率100%
5. 在Android系统中，，若任意两台不同设备的原生浏览器生成的ID不同的情况下，它们的UC浏览器和QQ浏览器没发生过重复。
6. 如果浏览器进行了版本升级，ID可能会变也可能不变

结论: canvas指纹ID与设备系统、浏览器相关性非常大。并不是唯一的，不能直接用来代替cookie

经过优化的fingerPrint.js

对于fingerPrint.js生成的指纹ID，31台设备测试数据分析结果：

1. 由于涉及设备以及浏览器的判定因素非常多，重复性很低，31台设备皆无重复

   但是可以设想，毕竟是通过各种属性值去判断唯一性，理想情况下如果两台设备相同浏览器各种设置也相同，还是会出现重复

2. 也正因为涉及的因素多，一旦设备系统更新 or 浏览器版本更新 or 浏览器关键插件有变化(版本更新 or 新增卸载关键插件) ，生成的ID都会改变

   由于浏览器版本更新还是比较频繁的，很容易失去之前跟踪的用户

结论：canvas指纹只能作为一参考属性去判断设备的唯一性，不能只用这一个因素来判定设备唯一性。fingerPrint.js也不能取代cookie，但是可以作为辅助，如果用户清除了cookie的情况下，还可以通过fingerPrint.js跟踪到该用户重新set cookie

附件：

1. 测试页面html代码

2. 简单示例代码

/**
 * This is the simple canvas finger print
 */

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); 
var b64 = canvas.toDataURL();
b64 = b64.replace("data:image/png;base64,","");

var bin = atob(b64).slice(-16,-12); 
var simpleCanvas = bin2hex(bin); 

function bin2hex(s) {
  var i, l, o = '',
    n;

  s += '';

  for (i = 0, l = s.length; i < l; i++) {
    n = s.charCodeAt(i)
      .toString(16);
    o += n.length < 2 ? '0' + n : n;
  }

  return o;
}

3. fingerPrint.js: https://github.com/Valve/fingerprintjs/blob/master/fingerprint.js

4.测试结果数据:  https://docs.zoho.com/file/08m2ga1cf6790c0eb4d8c8f7e54ca6ddb9b72

made by 黄敏