HTML 5通过sandbox属性提升iFrame的安全性
转自：InfoQ
作者
Abel Avram
译者
张龙
发布于
2010年1月30日 上午12时6分
目前Web Hypertext Application
Technology Working Group
（WHATWG）正与W3C
通
力合作建立HTML 5标准，在过去3个月中，该项工作已经进入到了WHATWG的“Last Call
”阶
段。在这期间，变化最大的一个特性就是iframe元素的sandbox属性。sandbox属性可以防止不信任的Web页面执行某些操作。
HTML
5
规范的编辑Ian Hickson谈到了
sandbox的好处
，它可以防止如下操作：
访问父页面的DOM（从技术角度来说，这是因为相对于父页面iframe已经成为不同的源了）
执行脚本
通过脚本嵌入自己的表单或是操纵表单
对cookie、本地存储或本地SQL数据库的读写
HTML
5的修订历史页面
还提到了sandbox的其他特性：
禁用插件
禁止其他浏览上下文的导航
禁止弹出窗口和模式对话框
iFrames因安全问题而臭名昭著，这主要是因为iFrames常常被用于嵌入第三方内容，而后者则可能会执行某些恶意操作。sandbox通过
限制被嵌入内容所允许的操作而提升iFrames的安全性。这种方式将沙箱内容与父页面进行了分离，因此限制了被嵌入内容的权限。
与sandbox一起出来的还有其MIME类型：text/html-sandboxed。Hickson说到：
text/html-sandboxed
MIME类型确保用户不会访问到不可信的内容。它包含两部分内容：首先，如果用户直接访问页面时，浏览器不可以渲染那些具有text/html-
sandboxed
MIME类型的页面。目前所有浏览器都支持这一点，这些浏览器会下载页面的标记但不会渲染页面；其次，支持sandbox属性的浏览器需要渲染具有
text/html-sandboxed
MIME类型的iframes（但会受到sandbox属性中所设定的权限限制）目前为止，还没有浏览器实现这一点，Google
Chrome也是如此（它会渲染父页面，但却下载iframe内容而非在iframe中对其进行渲染）。因此目前还没法使用该项技术，除非Google更
新Chrome以支持这一点（从理论上来说，其他的浏览器厂商在实现了对sandbox属性的支持后就会实现该技术，让我们拭目以待吧）。
目前，只有Google Chrome
4.0使用了sandbox，Firefox、IE8和Safari都还没有实现这一点，但相信不久之后这些浏览器都会实现的。围绕着HTML 5
<video>元素发生了很多事情
，Google通过H.264
标准对其进行实现，而
相关文档：
最近在使用ext嵌入html页面的过程中，遇到一个问题。我们页面都是用html制作的，用iframe的方式嵌入到ext的panel里。其中有一个页面是在按钮触发的时候加载进去的，但是重新刷新浏览器，页面仍然嵌入在panel中，并没有卸载掉，在页面上设置清空缓存也没有效果。
后来我发现，只有在浏览器地址里 ......
说来惭愧，我发现自己写的那个html parse过于理想化，解析xml还差不多，想解析现今的html，估计是不大可能的，所以我把代码重写了一遍，数据结构改成双向链表，这样解析速度更快，最大程度地对html进行容错处理，试验时发现的确可以解析普通html字符串，不需要再严格符合那个xhtml标� ......
String.prototype.HTMLEncode = function() {
var temp = document.createElement ("div");
(temp.textContent != null) ? (temp.textContent = this) : (temp.innerText = this);
var output = temp.innerHTML;
temp = null;
return output;
}
String.prototype.HTMLDecode = function() {
var temp = doc ......
<html>
<frameset cols="50%,*,25%">
<!-- 左边页面占50% 被固定住了 -->
<frame src="/example/html/frame_a.html" noresize="noresize"
/>
<frame src="/example/html/frame_b.html" />
<frame s ......
<html>
<head>
<title> </title>
<script type="text/javascript">
function rotateImage() {
imageToRotate = document.getElementById('imgRotate');
imageToRotate.style.filter= "progid:DXImageTransform.Microsoft ......
