你的瀏覽器,獨一無二--解讀瀏覽器指紋

語言: CN / TW / HK

如果技術有罪,那人類可真是罪大惡極。--- 沃·鎡基爍德

我們在日常網絡衝浪的時候,肯定都有過這樣的經歷: 在某東/某寶上瀏覽過電動牙刷後,再訪問其他網站時總會在邊角看到大大小小類似的商品廣吿。 這樣讓我們在感受到被大數據包圍的沉浸感的同時卻又細思恐極,我們還有隱私麼? 這個問題我們放到後面再來討論,先來説説為什麼會有這樣的情況。

一、 瀏覽器指紋

是的你沒有看錯,和人有指紋一樣,Web客户端(這裏主要指瀏覽器)也有自己的指紋信息。將這些信息綜合分析計算後,可對客户端進行唯一性識別,進而鎖定、追蹤、瞭解網民行為和隱私數據, 進而做到精準廣吿投放,反薅羊毛等功效。

1. 基本指紋

基本指紋是任何瀏覽器都具有的特徵標識,比如硬件類型(Apple)、操作系統(Mac OS)、用户代理(User agent)、系統字體、語言、屏幕分辨率、瀏覽器插件 (Flash, Silverlight, Java, etc)、瀏覽器擴展、瀏覽器設置 (Do-Not-Track, etc)、時區差(Browser GMT Offset)等眾多信息,這些指紋信息“類似”人類的身高、年齡等,有很大的衝突概率,只能作為輔助識別。

2. 行為指紋

這裏拿電商網站舉例,我們瀏覽任意商品,停留頁面的時長,經常購買的品類,商品的尺碼大小等等都可以被記錄在本地的cookie裏作為行為指紋,幫助廣吿商精準投放廣吿,也可以幫助電商網站訓練推薦模型為你做到精準推薦。所以“大數據可能比你還要了解你自己”可不是説説而已。

3. 高級指紋

基本指紋就像人的外貌、身高、體重、性別,很難從肉眼的角度去區分瀏覽器,那麼高級指紋對於瀏覽器來説,就像DNA一般精準(不要害怕,也是有極限的)這裏會着重介紹目前廣泛使用的三大高級指紋:canvas指紋/WebGL指紋/Audio音頻指紋。

1)canvas指紋

Canvas(畫布)是HTML5中一種動態繪圖的標籤,可以使用其生成甚至處理高級圖片,2014年9月,ProPublica報道:新型的Canvas指紋追蹤正在被用到“上到白宮,下到YouPorn”等眾多網站,其高級指紋的地位,可見一斑。 canvas指紋的生成過程大致如下:

  • 利用畫布繪製指定圖案
  • 使用canvas.toDataURL()的方法獲得圖片內容的base64編碼
  • 將其CRC校驗碼作為唯一性標識(對於PNG格式的圖片,以塊(chunk)劃分,最後一塊是32位CRC校驗) 在眾多博客中對canvas原理的介紹基本上是一句帶過: 相同的HTML5 Canvas元素繪製操作,在不同操作系統、不同瀏覽器上,產生的圖片內容不完全相同。在圖片格式上,不同瀏覽器使用了不同的圖形處理引擎、不同的圖片導出選項、不同的默認壓縮級別等。在像素級別來看,操作系統各自使用了不同的設置和算法來進行抗鋸齒和子像素渲染操作。即使相同的繪圖操作,產生的圖片數據的CRC檢驗也不相同。

但是好像理解的還是不那麼直觀?

讓我們稍微花一點篇幅來儘可能通俗的解釋一下,例如:

我們在瀏覽器上看到的字體都是經過了字體微調才能在肉眼下表現一致,所謂字體微調其實就是一種特殊指令,讓渲染算法在屏幕上繪出文字。因為電腦裏的文字不是圖像格式儲存而是是像數學公式一樣被儲存的。

當電腦在屏幕上將數學公式繪成文字時,需要將數學公式渲染成由像素點組成的實際圖像,並根據屏幕分辨率、像素點大小等參數生成,所以結果可能存在差異。這個時候不同的操作系統/瀏覽器會有不同的微調算法,使得同樣的字母m在肉眼下表現一致,但是當我們放大到像素級別,就會看出細微的差別,如下圖所示。

