论文阅读 - Fashion Faux Pas: Implicit Stylistic Fingerprints for Bypassing Browsers’ Anti-Fingerprinting Defenses

本文是我在《Web 追踪前沿》上论文阅读作业之一。 Fashion Faux Pas: 绕过浏览器反指纹防御的隐性风格指纹。文章主要探索如何在不使用 JavaScript 的情况下生成浏览器指纹，以绕过现有浏览器的反指纹防御措施。核心在于利用不同环境对 HTML 元素渲染的差异性和 CSS 的媒体查询特性构造探针 HTML 元素，再配合 iframe 获取元素尺寸，从而反推出用户环境信息，据此提出了风格指纹的（Stylistic Fingerprints）概念。实验表明该方法在多款隐私导向型浏览器上均有效，与 FingerprintJS 的识别能力相当，且优于现有的 CSS 风格指纹。文章发表在 IEEE S&P 2023，作者来自伊利诺伊大学芝加哥分校和 IBM 公司。

背景和动机

浏览器指纹识别发展与问题

越来越多的用户、法律法规关注到浏览器指纹引起的隐私问题。在现代隐私导向的浏览器环境中，传统的基于 JavaScript 的指纹有效性受到可靠性挑战，有许多反跟踪防御技术：

1. 限制特定 API 调用：例如 Tor 浏览器会阻塞 Canvas API，某些浏览器可能会限制 WebRTC 的调用。
2. 随机化 API 返回值：例如 Brave 浏览器对 Canvas API 返回值进行随机化，WebGL、User-Agent 和硬件信息随机化等。
3. 限制系统资源访问：Firefox 限制网站可使用的系统字体，防止网站利用字体信息识别用户设备。

同时，新的指纹技术还需考虑性能开销问题，否则会阻碍其在现实世界中的部署。

研究动机

• 浏览器在不同的环境中呈现的 HTML 元素是不同的，受浏览器、OS、屏幕尺寸、系统字体等影响。CSS 具备媒体查询、字体加载等能力。
• 鉴于现有反跟踪防御主要针对基于 JavaScript API 的指纹技术，本文探索如何在不使用 JS API 的情况下生成指纹，通过利用 HTML 和 CSS 特征来推断用户环境信息，提出隐式风格浏览器指纹（stylistic fingerprints）的概念。
• 证明追踪者可利用其他特征和隐式技术追踪用户，且不受现有先进防御措施的影响。

实现效果

• 有效性：对包括 Safari、Firefox、Brave、Tor 等隐私导向型浏览器做了实证分析，证明了其有效性。同时，进行了一项时长9周的真实世界部署，结果显示该方法与 FingerprintJS 效果相当。同时还计算了指纹特征的熵，表明其较高的辨别性。
• 高效性：在性能开销上与 FingerprintJS 相比对页面渲染影响可忽略不计，用户交互延迟小于 100ms。
• 全面性：比先前 CSS 技术收集数据更全面，且对浏览器防御措施更具鲁棒性。

设计与实现

风格指纹

风格指纹是由网页呈现器生成的视觉属性构建而成的特征，完全依赖 CSS 和 HTML 元素，而无需调用 Javascript API。想实现这一点，有几个重要挑战：

• 须选择具有辨别能力的 HTML 元素，且需要在屏幕上有策略地排列，以保持稳定的指纹。
• 隐式方法推断特征可能会导致难以计数的网络请求，需要一种巧妙的设计。
• 需要一种有效的方法来编码 HTML 元素中的可用信息，以便服务器能够实际创建指纹。

CSS @media query 特性

CSS3 中的 @media 查询可以针对不同显示媒介和屏幕尺寸定义不同的样式，例如指定屏幕宽度小于 300 px 时的样式：（📺 demo 01-css3-media-query）

@media screen and (max-width: 300px) {
    body {
        background-color:lightblue;
    }
}

iframe 诱导的元素尺寸查询

@media 查询只能查询窗口或屏幕的尺寸，无法测定具体的 HTML 元素。因此通过引入 iframe 来诱使 @media测量元素的尺寸。

一个直观的实施方案为，每个 HTML 元素配合一个iframe使用，然而这样一来查询太多，对页面加载时间产生负面影响。因此采用对角排列元素来获得所有三个元素的尺寸之和。

这样一来，通过置入大量@media 查询，从服务器的请求记录中就可以得知目标 HTML 元素的尺寸。

【问题：】用 min-width 属性以升序排序，当一个匹配到之后，后面的尺寸就不用再测试了吧，如何停下来的呢？

识别方法

使用 25 个 iframe 和 339 个 HTML 元素，能够探测 30 种指纹特征，根据其指纹特征的类型分为四类：环境（Environment）、字体（Fonts）、广告拦截器（Ad blocker presence）、CSS 媒体属性（CSS media properties）。系统将这些探针元素都放置在一个 $800 \times 1000$ px 的 iframe 中，称为 main iframe。

Environment 识别

