浏览器指纹，一个挺实用的知识点

今天咱们来唠一个挺实用的知识点------浏览器指纹。

一、这东西是干啥的？

简单来说，浏览器指纹就像是你上网时的"隐形身份证"。哪怕你不登录、不开账号，甚至每次开无痕模式，它还是能认出你。

比如说，你在淘宝上看了一个商品，没登录，然后你跑到B站或者抖音，哎，怎么推荐还是类似的东西？其实背后就是浏览器指纹在起作用。

二、它是怎么生成的？

它的基本原理是这样的：世界上几乎没有两个完全相同的浏览器环境。这里的"环境"包括：

浏览器类型和版本（Chrome、Firefox、Safari...）
操作系统（Windows、macOS...）
屏幕分辨率
安装的字体列表
语言设置
硬件信息（比如 CPU 核心数、内存）
IP 地址（虽然是可变的）
还有更细节的，比如 Canvas 绘图指纹、WebGL 渲染器等

我们会从这些信息中提取特征，组合在一起，生成一个"哈希值"，就相当于你的浏览器指纹。

三、举个例子：Canvas 指纹

Canvas 是 HTML5 里的一个画图功能，不同电脑、不同浏览器画出来的图，在像素级别其实有细微差异。我们可以利用这个差异生成指纹。

下面是一段示例代码，你可以在浏览器控制台里试试：

javascript 复制代码

function getCanvasFingerprint() {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    const text = 'hello, fingerprint!';

    ctx.textBaseline = 'top';
    ctx.font = '14px Arial';
    ctx.fillStyle = '#f60';
    ctx.fillRect(0, 0, 100, 60);
    ctx.fillStyle = '#069';
    ctx.fillText(text, 2, 15);
    
    return canvas.toDataURL();
}

function hashFingerprint(str) {
    let hash = 0;
    for (let i = 0; i < str.length; i++) {
        hash = (hash << 5) - hash + str.charCodeAt(i);
        hash |= 0;
    }
    return hash;
}

const dataUrl = getCanvasFingerprint();
const fingerprint = hashFingerprint(dataUrl);

console.log('你的Canvas指纹是：', fingerprint);

你可以在不同浏览器、无痕模式、甚至不同电脑上运行这段代码，看看得出的数值是不是不一样。

四、实际应用场景

场景	说明
广告跟踪	跨站识别用户，推送相关广告
防刷机制	比如投票、抢券，一个浏览器只算一人
风控与反欺诈	识别是否恶意登录、盗号等
区域限制绕过检测	即使用 VPN 换IP，浏览器环境没变，还是能被认出来

五、如何应对或绕过？

有些人会用"指纹浏览器"工具来模拟不同环境，比如：

多开浏览器窗口，每个窗口独立指纹
修改 Canvas、WebGL 等返回值
模拟不同分辨率、时区、语言等

常见工具有：Multilogin、AdsPower、Browserling（部分付费）。做跨境电商、TikTok 运营的同学应该比较熟悉。

六、总结一下

浏览器指纹是一种通过收集浏览器和环境特征来识别用户的技术。虽然不是100%唯一，但准确率已经非常高，广泛应用于广告、风控、反爬等场景。

如果你要做项目，可以用现成的库，比如 FingerprintJS（开源），几行代码就能集成。

就这样，有啥问题欢迎留言讨论！