它是什么
getClientRects() 与 getBoundingClientRect() 以亚像素精度返回元素的位置和尺寸。给一段带样式的文字套上 3D 变换,小数部分就取决于布局引擎、它选中的字体以及取整方式——又一个算出来的签名。
网站怎么读
el.style.transform = 'matrix3d(0.7071, 0.31, 0, 0.0001, ...)';
const r = el.getClientRects()[0];
hash([r.x, r.y, r.width, r.height]); // sub-pixel values differ per engine + font一个隐藏元素被测量一两次,数字被哈希。同一台机器上的同一个页面,返回的小数精确到六位都相同。
为什么它能认出你
这些值编码了字体度量和引擎取整,所以会随操作系统、浏览器版本和已安装字体变化——除此之外纹丝不动。它们还从另一个角度交叉校验 Canvas 与字体信号。
风控怎么用它
主要测试是稳定性:同一元素的两次测量必须完全相同。一个在两次读取之间、或在标签页之间漂移的值,只会在有东西在数字送达页面的路上改写它时出现。
常见翻车点
对 rect 值加每次调用都变的随机噪声;噪声破坏了页面布局逻辑;rect 值与环境声称的字体集合不相符。
Mango 正在接受候补登记。以下介绍首发能力,客户端将在发放邀请后开放使用。
Mango Browser 如何处理
噪声按环境对 rect 值施加确定性偏移,两次读取永远相同。
检测你的值
跳转到你的检测结果中的这一项。