【前端基础】04-XSS（跨站脚本攻击，Cross-Site Scripting）

XSS（跨站脚本攻击，Cross-Site Scripting）

XSS​ 是一种常见的 Web 安全漏洞，攻击者通过在网页中注入恶意脚本，当其他用户访问该网页时，恶意脚本会在用户的浏览器中执行。

XSS 的本质是 “浏览器信任了来自不可信来源的数据，并把它当作代码执行”。核心在于 “数据被误当作代码执行”。

XSS 的危害

窃取用户 Cookie 或会话信息。 伪造用户操作（如转账、发帖）。 窃取敏感数据（如密码、个人信息）。 劫持用户会话。

开发者的 XSS 检查清单

• 所有用户输入是否经过后端校验？
• 输出到 HTML 时是否转义了特殊字符？
• 是否避免使用 innerHTML等危险 API？
• 是否设置了 CSP 头？
• Cookie 是否标记为 HttpOnly？
• 是否对第三方数据也做了安全处理？

其他

一个用户输入会影响其他用户?

一个用户的恶意输入会威胁所有用户，是因为恶意内容被存在数据库里，每次其他用户访问页面时，后端都会把恶意内容读出来，浏览器误把它当作代码执行。
只要开发者做好输出转义，就能彻底切断这个攻击链。

XSS 最危险的地方：用户不需要任何点击，只要打开页面，恶意脚本就会自动执行。

为什么用户不需要点击？

因为 HTML 的渲染是自动的。
只要恶意代码被拼接到 HTML 中，浏览器就会在加载页面时自动执行。

不需要点击：恶意脚本直接嵌入在页面 HTML 中，浏览器加载页面时自动执行。 用户完全无感知：可能只看到页面正常显示，但后台脚本已经窃取了数据。 危害更大：因为用户不需要任何操作就会中招。

防御关键：永远不要直接把用户输入拼接到 HTML 中，一定要转义！

为什么小明输入的，别人浏览网页也要加载？

数据库是共享的：所有用户的评论都存在同一个表里。 查询逻辑是“按文章查”：显示文章时，会加载这篇文章下的所有评论。 恶意内容被当作普通数据查询出来：小明的评论和其他人的评论一样，被后端读取并输出到网页。 浏览器自动执行：恶意内容被拼接到 HTML 中，浏览器解析时自动执行。

根本原因：

博客系统的设计是公共可见的（所有评论对所有人可见）。 开发者没有对公共内容做安全处理（转义）。 导致一个人的恶意输入，能通过公共页面影响所有访问者。

解决方案：

不要改变“公共可见”的设计（否则博客就没意义了），而是做好输出转义，让恶意代码变成无害的纯文本。

只有博客才会出现 XSS 问题吗?

绝对不是！​ 博客只是一个最容易理解的例子，实际上任何允许用户生成内容并公开显示的系统​ 都可能出现这个问题。