Browser Fingerprinting Techniques on Web Tracking 筆記

Passive Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

Passive Fingerprinting #

我們首先從 passive fingerprinting 開始談起。Passive fingerprinting 是那些只從請求內容就可以得出的特徵。此章節介紹三種：IP Address、HTTP request header、TLS。這些特徵用於 fingerprinting 時都不會使用到 JavaScript，只需要檢視請求內容即可。

IP Address #

IP address 幾乎可以說是最早用於 web tracking 的特徵，通常藉由 IP address 便可以把使用者定位在很小一個群體了。不過由於 IP address 時常變換，尤其在行動世代，使用者會一直換基地台、換 WiFi AP，偶而掛個 VPN，且大家共享 public IP address 的狀況已經是常態，IP address 已經沒什麼參考價值了。

User Agent #

User agent 是夾帶於 HTTP request header 的字串，其透漏了使用者的作業系統、瀏覽器與其版本等。舉例來說，我所使用的瀏覽器目前的 User Agent 是：

Fonts Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

Fonts Fingerprinting #

每個人的電腦都裝有不同的字型，也可能有不同的預設字型，這所造成的影響，除了成為所有前端工程師的惡夢以外，也成為 browser fingerprinting 的 entropy 來源：既然每個人都有不同的字型，而且大家不會頻繁地安裝新的字型，那麼使用者設備所配備的字型便成為可用的特徵。我們將於此章介紹幾個可以找到瀏覽器裝有哪些字型的方法，以及 Fonts Fingerprinting 的危害。

在遠古時代，Flash 可以直接列舉出所有字型，但顯然現在沒有人在用 Flash 了。目前並沒有任何 API 可以直接枚舉出所有字型，也沒有 API 可以直接查詢一個字型是否存在，所以能做的只有，先列出所有我們想測試是否存在的字型，然後利用各種 side-channel 去依序測試哪些字型真的存在。

篩選待測字型 #

列出字型乍看之下並非難事，然而如何最有效率地找到足夠獨特的特徵，則不是個簡單的任務。核心要點是，所選的字型必須具有代表性。

一般而言，可以將網頁上的字型分為三類：

網頁字型：網頁自帶的字型。因為其不來自使用者的設備，這沒辦法用於 fonts fingerprinting。然而網頁字型的功能本身可以協助 fingerprint 其他字型。
系統字型：作業系統自帶的字型，通常使用該作業系統的裝置都會搭載該字型。雖然這可能有些用，但作業系統往往可以從其他方式做推論（例如 user agent），所以這個幫助也很有限。然而，在未來討論到一些有問題的防禦手段時，針對系統字型的 fingerprinting 可以派上用場。此外，部分作業系統會根據不同語言自動安裝不同字型，這使得特殊語言的字型可以用於 fingerprinting。
使用者自己安裝的字型：有些字型是使用者自己安裝的，無論是主動安裝，或是因為安裝一些軟體而被安裝（例如有些辦公軟體會自帶一些字型）。這些往往是最有 fingerprinting 價值，因為其通常足夠獨特。

因此，系統字型如「蘋方」（Apple 針對中文市場內建的字型）、Roboto（Android 與 Chrome OS 內建字型）等可以提供一些關於作業系統的資訊。一些使用者必須自行安裝的字型，或是隨著如 Microsoft Office、Adobe CC 等套裝軟體而一起安裝的字型，則因足夠獨特而成為 fingerprinting 的首選。像是 Arial 或 Times New Roman 等大家都有的字型，則不會有什麼幫助而可以直接忽略。

Canvas Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

Canvas Fingerprinting #

最早對 browser fingerprinting 都聚焦在一些明顯可見的、分布清楚的各種屬性，例如 user agent 的不同是一翻兩瞪眼的，任何人都看得出來。在 2012 年時，Mowery 與 Shacham 發現了一個 browser fingerprinting 方法： HTML5 的 Canvas API 在不同平台上 render 的結果的細微差異，利用這些細微差異，便可以提供足夠的資訊做 fingerprinting。因此，我只要讓 Canvas API 畫出一張圖，並取出繪圖結果，便可達成一個足夠獨特的特徵。這個發現徹底改變了 web tracking 的生態，也改變了大家對 browser fingerprinting 的看法。這可能是第一次有這麼高準確度又 practical 的 browser fingerprinting 方法，而且其特徵還是如此隱微的、肉眼完全不可見的差異。

前言 #

