什么是浏览器指纹？Canvas / WebGL / Audio 检测原理详解

浏览器指纹（Browser Fingerprint）是通过 JavaScript 在浏览器中收集的设备特征组合， 包括 Canvas 渲染结果、WebGL GPU 信息、Audio 处理特征、字体列表、屏幕参数、时区、语言等 15+ 个维度。 这些维度的组合在大多数情况下足以唯一识别一台设备，即使你删除 Cookie、切换 IP 也无法摆脱。

Electronic Frontier Foundation 的 Panopticlick 项目早在 2010 年就证明： 83.6% 的浏览器具有唯一指纹，每个用户在互联网上都是"独一无二"的。 这就是现代风控、反欺诈、广告定向的技术基础。

核心指纹维度

1. Canvas 指纹

网站让浏览器在 HTML5 Canvas 上绘制一段标准图形（文字、几何形状），然后调用 canvas.toDataURL() 获取像素数据并哈希。不同的 GPU、显卡驱动、操作系统在抗锯齿、字体渲染、Subpixel等环节会有微小差异，导致最终图像的哈希值不同。

典型 Canvas 测试代码：

const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
ctx.font = '16px Arial';
ctx.fillStyle = '#069';
ctx.fillText('ipcloak.ai 🔐', 4, 20);
const fingerprint = canvas.toDataURL();
// → 不同设备生成不同的 base64

Canvas 指纹的识别精度约 95%，是所有指纹中最稳定的一种。

2. WebGL 指纹

WebGL 暴露了 GPU 的厂商和型号（如 NVIDIA GeForce RTX 4090）， 以及 GPU 在 3D 渲染时的硬件特性。这些信息组合精度极高，能区分到具体设备型号。

const gl = canvas.getContext('webgl');
const ext = gl.getExtension('WEBGL_debug_renderer_info');
console.log(gl.getParameter(ext.UNMASKED_VENDOR_WEBGL));
console.log(gl.getParameter(ext.UNMASKED_RENDERER_WEBGL));
// → "Apple Inc." / "ANGLE (Apple, Apple M2 Pro, ...)"

3. Audio 指纹

浏览器的 Web Audio API 在生成、处理音频信号时，由于CPU 浮点运算精度差异，会产生微小的数值偏差。 通过 OscillatorNode + DynamicsCompressor 处理一段音频，对结果哈希就得到 Audio 指纹。

Audio 指纹比 Canvas 更隐蔽，但识别精度略低（约 80%）。

4. 字体列表

网站通过测量某些字符在不同字体下的宽度，可以判断哪些字体已安装。 字体列表反映操作系统差异（Windows 默认有 Arial、Calibri；macOS 默认有 SF Pro、Helvetica Neue）。

典型测试代码：

const span = document.createElement('span');
span.textContent = 'mmmmmmmmmmlli';
span.style.fontSize = '72px';
// 测试 'Arial' vs 'monospace' 时宽度
// 不同 → 'Arial' 已安装

5. 屏幕 & 硬件

• screen.width / screen.height
• screen.colorDepth
• navigator.hardwareConcurrency（CPU 核心数）
• navigator.deviceMemory（内存大小）
• navigator.maxTouchPoints（触屏点数）

6. 浅层指纹

• User-Agent：浏览器 / OS / 版本
• Languages：navigator.languages
• Timezone：Intl.DateTimeFormat().resolvedOptions().timeZone
• Cookie 启用状态
• Do Not Track
• Plugins / MimeTypes（现代浏览器已弱化）

指纹的稳定性

不同维度的稳定性差异很大：

组合精度

单个维度精度有限，但组合后精度爆炸式提升：

• 10 个维度组合后，重复率约 10⁻⁸（10 亿分之一）
• 15 个维度组合后，几乎可以唯一识别全球任意设备

这就是为什么指纹隔离不能只改一两个维度，必须 20+ 维度系统性伪造，且各维度保持一致性。

检测网站

想知道你当前浏览器的指纹？这些网站可以测试：

• BrowserLeaks（browserleaks.com）— 最全面
• Pixelscan（pixelscan.net）— 专注指纹一致性检查
• CreepJS（abrahamjuliot.github.io/creepjs）— 反检测对抗最强
• AmIUnique（amiunique.org）— EFF 系列

或者直接用 ipcloak.ai 浏览器指纹检测工具，免费且无追踪。

指纹隔离的难点

普通"隐私模式"只能清空 Cookie，对指纹完全无效。 简单地修改 UA 或屏蔽 Canvas 也行不通 —— 现代风控会校验各维度的一致性：

• UA 声明 Mac，但 WebGL 是 NVIDIA 显卡 → 异常
• UA 声明 iPhone，但屏幕是 1920×1080 → 异常
• 时区 UTC+9，但 IP 在美国 → 异常
• UA 声明 Chrome 120，但 JS 行为像 Chrome 90 → 异常

真正的指纹隔离需要定制浏览器内核，在底层伪造各维度并保持一致 —— 这是 ipcloak.ai Browser 这种指纹浏览器的核心能力。