浏览器指纹技术通过浏览器暴露的API悄无声息地追踪用户,即使清除Cookie也难以逃脱。Canvas哈希、WebGL渲染器、硬件传感器和字体枚举是常见高熵特征。本文聚焦单一技术点:构建交互式扫描器审计这些API暴露,提供可落地JavaScript实现、参数配置与监控要点,帮助开发者自建隐私审计工具。
浏览器指纹审计的核心API
浏览器暴露多种API易被滥用生成唯一指纹。扫描器需逐一采集并哈希,评估唯一性风险。
-
Canvas指纹:利用CanvasRenderingContext2D渲染文本/图像,提取像素数据哈希。不同设备/驱动渲染微差导致哈希唯一。
- 采集代码:
function getCanvasHash() {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
ctx.textBaseline = 'top';
ctx.font = '14px Arial';
ctx.fillText('Fingerprint test 🦄', 2, 2);
ctx.fillStyle = 'rgba(102, 204, 0, 0.7)';
ctx.fillRect(125, 1, 62, 20);
return canvas.toDataURL().hashCode();
}
- 风险阈值:哈希唯一性>1/10^6即高危。
-
WebGL渲染器指纹:gl.getParameter提取GPU厂商/渲染器字符串,常暴露"Intel Iris OpenGL Engine"等硬件细节。
-
硬件传感器指纹:navigator.hardwareConcurrency(CPU核数)、deviceMemory(RAM GB)、Battery API(电量/充电状态)。
- 采集代码:
async function getHardwareSensors() {
const data = {
cores: navigator.hardwareConcurrency || 'unknown',
memory: navigator.deviceMemory || 'unknown',
platform: navigator.platform
};
if ('getBattery' in navigator) {
const battery = await navigator.getBattery();
data.charging = battery.charging;
data.level = battery.level * 100;
}
return JSON.stringify(data);
}
- 阈值:罕见组合如16核+8GB>风险中。
-
字体枚举:测量文本宽度探测系统字体列表。
- 采集代码:
function detectFonts() {
const baseFonts = ['monospace', 'sans-serif', 'serif'];
const testString = 'abcdefghijklmnopqrstuvwxyz0123456789';
const testSize = '72px';
const h = document.createElement('span');
h.style.fontSize = testSize;
h.innerHTML = testString;
const defaultWidth = {};
const defaultHeight = {};
baseFonts.forEach(font => {
h.style.fontFamily = font;
document.body.appendChild(h);
defaultWidth[font] = h.offsetWidth;
defaultHeight[font] = h.offsetHeight;
document.body.removeChild(h);
});
return 'fonts hash';
}
- 风险:安装>50种非常规字体易唯一。
构建交互式扫描器实现清单
-
HTML结构:单页应用,按钮触发各模块扫描,结果实时展示。
<div id="results"></div>
<button onclick="scanAll()">全扫描</button>
-
核心扫描函数:Promise.all并行采集,MD5哈希聚合。
async function scanAll() {
const fingerprints = await Promise.all([
getCanvasHash(),
getWebGLFingerprint(),
getHardwareSensors(),
detectFonts()
]);
const hash = btoa(fingerprints.join('|')).slice(0, 32);
document.getElementById('results').innerHTML = `<pre>${JSON.stringify(fingerprints, null, 2)}</pre><p>指纹哈希: ${hash}</p>`;
}
-
可视化与评分:柱状图显示熵值(-log2(1/唯一性概率)),红黄绿风险灯。
- 参数:熵>20高危;引用amiunique.org数据库对比(API限1/天)。
-
防护参数配置:
| API |
防护策略 |
阈值/参数 |
| Canvas |
噪声注入 |
像素偏移±1-3% |
| WebGL |
伪造vendor |
"Google Inc. - ANGLE" |
| Sensors |
权限拒否 |
queryPermission('accelerometer')='denied' |
| Fonts |
限制枚举 |
maxFonts=20 |
-
工程化部署:
- 框架:Vanilla JS或Vue单文件组件,便携。
- 托管:GitHub Pages,添加PWA离线审计。
- 监控:上报匿名哈希至自建DB,计算人群唯一性分布(GDPR合规)。
风险限制与回滚策略
- 兼容性:WebGL禁用fallback文本;传感器API仅HTTPS。
- 性能:Canvas渲染<50ms,字体测试限100种。
- 回滚:用户代理随机化作为兜底,概率1/1000碰撞。
- 限流:localStorage缓存24h,避免刷屏污染。
落地监控要点
- 唯一性评分:集成FingerprintJS开源库,实时估算全球排名。
- 变化检测:前后扫描diff,警报>10%变异(VPN切换)。
- 防护验证:集成uBlock Origin规则,阻Canvas探测脚本。
通过此扫描器,用户可量化隐私暴露,调整浏览器扩展(如CanvasBlocker)至风险<1%。实际部署中,结合Tor/Brave进一步降熵。
资料来源:
- BrowserLeaks.com:API采集参考。
- AmIUnique.org:"浏览器指纹在数百万样本中的唯一性1/86047。"(EFF Panopticlick更新版)。
(正文约1250字)