Canvas 直譯是「畫布」，顧名思義，這東西與畫圖有關。我們需要先區分 Canvas API 與 <canvas> 兩個看起來很像但其實不同的東西。Canvas API是一個可以讓 JavaScript 繪製 2D 圖形的工具，它提供了許多畫圖的 method，像是畫直線、畫矩形、填充顏色、插入文字等。<canvas> 是 HTML 的一個 tag，它如同其名，真的是個畫布，讓 Canvas API、WebGL API 等在其之上繪圖。

WebGL Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

WebGL Fingerprinting #

WebGL Fingerprinting 分成兩個部份：WebGL Report Fingerprinting 與 WebGL Canvas Fingerpinting，後者基本上就是 canvas fingerprinting 的 WebGL 版本，所以才說他們是近親。WebGL Fingerprinting 利用了每台電腦在軟硬體上的不同，尤其是顯卡與顯示驅動不同，來做 fingerprinting。有趣的是，因為同一台電腦配備的顯卡一樣，所以 WebGL Fingerprinting 有可能用於跨瀏覽器的 tracking，不過這部份的討論會放到其他專文。

何謂 WebGL #

一言以蔽之，WebGL 是 OpenGL 的 Web 版本。WebGL 提供了一個介面（interface）讓開發者可以藉由 JavaScript 操作 OpenGL ES 的 API，因此得以借助此 API 在瀏覽器中實現 2D 與 3D 的繪圖，並輸出至 <canvas>，其中不需要使用瀏覽器外掛。WebGL 的程式大概包含幾個部份：JavaScript 控制主要邏輯，GLSL（OpenGL Shading Language）處理著色器的邏輯，然後 GPU 執行著色器的程式碼。

WebRTC Fingerprinting + Media Device Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

WebRTC Fingerprinting + Media Device Fingerprinting #

此章將介紹兩個與 WebRTC 有關的 browser fingerprinting 技術。WebRTC fingerprinting 利用 WebRTC 的設計，有可能洩漏使用者的 public 與 local IP address，甚至即便使用 VPN 亦可能洩漏真實 IP address，不過這個漏洞已經被修補。Media device fingerprinting 則是利用了 browser 可以取得攝影機、麥克風等多媒體設備的特性，枚舉出多媒體設備並以此作為 fingerprint。

WebRTC (Web Real-Time Communication) 是一個允許網頁取得影音媒體、串流影音（或任意資料）的 API。最常見的應用是線上會議軟體，網頁擷取了攝影機與麥克風的輸入，並將其串流出去。另外一個應用是在瀏覽器上做 P2P（peer-to-peer）的檔案傳輸。WebRTC 的一大特色是，這是一個 P2P 的傳輸協定，也就是資訊串流不經過伺服器，而是直接在兩個瀏覽器之間互相傳輸。

WebRTC Fingerprinting #

WebRTC 使用 P2P 通訊，為了找到兩端之間的路徑，勢必需要知道對方的位置。可是如果客戶端躲在 NAT1 裡面或防火牆後面，便拿不到 public IP address，也就無法告訴對方自己在哪邊，因而無法建立 WebRTC 連線。為了確保 WebRTC 在這種情境下仍然可以建立連線，開發者可以使用 ICE（Interactive Connectivity Establishment）。ICE 旨在尋找最佳的連線路徑。首先，ICE 嘗試使用作業系統和網卡提供的 IP address 連線，如果裝置在 NAT 後面，當然會失敗；接著 ICE 會藉助STUN（Session Traversal Utilities for NAT）伺服器取得 public IP address；如果仍然不行，ICE 會再藉由 TURN（Traversal Using Relay NAT）中繼伺服器轉送資料。STUN 伺服器的任務很簡單：檢查請求的 IP address，並將其回傳給請求者，從而使請求者可以知道自己的 public IP address 與 port。如果 ICE 可以成功得到有效的連線資訊，便能提供 WebRTC 使用，以此建立 P2P 連線。此外，為了讓內網之間的兩端在建立連線時，可以不用經過外網繞一整圈，ICE 也會掃描所有網路介面（interface）並取得對應的 local IP，以偵測有沒有不繞外網一大圈的路徑。上面的描述有著許多簡化，不過此處重點是：藉由 STUN server，WebRTC 可能可以拿到所有介面的 local 與 public IP address，並且有可能因為存取了 VPN client 以外的介面而繞過 VPN，即便躲在 VPN 後面，一樣可以拿到真實的 public IP address。

WebAudio Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

Audio Fingerprinting #

