《白帽子讲Web安全》| 学习笔记之HTML5安全

第6章 HTML5安全

1、新标签的XSS

HTML5中新增的一些标签和属性，使得XSS等Web攻击产生了新的变化。有安全研究员建立了一个HTML5 Security Cheatsheet项目。（链接:https://www.owasp.org/index.php/HTML5_Security_Cheat_Sheet或http://html5sec.org/）

2、iframe的sandbox

在HTML5中，专门为iframe定义了一个新的属性，叫sandbox。使用sandbox这个属性后，<iframe>标签加载内容将被视为一个独立的“源”，其中的脚本将被禁止执行，表单禁止提交，插件被禁止加载，指向其他浏览对象的链接也会被禁止。

sandbox属性可以通过参数来支持更加精确的控制，有以下几个值可选择：

allow-same-original：允许同源访问

allow-top-navigation：允许访问顶层窗口

allow-forms：允许提交表单；

allow-script：允许执行脚本。

如果被规定为空字符串（sandbox=""），sandbox 属性将会启用一系列对行内框架中内容的额外限制，默认安全状态。

<iframe src="demo_iframe_sandbox.htm" sandbox=""></iframe> 

3、Link Types：noreferrer

HTML5中为<a>标签和<area>标签定义了一个新的Link Types：noreferrer。标签指定noreferrer后，浏览器在请求该标签指定的地址时将不再发送referrer。(referrer 属性可返回载入当前文档的文档的 URL。)

<a href="text.html" rel="noreferrer">test</a>

4、Canvas

<canvas>标签让JavaScript可以在页面中直接操作图片对象，也可以直接操作像素，构造出图片区域。 可使用canva破解验证码。参考：https://www.jb51.net/html5/71804.html

5、其他安全问题

cross-origin resource sharing：跨域访问的标准，许多HTTP Header可以进行更精确的控制。

postMessage——跨窗口传递消息：

postMessage允许每一个window(包括当前窗口、弹出窗口、iframes等）对象往其他的窗口发送文本消息，从而实现跨窗口的消息传递。这个功能是不受同源策略限制的。

使用postMessage时，有两个问题需要注意：

• 在必要时，可以接收窗口验证Domain，甚至验证url，以防止来自非法页面的消息。这实际上是在代码中实现一次同源策略的验证过程。
• 根据“secure By Default”原则，在接收窗口不应该信任接收到的消息，需要对消息进行安全检测。

Web Storage：Web Storage分为Session Storage 和Local Storage。Session Storage关闭浏览器就会失效，而Local Storage则会一直存在。Web Storage就像一个非关系型数据库，由key-value对组成，可以通过JavaScript对其操作。使用方法如下：

• 设置一个值：window.sessionStorage.setItem(key,value)
• 读取一个值：window.sessionStorage.getItem(key)

Web Storage也受同源策略的约束，每个域所拥有的信息只会保存在自己的域下。

6、总结

随着HTML5的普及，攻击面也随之产生新的变化。要对抗这些“新型”的攻击，就必须了解HTML5的方方面面。