如何为 JavaScript XSS 测试创建“不安全”环境

Question

我正在学习 XSS 安全性以及如何预防它。为此，我想创建有漏洞的代码，然后看看如何添加安全措施来修复它。

我创建了一个 html 文件，它接受参数，并且在调用时应该执行警报，如下所示：

http://localhost/index.html?name=<script>alert('XSS attack!')</script>

但我无法成功 - 看起来浏览器已经为我做了一些安全检查。创建一个可以执行此类代码的工作环境，然后使用 CSP 修复此安全漏洞的最佳方法是什么？

Answer 1

当您将

script

标签作为 HTML 文本添加到现有 DOM 时（例如，通过分配给

innerHTML

或使用

insertAdjacentHTML

），它们不会被执行。但是，如果您将该“名称”存储在服务器端，然后将其包含在页面的服务器端渲染中，它将运行并且 Evil Code™ 将会执行。遗憾的是，这种漏洞很常见。

但是

onxyz

属性甚至不需要这种服务器往返：

?name=<img src="-" onError="evilCode();">Joe

即使通过

innerHTML

添加，也会触发代码：

document.getElementById("btn").addEventListener("click", () => {
    const name = document.getElementById("name").value;
    document.getElementById("display").innerHTML =
        "Your name is: " + name;
});

<label>
    Name:
    <input id="name" type="text" value="<img src=&quot;-&quot; onError=&quot;alert('XSS attack!')&quot;>Joe">
</label>
<input id="btn" type="button" value="Save">
<div id="display"></div>