Audio fingerprinting 是指涉利用 Web Audio API 來做 browser fingerprinting 的技術。Web Audio API 是個專門用於在 browser 處理音訊的 API。一如往常的，有人發現 Web Audio API 在不同的軟硬體設備上會產生不同的結果，而且在同一台電腦的同一個瀏覽器上，所產生的結果很穩定與持久，所以可以用來做 fingerprinting。

Web Audio API #

Web Audio API 是一個在 browser 中處理音訊的 API，其可以建立音訊、載入現存音訊、加入特效等。整個操作流程都是在 AudioContext 底下完成，以 audio nodes（音訊節點）作為音訊作業的基本單元，這些 audio nodes 可以互相連接，建構出 audio routing graphs（音訊路由圖）。Audio routing graph 起於一個或多個音訊來源（可以是動態產生的或載入現存檔案），音訊來源會將音訊取樣，切成很多個 sample。接著，音訊的 sample 會順著路由經過各種處理，例如調整音量、加入特效、混音等。當音訊已經走完所有處理程序，最後就會走到整個 audio routing graph 的終點：可能是播放出來或是儲存進一個 buffer。

Browser Extensions Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

Browser Extensions Fingerprinting #

Browser extension（有時譯為「擴充套件」）是指像是 ad blocker、MetaMask 等附加於 browser 之上，可以改變瀏覽器與網頁呈現、行為、功能等的程式。它們通常使用 JavaScript、HTML 和 CSS 編寫，並藉由瀏覽器 API 與瀏覽器進行互動，並為瀏覽器添加新的功能或改進現有功能。然而，既然 browser extension 可以改變網頁呈現與擴充功能，如果我們可以偵測到網頁的行為或呈現方式改變了，是不是就意味著可以偵測到一個 browser extension 存在。而且，每個人安裝的 browser extension 都不太一樣，於是只要能偵測哪些 browser extension 存在，便可將使用者有安裝的 browser extension 列表作為 fingerprint。這正是 browser extension fingerprinting 的核心概念。

此外，追蹤者還可以根據使用者安裝了哪些 browser extension 做更進一步的 profiling。例如，如果偵測到有安裝一些開發工具，那使用者大概是工程師。或甚至，如果有偵測到一些防毒軟體用於提醒惡意網站的 browser extension，則可能透漏使用者啟用某款特定防毒軟體，這些資訊洩漏在做攻擊時將很有價值。

Browser Extension 簡介 #

首先，我們必須先理解 browser extension 是什麼。一開始必須先釐清 browser extension 不是 browser plugin，後者如今已經不常見了。Browser plugin 的主要功能是，它可以註冊一些它支援的 content type，當瀏覽器遇到這種 content type 時，就會呼叫 browser plugin 來處理該資料。Browser plugin 通常是直接跑在作業系統的執行檔（executable）。早期通常使用 NPAPI（Netscape Plugin API），它比 IE 還要古早，基本上已經沒人使用，取而代之的有 Chrome 的 PPAPI 和 IE 的 ActiveX，但兩者也都已經沒落。Browser plugin 常見的應用有像是 Flash Player、WebATM、自然人憑證程式之類的。

Ad Blocker Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

Ad Blocker Fingerprinting #

曾經我們討論過，阻擋 tracker 的方法中，最廣泛被使用的是 filter list，也就是去列出我想要阻擋的黑名單，然後 ad blocker 會根據 filter list 去阻擋 tracker。Ad blocker 不但可以改善使用體驗，還可以藉由阻擋 tracker 來減少隱私侵害。Ad blocker 的運作方式已經在前文討論過，簡單來說，ad blocker 會阻擋 filter list 上指定的 HTTP request 以及隱藏指定的 DOM element，而這些改變是可以被有效偵測的。

另外，在 Ad blocker 的世界中，並不存在一個世界統一的 filter list，雖然會有幾個最大咖的（e.g. Easylist），但也會有眾多不那麼知名的但同樣好用的（e.g. Peter Lowe’s Ad and tracking server list）、針對特定語系的（e.g. AdGuard Japanese）、針對特定類型內容的（e.g. Online Malicious URL Blocklist）。如果全部 filter list 都啟用，可能造成效能不彰，所以使用者會根據自己需求去挑選他需要的 filter list，或是 ad blocker 可能會根據系統語言去自動地啟用相對應的 filter list。於是作為中文使用者，我會使用針對中文網站的 filter list（e.g. Easylist China），但不會去用針對德文網站的 filter list（e.g. EasyList Germany），反正我也不會瀏覽德文的網站。

