1. 首頁 > 生活 > >

div禁止點擊事件 css隱藏元素的方法中可以觸發點擊事件

小知識



文章插圖
div禁止點擊事件 css隱藏元素的方法中可以觸發點擊事件

文章插圖
CSS代碼實現用戶跟蹤及反跟蹤方法
去年，有一位開發者創建了一個網站，用于跟蹤和記錄用戶數據，包括點擊，鼠標移動，瀏覽器類型和操作系統 。通過Web應用進行用戶跟蹤大家已經司空見慣，但是這個網站使用的方法卻有點”低端”，低端的讓大都為之內心一顫，因為他的方法沒有用到動態語言，甚至也沒有用到JavaScript，只是純HTML和一行CSS 。這打破長期以來大家認為了CSS改只能靜態樣式顯示的的思維 。蟲蟲今天就來給大家解析的他的方法，并附上如何防止此類跟蹤的方法 。
跟蹤原理
這個方法利用了CSS的兩個特性：將內容注入HTML元素的能力（操縱DOM），以及在用戶執行操作后更改樣式的能力（渲染頁面） 。該網站的工作原理是使用content屬性在執行操作時設置URL 。URL調用一個PHP腳本，該腳本記錄有關操作的詳細信息，這些操作將作為URL參數傳遞 。使用:: before和:: after CSS選擇器設置此URL可確保僅在執行操作時調用URL，而不是在首次加載頁面時調用URL 。
例如，以下CSS在每次單擊#link元素時調用URL：
跟蹤腳本包含記錄事件時間和執行操作的代碼 。它還可用于提取用戶的IP地址，用戶代理和其他識別信息 。
以下是這樣一個腳本的PHP示例：
瀏覽器探測
用戶可以設置瀏覽器的User-agent來欺騙服務器，[email protected] at-rule測試特定于瀏覽器的CSS屬性來規避它 。例如，以下操作通過檢測-webkit-appearance可用，以及-ms-ime-align不可用，來檢測是否為Chrome瀏覽器：
操作系統探測
為了正確檢測用戶操作系統，在這個跟蹤中動用了字體檢測 。例如，通過檢測瀏覽器是否支持Calibri字體系列，就可以判斷瀏覽器是不是在Windows中運行：
方法也有個示例的頁面證明可以識別除了上述提到一些信，還有其他的數據，包括瀏覽器窗口的大小和方向，用戶是否點擊了鏈接，以及用戶將鼠標懸停在元素上的時間 。
下面是蟲蟲操作后跟蹤到的信息的展示頁面：
反追蹤方法
在瀏覽器中很難防止這種攻擊 ?？梢越柚粋€跨站注入漏洞來完美實現信息竊取，還非常難于發現 。如果想要完全避免這種攻擊，除非禁用CSS，但是這樣一來網站也就掛掉了 。雖然無法完全杜絕攻擊，但是我們可以使用內容安全策略（CSP）增加其利用的難度 。
CSP是一組規則，用于確定瀏覽器可以執行和不執行的操作 。CSP通常用于防止跨瀏覽器加載不受信任的腳本導致的跨站點腳本（XSS）和其他攻擊 。雖然通常與JavaScript文件一起使用，但CSP也可以應用于CSS樣式表 。
我們假設由第三方提供商托管的樣式表的網站，攻擊者危及樣式表并將用戶跟蹤添加到頁面上的鏈接如下：
當用戶單擊該鏈接時，他們的瀏覽器會其他網站上的跟蹤腳本 。由于該行為是通過瀏覽器完成的，因此網站所有者完全不知道該漏洞 。內容安全策略通過設置允許的樣式以及來源網站，就可以避免調用非法來源的鏈接 。
禁用內聯樣式
禁用內聯樣式是CSP提供的最大安全優勢之一 。內聯樣式是直接在HTML文檔中聲明（或通過JavaScript設置）的樣式，而不是從樣式表中加載的樣式 。內聯樣式，尤其是動態生成的樣式或用戶創建的樣式，非常難以調試和保護 。所以CSP通常會阻止所有內聯樣式，并將那些經過特別批準的內容列入白名單 。
以下規則阻止所有內聯樣式以及外部托管的樣式表：
Content-Security-Policy "style-src 'self';"使用哈希和隨機數驗證樣式
如果阻止內聯樣式不能禁止，我們仍然可以使用哈希和隨機數確保CSS的完整性 。
在樣式表或內聯樣式上執行散列函數時，除非樣式更改，否則它應該始終返回相同的結果 。這對于將某些內聯樣式和樣式表列入白名單非常有用，同時可以驗證樣式是否未被修改或篡改 。
Nonces則使用哈希類似的功能 。但是加入了隨機數，為每個請求生成一個新的隨機數，使攻擊者更難以猜測其值 。這避免了哈希的關鍵缺點:多個輸入可能生成相同的哈希 。
對外部樣式表進行驗證
樣式表通常托管在第三方服務器上，例如CDN中，這會導致一個新的攻擊入口 。如果CDN遭到入侵，怎么能阻止攻擊篡改托管的CSS呢？
答案是SRI，可以使用資源完整性（SRI）解決此問題 。
SRI使用哈希來驗證腳本和樣式表的內容 。計算每個文件的哈希并將其附加到HTML元素的完整性屬性 。當瀏覽器下載腳本或樣式表時，它會計算其哈希值并將其與存儲在屬性中的值進行比較 。如果匹配，才會加載腳本或樣式 。
【div禁止點擊事件 css隱藏元素的方法中可以觸發點擊事件】雖然通過CSS跟蹤用戶的能力并不是什么新鮮事，但它確實需要我們對網絡上的隱私和安全性進行不同的思考 。CSS是現代網絡的基本語言之一，禁用網站的CSS戶導致大部分網站無法使用 。Content-Security-Policy是防止XSS攻擊和CSS泄露的最佳方法 。關注蟲蟲，瀏覽更多技術原創文章 。