国外网友另类方式曝主流浏览器 HTML5 bug:localStorage 可占满硬盘

  • 彭超

2013 年 2 月 28 日

话题:JavaScriptHTML5语言 & 开发

HTML5 Web 存储标准是设计为让站点可以存储比 Cookie(4KB)大的多的数据(比如 5-10MB)来制定的。现在,localStorage 已经发展的非常不错,在所有现代浏览器中都得到了支持(Chrome, Firefox 3.5+, Safari 4+, IE 8+,等等)。

然而,纵使 Chrome 的版本号已经逼近 30,IE 也已然发布了他的第十代产品,这个标准却仍未完美。国外网友Feross Aboukhadijeh在他的个人博客上,发布了一个搞怪的 API——HTML5 Hard Disk Filler™。通过这个 API,他想告诉大家,其实这项功能在主流浏览器中还有着非常明显的问题。

W3C 标准早就预料到,可能会有网站可能会滥 Web 存储特性。在标准里,W3C 建议浏览器为每个域设置一个存储空间上限。所以,实际情况是这个样子的:

  • Chrome 中的每个域可以使用 2.5 MB
  • Mozilla Firefox 和 Opera 中的每个域可以使用 5 MB
  • Internet Explorer 中的每个域可以使用 10 MB

但是,如果站长们比较聪明,使用了很多诸如 1.filldisk.com、2.filldisk.com、3.filldisk.com 这样的子域名会怎么样?每个子域名都会有 5MB 的存储空间吗?W3C 标准表示这是不可以的:

User agents 应该阻止站点通过附属网站的形式来存储数据,比如通过使用 a1.example.com、a2.example.com、a3.example.com 这样的子域名来绕过主域名的存储限制。

通常来讲,我们建议给予一个强制的 5MB 存储限制。

然而,Chrome、Safari,和 IE 目前还没有实现这些诸如对“附属站点”进行存储限制的功能。所以,那些聪明的网站,比如 FillDisk.com,实际上可以通过这个方式,在每个访问用户的电脑上获得几乎无限的存储空间。

一个概念证明的 demo

原文作者提供了一个漂亮的 demo:FillDisk.com 来作为证明此概念的 demo。并且他还将这个 demo 开源在了GitHub上。

这个 demo 的特性有:

  • 充满 Chrome、Safari(iOS 与桌面版本)和 IE 用户的硬盘;
  • 在装配有 SSD 的 Macbook Pro Retina 上,占领 1GB 只需要 16 秒;
  • Chrome25、Safari6、IE10 测试通过;
  • 在像 Chrome 这样的 32-bit 的浏览器下,硬盘充满之前浏览器就会先被搞崩溃;
  • Firefox 测试失败,因为 Firefox 完美实现了 localStorage 的标准;
  • 还提供了一个清除磁盘占用空间的按钮。

各位不妨一试。

如何修正这个 Bug?

作者在天才般的搞怪结束之后,变得正经起来,给出了 Google 和 Apple 的 bug report 链接:

但是他也表示,IE 怎么办呢?因为 IE 的bug report 页面坏掉了。

原文中有很多有趣的浏览,感兴趣的读者可以移步至英文原文。当然,也欢迎大家对此 Bug 以及这位国外友人的曝 Bug 方式在此留言讨论。

JavaScriptHTML5语言 & 开发