CPU Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

CPU Fingerprinting #

如果前面兩篇 browser extension 的 fingerprinting 還沒有嚇倒你的話，從這一篇開始，我們會進入一個很瘋狂的狀態，一種「天啊這樣也行喔？」的狀態。

那，首先就從 CPU fingerprinting 開始講起吧。這篇文章會用到一些計算機結構的基礎知識，都是非常簡單的東西，所以只要是我在修計算機結構時聽過的詞彙，就不會多加解釋，畢竟我金魚腦，這麼多年前修課而且現在還記得，應該就代表多數有修過計結的都會記得… 吧？

何謂 CPU Fingerprinting #

雖然說是 CPU fingerprinting，但我們不是要去 fingerprint 每個 CPU 之間的些微差異，而是要去識別一個 CPU 的重要特徵，像是幾個 core、cache 多大等，藉此作為 fingerprint 的一部分。

CPU fingerprint 除了拿來做 web tracking 以外，也有其他用途，像是情蒐之類的，例如這幾年很多基於 speculative execution 和 out-of-order execution 的各種 side channel attack，如果可以了解對象所使用的 CPU，便可以發動攻擊。

不過 CPU fingerprint 之所以說是瘋狂，就在於它很難！當代的 browser 基本上都有很嚴密的 sandbox，可以執行的指令很受限，盡可能避免 browser 上執行的任何程式可以獲得過多的資訊。基本上在 browser 上能做的也就只有 Javascript 與 WebAssembly，頂多運用 Just-in-time compiler 的特徵來做更多事情，但仍非常受限。此外，如果要在 browser 上做針對 CPU 的 timing attack 或其他 side-channel attack，會受到許多影響，畢竟 browser 自己就有非常受限的 scheduling 的機制、OS 再一層 scheduling，再加上各種 noise，許多有用的資訊都被掩埋在雜訊中了。所以，要在 browser 上執行一些程式來洩漏 CPU 資訊沒有那麼 trivial。

Battery Status Fingerprinting

Mon, 01 Jan 0001 00:00:00 +0000

Battery Status Fingerprinting #

HTML5 提供了一些使網頁開發者得以取得硬體資訊的 API，其中一個是 Battery Status API，其原本是用來讓網站監控裝置的電池狀態，以提供更好的用戶體驗。電池狀態有許多優勢，例如，開發者可以根據使用者的電量來決定要提供高效能版本或省電版本，或當然也有可能用於一些不那麼正當的用途，例如 Uber 發現使用者在手機快沒電時傾向於接受比較高的價格1。這個功能看起來非常無害，甚至標準制訂者一開始也不認為這可能有什麼安全性威脅。然而，2015 年時，Olejnik 等人發現，該 API 也可能被用來進行 browser fingerprinting。更甚至，2016 年時 Englehardt 等人發現真的有 tracker 正在積極地使用 Battery Status API 做 fingerprinting。我們將這種技術稱為 Battery Status Fingerprinting。

Battery Status API #

Battery Status API 可以提供一些關於電池的資訊，包含電量（level，0.0 ~ 1.0）、是否在充電（charging，布林值）、預期還有多久可以充滿電（chargingTime，整數秒）、預期還有多久會消耗完電池（dischargingTime，整數秒）。

navigator.getBattery().then(console.log);


Scheme Flooding
Mon, 01 Jan 0001 00:00:00 +0000

 Scheme Flooding
 #

