urvalkheni/vuln-web-lab

# Vuln Web Lab 全栈安全培训应用，它将漏洞实现与安全实现并排展示，以便学习者能够准确地了解常见的 Web 攻击原理以及如何缓解它们。 ## 🚀 概述 Vuln Web Lab 是一个故意构建为不安全的学习环境，使用 React、Express 和 PostgreSQL 构建。 它的创建旨在帮助初学者和中级开发者通过对真实端点进行练习，而不仅仅是阅读理论，来理解安全问题。该应用包含一个全局模式切换： - 易受攻击模式：用于演示的故意不安全行为。 - 安全模式：用于比较的更安全行为。 此类项目适用于： - 安全学习和作品集演示 - 课堂或研讨会练习 - 在本地实验室中练习 OWASP 风格的攻防思维 ## 🔥 功能 以下仅列出已在代码中实现的功能。 - 通过 API 和 UI 进行运行时模式切换（`vulnerable` 或 `secure`）。 - 登录流程中的 SQL 注入演示： - 易受攻击模式使用 SQL 字符串拼接。 - 安全模式使用参数化 SQL。 - 始终使用参数化 SQL 和 JWT 过期的安全登录端点（`/api/auth/login-safe`）。 - 带有安全模式转义的反射型 XSS 演示端点（`/api/vulnerable/echo`）。 - 带有安全模式渲染转义的存储型 XSS 演示（`/api/vulnerable/comments`）。 - CSRF 模拟（`/api/vulnerable/transfer`）： - 易受攻击模式接受没有 CSRF token 的请求。 - 安全模式需要 `x-csrf-token` 并使用时序安全比较进行验证。 - 管理员端点上的访问控制缺陷演示： - 易受攻击模式在未经授权检查的情况下返回管理员数据。 - 安全模式强制执行 JWT 认证 + 管理员角色。 - 接受 bearer token 或 cookie token 的 JWT 认证中间件。 - 用于可重现本地运行的数据库种子/重置脚本和 Docker Compose 设置。 ## 🛠 技术栈 - 语言：JavaScript、SQL、HTML、CSS - 前端：React 18、React Router DOM、Axios、Vite - 后端：Node.js、Express、jsonwebtoken、pg、cors、cookie-parser、dotenv - 数据库：PostgreSQL - 工具：Nodemon、Docker、Docker Compose ## 📂 项目结构 ``` vuln-web-lab/ |- backend/ # Express API | |- db/ | | |- init.sql # Creates users table + seeds default admin user | | |- pool.js # PostgreSQL connection pool | |- middleware/ | | |- auth.js # JWT auth + role guard | | |- labMode.js # Resolves secure/vulnerable mode | |- routes/ | | |- auth.js # Register, login, safe login, me | | |- admin.js # Mode-aware and secure admin dashboards | | |- lab.js # Lab mode endpoints + CSRF token endpoint | | |- vulnerable.js # XSS/CSRF lab endpoints | |- scripts/ | | |- seed-reset.js # DB seed/reset utility | |- index.js # App bootstrap and route mounting | |- .env.example # Backend environment template | |- package.json # Backend scripts and dependencies |- frontend/ # React app | |- src/ | | |- pages/ | | | |- LoginPage.jsx # SQLi/JWT interaction screen | | | |- XssLabPage.jsx # XSS + CSRF interaction screen | | | |- AdminPage.jsx # Access control interaction screen | | |- services/ | | | |- api.js # Axios client + lab helper calls | | |- components/ # Reserved (currently empty) | | |- App.jsx # Main layout, nav, mode toggle, routes | | |- main.jsx # React entry point | | |- styles.css # App styling | |- index.html | |- vite.config.js | |- package.json |- exploits/ | |- sqli.txt # SQLi payload examples | |- xss_payloads.txt # XSS payload examples | |- csrf_demo.html # Standalone CSRF form demo |- screenshots/ | |- *.svg # Demo visuals |- docker-compose.yml # Postgres + backend + frontend services |- project.md # Project planning notes |- steps.log # Internal progress/checklist notes ``` ## ⚙️ 设置与安装 ### 前置条件 - Node.js 20+ 和 npm - 本地运行 PostgreSQL（用于本地设置选项） - 可选：Docker + Docker Compose ### 选项 A：本地开发 1. 克隆仓库。 ``` git clone https://github.com/urvalkheni/vuln-web-lab.git cd vuln-web-lab ``` 2. 创建后端环境文件。 ``` cp backend/.env.example backend/.env ``` PowerShell 替代方案： ``` Copy-Item backend/.env.example backend/.env ``` 3. 确保 PostgreSQL 正在运行，创建一个名为 `VulnWeb` 的数据库，如果你的数据库凭据与模板不同，请更新 `backend/.env` 值。 4. 安装并运行后端（包含数据库种子）。 ``` cd backend npm install npm run seed npm run dev ``` 5. 在新终端中，安装并运行前端。 ``` cd frontend npm install npm run dev ``` 6. 打开应用。 - 前端：http://localhost:3000 - 后端健康检查：http://localhost:5000/api/health ### 选项 B：Docker Compose 如果你想同时启动 Postgres、后端和前端，请使用此选项。 ``` git clone https://github.com/urvalkheni/vuln-web-lab.git cd vuln-web-lab docker-compose up ``` 启动的服务： - Postgres：`localhost:5432` - Backend API：`localhost:5000` - Frontend：`localhost:3000` ## 🧪 使用示例 ### 1. 检查当前实验室模式 ``` curl http://localhost:5000/api/lab/mode ``` ### 2. 切换到安全模式 ``` curl -X POST http://localhost:5000/api/lab/mode \ -H "Content-Type: application/json" \ -d '{"mode":"secure"}' ``` ### 3. 尝试易受攻击的登录（SQLi 练习） 在易受攻击模式下使用诸如 `' OR 1=1 --` 之类的 payload。 ``` curl -X POST http://localhost:5000/api/auth/login \ -H "Content-Type: application/json" \ -d "{\"username\":\"' OR 1=1 --\",\"password\":\"anything\"}" ``` ### 4. 尝试安全登录端点 ``` curl -X POST http://localhost:5000/api/auth/login-safe \ -H "Content-Type: application/json" \ -d '{"username":"admin","password":"admin123"}' ``` ### 5. 重新播种或重置数据库 ``` cd backend npm run seed # create table if needed and seed admin user npm run reset # drop users table, recreate, and reseed ``` ### 6. 基于 UI 的实验室使用 - 打开 `/login` 测试 SQLi 和 JWT 行为。 - 打开 `/xss` 测试反射型/存储型 XSS 以及 CSRF 转账模拟。 - 打开 `/admin` 比较模式感知的管理员访问行为。 ## 📊 示例输出 健康检查： ``` { "status": "ok", "mode": "training-lab" } ``` 实验室模式响应： ``` { "mode": "vulnerable" } ``` 易受攻击模式下的模式感知管理员路由： ``` { "secret": "Sensitive admin data exposed without authorization.", "vulnerable": true } ``` 安全模式下的 CSRF 失败响应： ``` { "message": "CSRF token missing or invalid" } ``` 易受攻击模式下的反射输出端点（HTML 响应）： ```