浏览器在不同的环境中呈现的 HTML 元素是不同的，受浏览器、OS、屏幕尺寸、系统字体等影响。例如对于 <textarea> 元素，在 MacOS Monterey 的 Chrome v99 中呈现的尺寸为 430px/150px，而在 Windows 11 中呈现为 432px/162px，在 Ubuntu 18.04 为 348px/145px。当浏览器版本发生变化（如 v93）时，这些尺寸也可能不同。文章使用了 101 种不同类型的 HTML 元素。

Fonts 识别

对于字体识别，一种常见的方案是：枚举一些 @font-face 规则，为每个字体设置远程加载 URL，如果字体存在本地，则不会请求伪造的 URL。

这种方式会导致大量的 HTTP 请求，为了减少这种性能开销，作者开发了一种基于元素尺寸的新型字体指纹识别方法：为一个 <span> 元素分配一个 Tesing font family 以及两个 fallback fonts，这里选用 Arial Black 和 Arial 作为回退字体，因为 Arial Black 在多数系统中存在且比其他字体家族宽度大。当测试字体家族不可用时，元素会回退到 Arial 进行渲染；若测试字体可用，则元素不会使用回退字体且会以不同尺寸渲染，通过观察元素尺寸变化来判断字体是否可用。【📺 demo 02-fonts-query】

Ad blocker 识别

使用 <img> 和 <div> 创造能命中常见广告拦截器（例如 AdBlock、AdGuard ）的元素，如果存在广告拦截器，则诱使广告拦截器删除该元素，不会请求对应 URL。

CSS media properties 识别

一个例子如下图所示，如果对应 media 特性被满足，则页面上将出现一个宽度为 2px 的 HTML 元素。最后，通过 iframe 探测相关 HTML 元素的尺寸，即可了解有哪些元素被渲染，反推出浏览器支持哪些 media 特性。

为优化性能，文章将构造的 HTML 元素根据它们所识别的属性进行分组，目的是最大限度地提高容器在辨别特定环境特征时的熵，并满足主 iframe 的高度限制。

对于同一组的 $n$ 个元素，支持对应属性则 $b_i=1$ ，否则 $b_i=0$ ，其总宽度或高度为

$$\sum_{i=0}^{n-1} b_i * 2^i $$

总和是基于 2 的幂次的独特组合，因此可推断每个 $b_i$ 的值。

定义了 3 个检测 Level，尽可能用上 @media 支持的属性，实现细粒度地检测设备特征。

方法部署

有几种常见的方式：

• 诱使用户访问专门的指纹识别网站
• 能够将一行 HTML 代码注入到合法网页中，使得用户响应中包含指纹识别负载
• 利用中间人代理服务在代理的网页响应中注入指纹代码。

实验结果

指纹识别防御的绕过

在 Firefox、Brave、Tor、Safari、Opera 等浏览器及相关隐私插件上进行测试，评估方法的抗指纹防御能力。

执行效率

网络方面，对 @font-face 的优化以及合理排布构造的 HTML 元素，大大减小少了网络请求数量。经传输压缩后，传输的资源约为 330 KB。

客户端开销方面，与 FingerprintJS 进行了对比。发现本文方法在 domInteractive 时间方面（DOM 树已准备好，可进行用户交互）比 JS 方法耗时更短，但 domComplete 时间显著增加了，对页面的加载效率影响还是较大的。总体上整个页面的加载时间小于 1 秒。

【问题：在老旧设备上呢？毕竟实验是在i9 macbook 上做的。】

实测研究

总体效果

作者在三个不同在线门户网站上部署了指纹识别系统，进行了为期9周的试点研究。用户对象主要是计算机科学家，且提前公布了这项研究计划，作者认为这些用户的隐私意识更强。结果表明提出的 StylisticFP 与 FingerprintJS 效果相当。

碰撞稳定性

• 跨访问稳定性方面：FPJS 在跨访问时因计算出不同指纹而无法识别 188 台设备，而本系统仅对 41 台设备失效，说明本系统在多次访问过程中更稳定，即相对不易因访问的变化而产生指纹的大幅变动，减少了因跨访问不稳定导致的识别失败情况。
• 跨设备稳定性方面：这种碰撞发生在具有软硬件的多个设备被分配相同指纹值的情况下，反映了在不同设备之间，由于系统的某些特性（如风格指纹相对稳定），可能会出现无法准确区分设备的情况。

💡 这里可以看出，指纹风格的稳定性需要找到一个合适的值。如果过于稳定，虽然在一定程度上保证了系统的可靠性和一致性，但会导致在相对同质的设备环境中出现较多碰撞，影响对设备的精确区分；而如果稳定性太差，像 FPJS 那样在跨访问时频繁改变指纹，又会导致大量设备无法被识别，降低系统的有效性。

实际上，既然该实验场景存在能够唯一确定用户的会话（Session）信息，我觉得评价指纹与用户身份之间的对应关系时，可采用标准化互信息（Normalized Mutual Information, NMI）作为指标，即：