之前我們看到可以藉由使用者安裝的 browser extension 來做 fingerprinting，於是不禁想問：電腦上裝的應用程式有沒有可能也拿來做 fingerprinting？或是更重要的，有辦法在 browser 上知道系統有哪些應用程式嗎？今天想來介紹一個很有趣的 Browser Fingerprinting 技術稱為 scheme flooding。許多應用程式有所謂的 “custom URL scheme” 或是 “custom protocol handler”，例如 skype:, spotify:, itunes: 等，當瀏覽器看到這些 protocol handler 時，便會嘗試打開相對應的應用程式。這個功能看似好用，但可能打開新的 attack vector。假如我可以窮舉所有 protocol handler，看哪些會有反應，似乎就可以知道使用者安裝了哪些應用程式，並藉由這項資訊來做 profiling 與 tracking。這就是所謂的 scheme flooding。
大家可以嘗試到這個網站看看你的瀏覽器有沒有出賣你：https://schemeflood.com/
但在開始之前，我想要先針對一些用字與定義做一些說明。在此文中我把 scheme flooding 定位成一種 browser fingerprinting 技術，但這樣的定義會有兩種問題。首先，scheme flooding 在發現者眼中是一種「可以達成 fingerprinting 的漏洞」，而不是單純的 fingerprinting 技術，在
 有些媒體上也稱之為漏洞，此處我無意開啟何謂漏洞的討論，而是只想把重點著重在：這個特性可以被用來做 fingerprinting，至於它本身是不是漏洞，並非此文討論的重點。此外，scheme flooding 是 fingerprinting 技術，但它算是 browser fingerprinting 技術嗎？這部份涉及了 browser fingerprinting 的嚴格定義，不過考慮到 scheme flooding 符合 (1) 只需要在 browser 上做運算，而沒有儲存任何內容，也就是 stateless 的，以及 (2) 其所刺探的資訊與 browser 所運行的 OS 有關（嚴格來說，OS 之中安裝了哪些程式），所以我還是想將其定義為 browser fingerprinting。如果讀者不認同我的定義，一來我很期待能聽到不同意見，二來即便此文在讀者眼中可能用字不精確，但我相信還是會有些幫助的。


Fingerprinting via CSS
Mon, 01 Jan 0001 00:00:00 +0000

 Fingerprinting via CSS (JS-less Fingerprinting)
 #

過去我們討論 browser fingerprinting 時，總是離不開 JavaScript，無論是蒐集 JavaScript 本身的性質或是利用 JavaScript 去蒐集瀏覽器其他的性質，都建立在我們可以使用 JavaScript，事實上多數 browser fingerprinting 都需要 JavaScript 才可以執行。但如果沒有 JavaScript，還有可能做 browser fingerprinting 嗎？這篇文章將會討論，如果沒有 JavaScript，如何單純使用 CSS 達到 browser fingerprinting。
不過可能要先澄清一下，「停用 JavaScript 可以避免 browser fingerprinting」這樣的建議沒有錯，有鑑於幾乎所有 tracker 都還是仰賴 JavaScript，這是個完全合理且有效的策略。我只是要展示如何作到沒有 JavaScript 的 browser fingerprinting，沒有要反駁這個建議。甚至我認為本章節所介紹的各種 Javascript-less Fingerprinting 技術主要還是有趣而已，實用價值遠不如前面提過的其他 browser fingerprinting 方法。
Browser fingerprint 的過程可以分為三大步驟：1) 讀取各個 feature 的值；2)聚集起來製成 fingerprint；3) 回傳給 server。第一步是否需要 JavaScript 取決於是什麼特徵。至於第二步，乍看之下，似乎需要 JavaScript 才能作到這樣的複雜運算，只有 CSS 大概是做不太到，但是如果把聚合成 fingerprint 的環節移動到 server-side，客戶端只負責蒐集好資訊並回傳給伺服器，則似乎就可以不用到 JavaScript 了。至於第三步，雖然除了 JavaScript 以外還有許多方式發請求，但如果沒有 JavaScript 在中間幫忙傳遞數值，可以使用的方法也會相對受限。在以下討論中，我們並不會特別區分三個步驟，但讀者可以尤其注意每個部分分別對應到上面三個步驟的哪一步。

Browser Fingerprinting Techniques on Web Tracking 筆記

Passive Fingerprinting

Passive Fingerprinting #

IP Address #

User Agent #

Fonts Fingerprinting

Fonts Fingerprinting #

篩選待測字型 #

Canvas Fingerprinting

Canvas Fingerprinting #

前言 #

WebGL Fingerprinting

WebGL Fingerprinting #

何謂 WebGL #

WebRTC Fingerprinting + Media Device Fingerprinting

WebRTC Fingerprinting + Media Device Fingerprinting #

WebRTC Fingerprinting #

WebAudio Fingerprinting

Audio Fingerprinting #

Web Audio API #

Browser Extensions Fingerprinting

Browser Extensions Fingerprinting #

Browser Extension 簡介 #

Ad Blocker Fingerprinting

Ad Blocker Fingerprinting #

CPU Fingerprinting

CPU Fingerprinting #

何謂 CPU Fingerprinting #

Battery Status Fingerprinting

Battery Status Fingerprinting #

Battery Status API #

Scheme Flooding

Scheme Flooding #

Fingerprinting via CSS

Fingerprinting via CSS (JS-less Fingerprinting) #