網頁不需授權就能讀取螢幕尺寸、availHeight 與 devicePixelRatio。它們洩露什麼、為何熵低,Tor letterboxing 如何遮蔽?
你開啟的每個網頁都能讀取螢幕有多大、作業系統留給頁面多少空間,以及每個 CSS 像素背後有多少實體像素,整個過程不需要任何權限彈窗。單獨來看,這是一個常見的低熵值,但它是追蹤者往更大指紋裡加入的成本最低的訊號之一,也是偵測方最容易交叉核對的訊號之一。
核心要點
- 網頁無需提示即可讀取
screen.width、screen.height、screen.availWidth、screen.availHeight、screen.colorDepth與window.devicePixelRatio。 availHeight通常小於height,因為工作列、Dock 或選單列佔用了空間;這個差值會暴露部分桌面配置。devicePixelRatio會隨顯示縮放與瀏覽器縮放變化,因此它描述的是你目前的設定,而不只是硬體。- 螢幕數值單獨看熵很低。它們的意義在於與 GPU、字型和平台相乘,正如匿名集的計算所示。
- 防護手段的思路是把所有人歸入少數幾個「桶」:Tor Browser 的 letterboxing 與 Firefox 的 resist-fingerprinting 取整。
網頁能讀到什麼
MDN 上的 Screen 介面列出了視窗所在螢幕的屬性。指紋辨識中用到的有:
| 屬性 | 回報內容 |
|---|---|
screen.width / screen.height | 螢幕尺寸(CSS 像素) |
screen.availWidth / screen.availHeight | 頁面可用空間,已扣除工作列等系統介面 |
screen.colorDepth | 每像素用於顏色的位元數 |
window.devicePixelRatio | 實體像素與 CSS 像素之比 |
window.innerWidth / outerWidth(及高度) | 視口尺寸與整個瀏覽器視窗尺寸 |
視窗尺寸與螢幕屬性一起定義在 W3C 的 CSSOM View Module 中。請注意 width 與 height 以 CSS 像素計,而不是硬體像素。實體面板為 2880×1800、裝置像素比為 2 的筆電,通常會回報 1440×900。
可用尺寸為何不同於完整尺寸
MDN 的 availWidth 頁面把該值描述為螢幕寬度減去所有常駐顯示的使用者介面元素(如工作列);availHeight 同理。因此,若螢幕回報為 1920×1080 而 availHeight 為 1040,就表示約 40 像素高的區域被保留,可能是工作列。自動隱藏的 Dock,或位於其他邊緣的選單列,則會產生不同的數字。
這個差值是對桌面配置方式的一點真實洩露。兩位使用者即使螢幕完全相同,也可能因工作列大小、位置或自動隱藏設定而在此處不同。我們不在這裡列出各作業系統的具體差值,因為它們會隨系統版本與使用者設定變化。
devicePixelRatio:縮放會透出來
MDN 的 devicePixelRatio 頁面將其定義為目前顯示裝置上實體像素解析度與 CSS 像素解析度之比。有兩件事會改變它:
- 顯示縮放。 在系統設定中縮放為 150% 的 4K 螢幕,與 100% 時回報的比值不同。
- 瀏覽器縮放。 在許多桌面瀏覽器上,縮放會改變該比值,因為它改變了覆蓋一個 CSS 像素的裝置像素數。MDN 指出縮放會影響該值,所以同一台機器的兩次造訪也可能不同。
因此它反映的是你目前的設定。它還能幫助區分高密度螢幕與一般螢幕上的瀏覽器,這是僅靠 screen.width 做不到的。
追蹤者為何仍然想要它
1920×1080 的螢幕被極大比例的桌面使用者共用,所以單看這個值,你只是身處很大的人群中。風險在於相乘:每個獨立屬性都會縮小人群,而螢幕幾何與 GPU 繪圖器、字型清單和時區相互獨立。瀏覽器指紋辨識指南列出了螢幕資料在各類訊號中的位置,熵與匿名集則展示了少量低熵位元如何累加。
它還有兩個追蹤者喜歡的特性:它是被動的,不需要 API 探測或繪圖測試,只需讀取屬性;它也廉價,瞬間完成,不會產生可見延遲。
異常值更顯眼。罕見的螢幕尺寸、自訂縮放帶來的非整數比值,或任何標準螢幕都不會產生的視窗尺寸,縮小人群的幅度遠大於常見的 1080p 面板。行動裝置瀏覽器指紋識別介紹了像素比種類繁多的手機與桌面有何不同。
視窗尺寸是另一個訊號
頁面不僅能讀取螢幕,還能讀取視口與瀏覽器視窗的尺寸。它們會在你調整大小、貼齊或開啟開發者工具時變化,因此更像是在標識一次工作階段,而不是一台裝置。它們也會洩露一點脈絡:視口比螢幕窄,表示視窗沒有最大化。CSS 媒體查詢指紋識別一文展示了相關路徑:CSS 查詢無需腳本讀取 screen 就能暴露類似的幾何資訊。
多螢幕與 Window Management API
有多台螢幕時,基礎的 screen 物件只描述視窗所在的那一台。Window Management API 旨在讓頁面取得所有已連接螢幕的詳情,並跨螢幕放置視窗。MDN 將其描述為需要權限,因此它不像上述屬性那樣屬於無提示訊號。我們不宣稱哪些瀏覽器支援它;請到該頁面的相容性表中查看你的目標瀏覽器。
一致性角度
螢幕數值應與瀏覽器聲稱的裝置相符。手機 UA 卻回報 2560×1440 的螢幕且像素比為 1,就是不相符;視窗比它所在的螢幕還大,同樣如此。只改 UA 而忘記螢幕的自動化工具,正好會留下這種破綻。指紋一致性檢查清單在七項檢查中包含螢幕檢查,hardwareConcurrency 與 deviceMemory則介紹了另一組可用於合理性比對的數值。
繪製幾何是另一處交叉核對。透過腳本量測的頁面元素取決於縮放,正如 ClientRects 指紋識別所解釋的,聲稱的比值與量得的幾何不符,裝置偽裝又多了一處可能露餡的地方。
防護:取整進桶
防護的目標是更大的人群,而不是隨機偽造。
- Tor Browser 的 letterboxing。 Tor Browser 9.0 發布公告描述了把內容視窗取整為 200×100 像素的整數倍,使使用者落入少數幾個桶。Letterboxing 透過加入白色邊距來應對調整大小與最大化,使視窗盡量接近期望尺寸,同時仍落在某個桶內。
- Firefox resist-fingerprinting。
privacy.resistFingerprinting借用了同樣的取整思路。它改變什麼、又會破壞什麼,請參見 resist-fingerprinting 詳解。
代價顯而易見:頁面周圍有邊距,版面略不精確。
BrowserInsight 實際做了什麼
如實說明:指紋檢測按瀏覽器的原樣回報顯示寬×高、裝置像素比、色深與可用區域。機器人偵測頁面對螢幕尺寸做合理範圍檢查(寬 320 至 7680,高 480 至 4320)。當 UA 聲稱是行動裝置時,它的開發者工具檢測還會比較瀏覽器外部視窗尺寸與螢幕尺寸,因為兩者相差很大通常代表正在使用 DevTools 裝置模擬。除此之外,它不會把螢幕數值與你的 UA 或 GPU 交叉比對。所有蒐集都在瀏覽器本機執行,不會向伺服器傳送任何內容。
常見問題
我的螢幕解析度是唯一的嗎? 單獨來看很少如此。常見尺寸被許多人共用。只有與其他訊號結合時才具備識別力。
為什麼 availHeight 與 height 不同?
系統為工作列或 Dock 等介面保留了空間,availHeight 將其排除。
瀏覽器縮放會改變螢幕尺寸嗎?
它一定會改變 devicePixelRatio 與以 CSS 像素計的視口尺寸;回報的螢幕尺寸是否跟著變則取決於瀏覽器,所以別把 screen.width 當成不受縮放影響的值。
VPN 能隱藏螢幕解析度嗎? 不能。VPN 改變的是網路位址,而不是瀏覽器對其顯示器的回報。
總結
螢幕尺寸、可用區域與像素比是細小的被動訊號,不需權限,卻能為任何指紋增加幾個位元。它們更大的作用是作為對瀏覽器所聲稱裝置的合理性檢查。在指紋檢測工具上查看你的瀏覽器回報了什麼,並閱讀瀏覽器指紋辨識指南了解全貌。