Reflected Output (Vulnerable)

``` ## 🧠 工作原理 简单的请求流程： 1. 输入：用户与 React 页面（`/login`、`/xss`、`/admin`）交互或直接调用 API 端点。 2. 模式控制：前端从 `/api/lab/mode` 读取当前实验室模式并发送 `x-lab-mode` 请求头。 3. 处理：Express 路由根据模式（`vulnerable` 与 `secure`）分流逻辑。 4. 数据访问：认证路由查询 PostgreSQL；某些实验室数据（评论、余额）保留在后端内存中。 5. 输出：API 返回 JSON 或 HTML，清楚地显示不安全与更安全的行为。 ## 🔐 限制 / 注意事项 - 这是一个教育实验室，而不是可用于生产环境的软件。 - 密码以明文形式存储在 `users` 表中（为了训练简便而故意为之）。 - 存储的评论和模拟账户余额位于内存中，并在后端重启时重置。 - CSRF token 是来自环境（`LAB_CSRF_TOKEN`）的静态 token，并在全局共享。 - 实验室模式是全局应用程序状态（`app.locals.labMode`），而不是每个用户独有的。 - 当前存储库中不包含自动化测试套件。 ## 🎯 学习成果 该项目展示了以下方面的实践技能： - 使用 React + Express + PostgreSQL 构建全栈应用 - 实现和分析 SQLi、XSS、CSRF、JWT 认证和访问控制模式 - 在同一系统中比较易受攻击和已修复的代码路径 - 使用脚本和 Docker Compose 设计可重现的本地实验室环境 ## 🚀 未来改进 - 为安全模式路径添加密码哈希和更强的认证默认设置 - 在数据库中持久化 XSS/CSRF 实验室状态以实现可重复的会话 - 为特定模式的行为添加自动化测试 - 扩展实验室以增加其他漏洞模块 ## ⚠️ 免责声明 本存储库故意包含不安全的代码，仅供教育和本地测试使用。 请勿将其部署到公共或生产环境中。

标签：CISA项目, CSRF, Docker, Docker Compose, Express, GNU通用公共许可证, JWT认证, MITM代理, Node.js, OpenCanary, PostgreSQL, React, Streamlit, Syscalls, Web安全, XSS, 前端, 参数化查询, 后端, 安全助手, 安全培训, 安全实验, 安全教学, 安全防御评估, 测试用例, 漏洞复现, 漏洞情报, 漏洞演示, 漏洞靶场, 网络安全, 自定义脚本, 蓝队分析, 访问控制, 请求拦截, 越权访问, 跨站脚本攻击, 跨站请求伪造, 防御检测, 隐私保护