站在键盘前的我们，总会觉得“自己的代码写得够严谨”，却忽略了浏览器背后那层kan不见的信任链。一次不经意的输入、一次随手的链接，dou可Neng把整个站点推向风口浪尖。下面就让我们一起拆开这两个常被误认为“只会吓人”的漏洞，kankan它们到底怎么偷偷摸摸地侵蚀你的业务。

简而言之，XSS 是攻击者把恶意 JavaScript 嵌进你的页面然后借助用户的浏览器执行。这种脚本Ke以窃取 Cookie、伪造表单、甚至在页面上弹出恼人的弹窗，让受害者感到莫名其妙。

存储型 XSS恶意代码直接写入数据库或日志文件，所有访问该记录的用户dou会触发。

反射型 XSS攻击者把脚本藏在 URL 参数里服务器原样返回，用户点击链接即中招。

基于 DOM 的 XSS前端代码自行拼接 DOM 时未Zuo转义，导致脚本在客户端被执行。

举个Zui常见的例子：/search?q=——Ru果后端直接把 q 插入页面而不进行过滤，弹窗就会毫无预警地出现。

CSRF 的核心思路是利用用户Yi经登录且拥有有效 Cookie 的状态，让他在不知情的情况下向目标站点发送「合法」请求。换句话说它不是偷走信息，而是冒充用户完成了某些操作。

只要受害者此前Yi经登录了银行系统，这笔转账就会在后台悄然完成——没有验证码，没有二次确认，只是一场「无声」的盗窃。

虽然两种漏洞各有千秋，但当它们碰撞时会产生“乘胜追击”的效果。想象一下你在留言板里留下了这样一段代码：

这段脚本 读取用户的 Cookie，然后再利用浏览器Yi经带着身份凭证去请求银行或社交平台。等同于先让 XSS 把钥匙偷走，再让 CSRF 用这把钥匙打开门锁。

实际危害包括：

账户信息被完整泄露；

未经授权的转账或商品购买；

网站声誉瞬间跌至谷底，引发用户流失。

永远使用安全 API：

// ✅ 正确Zuo法
element.textContent = userInput;
// ❌ 错误Zuo法
element.innerHTML = userInput;

CSP： 通过 HTTP 响应头限制可执行脚本来源。例如：

Content-Security-Policy: default-src 'self'; script-src 'self' https://cdn.trusted.com;

框架自带的自动转义：React、Vue 等默认对 JSX/模板输出进行转义，只要避免使用 v-html/

function escapeHtml{
    return str.replace(//g,ch=>({
        '&':'&',
        '<':'<',
        '>':'>',
        '"':'"'
    }));
}

Set-Cookie: sessionId=abc123; SameSite=Strict; HttpOnly;