跨站点脚本问题

Question

我想用我们的代码防止XSS，问题是它可能需要JS和html转义，并且可能有些棘手。

以下示例代码与我们的代码相似

 <script>
  var CURRENT_VALUE = '<img src=1 onerror=alert(1)>';
  document.getElementById("valueBox").innerHTML = CURRENT_VALUE;
 </script>

让我们假设CURRENT_VALUE是动态插入的。 因此，在这种情况下我该怎么办，我知道简单的HTML编码可能无法工作，因为攻击者可能会传递unicode转义的值，并且当JS解析器清除它时，它可能会转储到文档中。

那么正确的方法是

我应该先进行JS转义，然后在document.getElementbyID之前进行html转义吗？ 那将如何工作？

假设CURRENT_VALUE是十六进制编码的，并且包含/ x027img ...等

Answer 1

现在，我想我知道您要去哪里了-将内容作为TextNode插入会进行一些格式化：

var CURRENT_VALUE = '<img src=1 onerror=alert(1)>';
var node = document.createTextNode(CURRENT_VALUE);
var valueBox = document.getElementById("valueBox");
valueBox.appendChild(node);

console.log(valueBox.innerHTML);

如果您查看控制台输出，现在插入的HTML是：

<img src=1 onerror=alert(1)>