终于弄懂了DOM型xss和反射型xss的区别

原文作者：lryfish

原文链接：https://www.freebuf.com/articles/web/318982.html

前言

xss漏洞的原理其实很简单，类型也分为三类，反射型、储存型和dom型。但是刚接触xss的时候我根本不理解什么是dom型xss，无法区分反射型和dom型，也很少遇见，现在通过这篇文章可以给新入坑的小白更好的理解xss漏洞，也通过这篇文章巩固一下我对xss的理解，如有不正确的地方欢迎各位师傅斧正。

DOM型与反射型对比图

两张简单的图帮助大家对比一下异同

反射型xss分析

首先还是先简单介绍一下xss最常见的类型：反射型

通过pikachu靶场来做简单的演示分析

可以看到我们输入的数据通过html页面回显了出来，这意味着我们可以尝试构造闭合来注入我们想要的代码

检查一下网页源码，处于这个位置（20这个地方显示了输入数据的长短，改一改就好）

插入这个代码测试xss漏洞：<script>alert('1_Ry')</script>，出现弹窗

分析一下代码

$html='';
if(isset($_GET['submit'])){
    if(empty($_GET['message'])){
        $html.="<p class='notice'>输入'kobe'试试-_-</p>";
    }else{
        if($_GET['message']=='kobe'){
            $html.="<p class='notice'>愿你和{$_GET['message']}一样，永远年轻，永远热血沸腾！</p><img src='{$PIKA_ROOT_DIR}assets/images/nbaplayer/kobe.png' />";
        }else{
            $html.="<p class='notice'>who is {$_GET['message']},i don't care!</p>";
        }
    }
}

首先通过GET 接收message字符串到后端，然后传到$html这个变量

<div id="xssr_main">
    <p class="xssr_title">Which NBA player do you like?</p>
    <form method="get">
        <input class="xssr_in" type="text" maxlength="20" name="message" />
        <input class="xssr_submit" type="submit" name="submit" value="submit" />
    </form>
    <?php echo $html;?>
</div>

再通过这个变量输出到前端的页面，然后刚刚输入的<script>alert('1_Ry')</script>代码就会在页面被执行，通过服务端逻辑来改变了最终的网页代码

DOM型xss分析

DOM型xss和别的xss最大的区别就是它不经过服务器，仅仅是通过网页本身的JavaScript进行渲染触发的

下面我们来看看典型的DOM型xss例子，将下面这句话复制到有道词典进行翻译，相信大家很快就能理解

This is a test <script>alert('1_Ry')</script>about xss

在线翻译_有道 (youdao.com)

看看这句话在html中的位置

这个例子中的xss语句<script>alert('1_Ry')</script>只是单纯的在前端解析，没有经过后端，属于前端自身的安全漏洞。

pikachu靶场

再通过pikachu靶场来深入了解一下DOM型xss

这是前端界面

这是源代码，接下来分析一下这个源码

<div id="xssd_main">
    <script>
        function domxss(){
            var str = document.getElementById("text").value;
            document.getElementById("dom").innerHTML = "<a href='"+str+"'>what do you see?</a>";
        }
    </script>

    <input id="text" name="text" type="text"  value="" />
    <input id="button" type="button" value="click me!" onclick="domxss()" />
    <div id="dom"></div>
</div>

1. 我们通过 <input id=“text” name=“text” type=“text” value="" / > 将字符串赋值给text

2. 然后JavaScript  var str = document.getElementById(“text”).value; 获取到了text的值

3. 然后document.getElementById(“dom”).innerHTML = “< a href=’”+str+"’>what do you see?< /a > "; 把这个text字符串整合到a这个标签中的href里再把a标签写入到dom这个标签中。

4. 最后< div id=“dom” >< /div > 执行这个dom标签

当输入123源码中是这样显示的

但当输入：#'onclick="alert('1_Ry')">   时

一直点击则一直弹，同时使用burpsuite抓包的话也是抓不到任何东西，因为没有产生与服务器的交互，仅仅通过前端js渲染来改变最终的网页代码

DOM型&反射型XSS漏洞的利用场景

两者的攻击方式没有什么不同，都是通过电子邮件等方式发送这个含有我们构造的payload的URL给目标用户，当目标用户访可该链接时，服务器接收该目标用户的请求并进行处理，然后服务器把带有XSS代码的数据发送给目标用户的测览器，浏览器解析这段帯有XSS代码的恶意脚本后，就会触发XSS漏洞，一般用于获取对方cookies值

xss防御方法

1. 过滤输入的数据，包括  ‘ 、“、<、>、on* 等非法字符

2. 对输出到页面的数据进行相应的编码转换，包括HTML实体编码、属性以及URL请求参数

3. 设置cookie的HttpOnly属性

好书推荐

AST是目前爬虫领域的热点。本书从AST这一个知识点出发，由浅入深，带领读者掌握反爬虫AST的原理，并帮助读者培养解决实际问题的能力。本书共11章，分为四部分。第一部分（第1~4章）介绍开发环境的搭建方法、Web调试的必备技巧以及爬虫与反爬虫的基本知识；第二部分（第5~6章）讲解混淆JavaScript代码的手工逆向方法与JavaScript代码安全防护的原理；第三部分（第7~8章）讲解AST的原理与API的使用方法；第四部分（第9~11章）以AST为基础，讲解自动化的JavaScript代码防护与还原方案，并带领读者进行实战训练。本书适合作为计算机培训的教材，也可供安全开发人员、爬虫初学者以及想要在爬虫领域进阶的人员学习。

禁止非法，后果自负

欢迎关注公众号：web安全工具库

欢迎关注视频号：之乎者也吧

加我微信(ivu123ivu)私聊，暗号：蜻蜓，获取抽奖福利，仅当天有效。

原文始发于微信公众号（web安全工具库）：终于弄懂了DOM型xss和反射型xss的区别