$$ NMI(S,F) = \frac{2\cdot I(S;F)}{H(S) + H(F)} $$

$$ I(S;F) = H(S) - H(S|F) = H(F) - H(F|S) $$

其中，$I(S;F)$ 表示会话（Session）与指纹（Fingerprint）之间的互信息，反映两者共享的信息量，$H(S)$ 和 $H(F)$分别为会话和指纹的熵，表征各自的不确定性。

当指纹与会话完全一一对应时，条件熵 $H(S|F)$ 和 $H(F|S)$ 均为 $0$ ，此时 $NMI=1$ ；若两者完全独立，则 $NMI=0$ 。

特征熵值

作者采用 AmIUnique 提出的归一化香农熵来量化各种指纹识别特征的判别能力，如表1所示。

总之，实验表明隐式风格指纹不仅是现有技术的可行替代品，而且具有足够的辨别力，可以在现有的防御措施面前胜过 FPJS。

总结与思考

这篇文章巧妙利用了不同浏览器对 HTML 元素的显示差异，以及 CSS 中提供的媒体查询特性，将浏览器环境的属性差异转化为布局差异，再通过隐藏的 iframe 测量这些尺寸差异，将浏览器环境信息反馈给服务端并反推出属性。

这种不基于 Javascript 的新型指纹识别方法在对抗指纹防御方面有本质的优势，但 CSS 指纹识别能力较为局限，文章解决了其中几个关键问题：

1. 指纹属性局限性：先前 CSS 技术依赖的媒体特征有限，仅使用如 “any-pointer” 等常见的有限的媒体特征。本方法全面挖掘了 CSS 的潜力，支持23种媒体特征，在识别性方面达到 FPJS 的水准。

   为什么别人没想到或者用得少呢，是什么原因？

2. 性能问题：以往技术会产生大量网络请求，如某些方法生成 1347 个请求，而本方法通过优化设计（包括探针 HTML 元素的分组和幂次尺寸编码、字体 fallback 机制），显著减少了请求数量（优化后仅 83 个），降低网络占用。
3. 抗防御能力不足：如 Tor 禁止 @font-face 本地文件使用和强制某些媒体查询返回固定值会使先前技术失效，而本方法使用隐式推断，能有效绕过部分防御。

未来工作

缓解措施

作者提到两种可能的缓解措施：

1. 完全阻止 iframe，但这会导致许多网站工作不正常。
2. 阻止 media query，例如 Tor 就会报告一些虚假的媒体特性。然而欺骗所有媒体特性是不可行的，因为它们是响应式网页设计的关键部分。
3. 动态监控向服务端的资源请求；或者随机向 CSS 属性添加噪声。

该工作没有开源，对于缓解措施方面难以实际测试。但基于对论文的直观理解，我认为该方法的特征还是比较明显的，具有一定可检测性，在“问题讨论”章节继续展开。

非追踪用例

本研究侧重于风格指纹带来的隐私威胁，但浏览器指纹识别也可用于安全应用，如账户保护、风险控制等。

问题讨论

可检测性

基于论文核心技术点，检测逻辑可以聚焦以下特征：

1. iframe 内容可见性：大量透明、不可见背景的 iframe
2. 密集媒体查询：大量 min-width/min-height 的 CSS media query 规则
3. 字体指纹：使用 @font-face 加载本地字体
4. 广告拦截探针：包含触发多款广告拦截器的元素
5. 网格布局：使用 CSS Grid 对角线排列元素

最明显的一点在于， 为了不影响网页正常显示，以上特征元素均置于同一个 iframe 中，即 $800 \times 1000$ px 的 main iframe。

然而在实际部署中，可以通过页面间随机化探针布置等方式减少过于集中的特征。最关键的在于，作者提供了一种新的“风格指纹”思路，证明追踪者利用隐式技术追踪用户是可行的。

移动端可能显示异常

原文 2.5-HTML Element Arrangement 小节中提到：“我们将所有元素放置在一个 800px x 1000px 的 iframe（以下简称主 iframe）中，以确保元素的尺寸在不同的屏幕分辨率下保持一致。”

根据非权威统计数据显示，2024 年移动端浏览器典型分辨率为 $360 \times 800$ px，低于 main frame 所需尺寸，可能使浏览器出现非预期的滚动条，或者无法正常测量。

其他思考

1. 无 JavaScript 实施 XSS：

   M. Heiderich, M. Niemietz, F. Schuster, T. Holz, and J. Schwenk, “Scriptless attacks: stealing the pie without touching the sill,” in Proc. ACM Conf. Computer and Communications Security, 2012.

   https://www.nds.rub.de/media/emma/veroeffentlichungen/2012/08/16/scriptlessAttacks-ccs2012.pdf

   http://lcs.ios.ac.cn/~sws/downloads/liangbin.pptx

2. 由 csstracking.dev 开源的 CSS 指纹项目：https://github.com/OliverBrotchie/CSS-Fingerprint