
CSP标头是什么?为什么有人能神不知鬼不觉地盗走你的信息?
举个例子吧! 这是一个无CSP标头的网站: 点我 不出意外,你的浏览器会弹出一个提示 这是如何做到的? 这个项目开源在 afoim/none_csp_demo HTML内容为 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>欢迎页面</title> </head> <body> <h1>欢迎</h1> <p>你好,<span id="name"></span>!</p> <script> // 从 URL 参数读取用户名并显示 const params = new URLSearchParams(location.search); const name = params.get("name"); document.getElementById("name").innerHTML = name; </script> </body> </html> 这个网站非常简单:页面会通过查询参数 ?name=xxx 动态显示用户名。 比如你输入 https://none-csp-demo.pages.dev/nocsp?name=AcoFork 网页就会显示 从源码可以看出,这个网页是通过 innerHTML 直接插入文本内容的。 这种写法没有做任何安全处理,会把传入内容直接拼接进 HTML。 那么…如果我们给网站这样一个 name 呢? 尝试输入 https://none-csp-demo.pages.dev/nocsp?name=%3Cimg%20src=x%20onerror=%22alert(%27XSS%E6%94%BB%E5%87%BB%E6%88%90%E5%8A%9F%27)%22%3E 你会发现网站并没有打印出任何用户名,而且浏览器还弹出了一个奇怪的窗口 我们F12查看当前网页的源代码 发现在 <span id="name"></span> 中 被插入了一条 <img src="x" onerror="alert('XSS攻击成功')"> ! 也就是说,网页并没有把我们传入的 name 当作纯文本处理, 而是直接把它插入成了 HTML。 因此浏览器并不会把它渲染成普通文字,例如 你好,<img src="x" onerror="alert('XSS攻击成功')"> ! ...