第 6 章 HTML 5 安全

HTML 5 是 W3C 制定的新一代 HTML 語言的標準。

6.1 HTML 5 新標籤

6.1.1 新標籤的 XSS

HTML 5 定義了很多新標籤、新事件，這有可能帶來新的 XSS 攻擊。

一些新 XSS Felter 如果建立了一個黑名單的話，則可能就不會覆蓋到 HTML 5 新增的標籤和功能，從而避免發生 XSS 。

HTML 5 中新增的一些標籤和屬性，使得 XSS 等 Web 攻擊發生了新的變化，爲了總結這些變化，有安全研究者建立了一個 HTML 5 Security Cheatsheet 專案：https://code.google.com/p/html5security

6.1.2 iframe 的 sandbox

標籤一直以來都爲人所詬病。掛馬、XSS、ClickJacking 等攻擊中都能看到它不光彩的身影。

在 HTML 5 中，專門爲 iframe 定義了一個新的屬性，叫 sandbox 。使用 sandbox 這一個屬性後， 標籤載入的內容將被視爲一個獨立的「源」，其中的指令碼將被禁止執行，表單被禁止提交，外掛被禁止載入，指向其他瀏覽器物件的鏈接也會被禁止。

sandbox 屬性可以通過參數來支援更精確的控制。

• allow-same-origin：允許同源存取；
• allow-top-navigation：允許存取頂層視窗；
• allow-forms：允許提交表單；
• allow-scripts：允許執行指令碼。

6.1.3 Link Types : noreferrer

在 HTML 5 中爲 <a> 標籤和 <area> 標籤定義了一個新的 Link Types : noreferrer 。

顧名思義，標籤指定了 noreferrer 後，瀏覽器在請求該標籤指定的地址時將不再發送 Referer 。

<a href="xxx" rel="noreferrer" >test</a> 

6.1.4 Canvas 的妙用

Canvas 可以說是 HTML 5 中最大的創新之一。不同於 <img> 標籤只是遠端載入一個圖片， <canvas> 標籤讓 JavaScript 可以在頁面中直接操作圖片物件，也可以直接操作畫素，構造出圖片區域。

Canvas 提供的強大功能，甚至可以用來破解驗證碼。Shaun Friedle 寫了一個 GreaseMonkey 的指令碼，通過 JavaScript 操作 Canvas 中的每個畫素點，成功的自動化識別了 Megauplod 提供的驗證碼。

6.2 其他安全問題

6.2.1 Cross-Origin Resource Sharing

瀏覽器實現的同源策略（ Same Origin Policy ）限制了指令碼的跨域請求。但網際網路的發展趨勢是越來越開放的，因此跨域存取的需求也變得越來越迫切。同源策略給 Web 開發者帶來了很多困擾，他們不得不想方設法的實現一些「合法」
的跨域技術，由此誕生了 jsonp、iframe 跨域等技巧。

W3C 委員會決定製定一個新的標準來解決日益迫切的跨域存取問題。

Origin Header 用來標記 HTTP 發起的「源」，伺服器端通過識別瀏覽器自動帶上的這個 Origin Header ，來判斷瀏覽器的請求是否來自一個合法的「源」。Origin Header 可以用於防範 CSRF ，它不像 Referer 那麼容易被僞造或清空。

Access-Control-Allow-Origin: * 

6.2.2 postMessage----跨視窗傳遞訊息

postMessage 允許每一個 window （包括當前視窗、彈出視窗、iframe 等）物件往其他的視窗發送文字訊息，從而實現跨視窗的訊息傳遞。這個功能是不受同源策略限制的。

在使用 postMessage() 時，有兩個安全問題需要注意。

1. 在必要時，可以在接收視窗驗證 Domain，甚至驗證 URL，以防止來自非法頁面的訊息。這實際上是在程式碼中實現一次同源策略的驗證過程。
2. 接受的訊息寫入 textContent，但在實際應用中，如果將訊息寫入 innerHTML ，甚至直接寫入 script 中，則可能會導致 DOM based XSS 的產生。根據「 Secure By Default 」 原則，在接受視窗不應該信任接收到的訊息，而需要對訊息進行安全檢查。

6.2.3 Web Storage

爲什麼要有 Web Storage 呢？過去在瀏覽器裡能夠儲存資訊的方法有以下幾種：

• Cookie
• Flash Shared Object
• IE UserData

其中，Cookie 主要用於儲存登錄憑證和少量資訊，其最大長度的限制決定了不可能在 Cookie 中儲存太多資訊。而 Flash Shared Object 和 IE UserData 則是 Adobe 與微軟自己的功能，並未成爲一個通用化的標準。因此 W3C 委員會希望能在用戶端有一個較爲強大和方便的本地儲存功能，這就是 Web Storage。

Web Storage 分爲 Session Storage 和 Local Storage。Session Storage 關閉瀏覽器就會失效，而 Local Storage 則會一直存在。Web Storage 就像一個非關係型數據庫，由 Key-Value 組成，可以通過 JavaScript 對其進行操作。

Web Storage 讓 Web 開發更加的靈活多變，它的強大功能也爲 XSS Payload 大開方便之門。攻擊者有可能將惡意代碼儲存在 Web Storage 中，從而實現跨頁面攻擊。

當 Web Storage 中儲存有敏感資訊時，也可能會成爲攻擊的目標，而 XSS 攻擊可以完成這一過程。