再比如抗鋸齒渲染(邊緣柔化技術),抗鋸齒渲染是為了使兩個對比明顯的對象間交接平滑,這麼做就避免了兩個對象間的像素不夠美觀。在黑白圖片中邊緣加入了不同色調的灰色像素作為緩衝達到平滑效果。不同顯卡驅動運行抗鋸齒,結果也會不一樣。這些差別肉眼同樣分辨不出來,如果你仔細比對這些小像素點就能發現色會有輕微的差別。 跟前面一樣肉眼無法分辨的差別計算機可以輕鬆識別。這就是為什麼不同的電腦會產生不同的指紋。

2)WebGL指紋

有了canvas指紋的理解基礎,WebGL就更好理解一些了,基本上是同樣的原理,只不過這裏會將畫好的3D圖像內容和WebGL的某些屬性值綁定在一起(比如渲染圖片用到的顯卡提供商以及顯卡型號,壓縮等級等等)拼接成一個很長的字符串,哈希過後取得一個縮減過信息量卻又保留了信息差的的字符串作為WebGL指紋

3)AudioContext指紋

HTML5提供給JavaScript編程用的Audio API則讓開發者有能力在代碼中直接操作原始的音頻流數據,對其進行任意生成、加工、再造,諸如提高音色,改變音調,音頻分割等多種操作,甚至可稱為網頁版的Adobe Audition。 其大致原理如下,方法有二:

  • 生成特定的音頻信息流,對其進行一系列操作後,計算SHA值作為指紋,音頻輸出到音頻設備之前進行清除,用户毫無察覺。
  • 生成特定的音頻信息流,直接進行動態壓縮,MD5哈希處理後得到音頻指紋

之所以不同設備不同瀏覽器其音頻指紋會有差異是因為主機/瀏覽器的硬件/軟件的細微差別,導致音頻信號的處理上的差異,相同機器上的同款瀏覽器產生相同的音頻輸出,不同機器或不同瀏覽器產生的音頻輸出會存在差異。

可以看出這三類高級指紋都是利用硬件或軟件的差異,有的生成圖片有的生成音頻,然後計算不同的哈希值作為參考指紋.

4. 綜合指紋

在互聯網世界裏,各種指紋的碰撞比比皆是,尤其是想mac這樣的量產機,同一批次同一型號的mac,使用相同的瀏覽器就很有可能產生相同的“高級指紋”,存在一定的重複率,這個時候就需要結合上述的所有指紋,經過分析,計算最終的綜合指紋作為判斷。這樣就可以大大降低碰撞率,極大提高客户端唯一性識別的準確性。

二、 瀏覽器指紋到底該不該被使用

介紹完了瀏覽器指紋,大家應該也對之前説的廣吿精準投放的方式有了一定的瞭解,下面咱們就談談大家對瀏覽器指紋的顧慮吧

  1. 用户會非常介意無感知採集個人信息,這一點上,隨着越來越多的人對隱私的看重,各大公司瀏覽器廠商,甚至手機廠商都對此做了限制和約定,我們所理解的姓名/PC的mac地址/地理位置/電話號碼之類的個人隱私,除非用户授權,第三方無法採集,上面所説的所有指紋,基本上都是屬於非個人隱私的範疇

  2. 瀏覽器指紋在用户授權的情況下,可以為用户提供精準的廣吿投放和推薦

  3. 對於一些商家來説,瀏覽器指紋可以作為他們判斷設備唯一性的重要標識,以此達到反薅羊毛同一設備綁定唯一賬號等等諸如此類的目的,減少公司的損失

所以,從我個人的角度講,不管是什麼技術,都有可能被投入到不正確的使用領域或場景,關鍵在於我們是否設置並遵守了公眾認可的規定

我們可以通過設置瀏覽器的諸多權限配置,拒絕瀏覽器指紋這樣的東西,也可以享受此類技術帶給我們生活上的便利。

公司廠商可以通過收集用户非隱私信息來獲得設備的唯一標識,也可以通過用户授權收集信息建立更好的推薦模型為人們帶來無微不至的服務。

這樣和諧的願景都建立在一個“度”字上。我們能夠看到這個在一步步的修訂(因為瀏覽器指紋能獲取的未授權信息越來越少,説多了都是淚T_T),所以我們也有理由相信隱私這塊蛋糕終究會有你好我好大家好的這麼一天。

以上就是我對瀏覽器指紋的一些理解,如有不當之處,歡迎指正。

參考資料

分享到: