BT

如何利用碎片时间提升技术认知与能力? 点击获取答案

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

| 作者 彭超 关注 0 他的粉丝 发布于 2013年3月1日. 估计阅读时间: 3 分钟 | GMTC大前端的下一站,PWA、Web框架、Node等最新最热的大前端话题邀你一起共同探讨。

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方式在此留言讨论。

评价本文

专业度
风格

您好,朋友!

您需要 注册一个InfoQ账号 或者 才能进行评论。在您完成注册后还需要进行一些设置。

获得来自InfoQ的更多体验。

告诉我们您的想法

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

M$黑 by Zhu Eric

大家都愿意黑M$,但有好心网友告诉作者了,IE的bug report页面并没有坏掉,而是他没有sign in所以看不到东西。。。

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

1 讨论

登陆InfoQ,与你最关心的话题互动。


找回密码....

Follow

关注你最喜爱的话题和作者

快速浏览网站内你所感兴趣话题的精选内容。

Like

内容自由定制

选择想要阅读的主题和喜爱的作者定制自己的新闻源。

Notifications

获取更新

设置通知机制以获取内容更新对您而言是否重要

BT