什么是xss攻击？怎么进行防御什么是 XSS（跨站脚本攻击）？ 1. 定义 XSS（Cross-Site Scripti

什么是 XSS（跨站脚本攻击）？

1. 定义
XSS（Cross-Site Scripting）是攻击者向网页中注入恶意脚本，当其他用户访问该页面时，脚本会在其浏览器中执行，从而窃取用户数据（如 Cookie）、篡改页面内容或进行其他恶意操作。

2. XSS 的三种类型

类型	触发场景	示例
存储型	恶意脚本被持久化存储到服务器（如数据库），用户访问相关页面时触发。	用户评论中包含未过滤的 `<script>` 标签，其他用户查看评论时执行脚本。
反射型	恶意脚本通过 URL 参数传递，服务器未过滤直接返回到页面，用户点击恶意链接后触发。	构造一个包含 `?search=<script>alert(1)</script>` 的 URL，页面直接显示搜索内容导致脚本执行。
DOM 型	完全在客户端执行，通过修改 DOM 动态插入恶意脚本，无需经过服务器。	从 `location.hash` 获取参数并直接插入页面，如 `http://example.com#<img src=x onerror=alert(1)>`。

3. 防御措施

输入过滤与验证
- 对用户输入的内容进行合法性检查（如长度、格式）。
- 过滤危险字符（如 <, >, &, ', "），但需结合输出转义，不能单独依赖。
输出转义
- HTML 上下文：转义 <, >, &, ", ' 等字符（使用 textContent 而非 innerHTML）。
- 属性值：用引号包裹属性值，并转义引号（如 " → "）。
- JavaScript 上下文：避免拼接字符串，使用 JSON.stringify 或 textContent。
内容安全策略（CSP）
通过 HTTP 头 Content-Security-Policy 限制资源加载来源，禁止内联脚本：
```
Content-Security-Policy: default-src 'self'; script-src 'self' trusted.com
```
HttpOnly Cookie
对敏感 Cookie 设置 HttpOnly 属性，防止 JavaScript 窃取：
```
Set-Cookie: sessionID=abc123; HttpOnly
```
安全框架与 API
- 使用 React/Vue 等框架时，默认转义动态内容，避免使用 dangerouslySetInnerHTML 或 v-html。
- 避免 eval()、setTimeout(string) 等执行字符串的函数。
DOM 操作安全
- 从 URL 参数（如 location.search、location.hash）获取数据时，需转义后再插入 DOM。
- 优先使用 textContent 替代 innerHTML。

4. 面试回答示例
“XSS 是攻击者向网页注入恶意脚本，在用户浏览器中执行的一种攻击。分为存储型、反射型和 DOM 型。防御方法包括输入过滤、输出转义、设置 CSP、使用 HttpOnly Cookie，以及避免不安全的 DOM 操作。”

快速记忆口诀
XSS 三步防：