如何安全地对通过JavaScript通过JavaScript注入到DOM中的AJAX对来自PHP的不可信数据进行XSS编码？

Question

我对使用我们网站上的旧设置进行XSS预防感到非常有信心...我们正在使用OWASP的XSS缓解功能从数据库中提取用户提供的数据（我们通过准备好的语句将值直接注入DB中，没有进行编码直到输出时间）并通过进行打印（为便于阅读而简化）：

show.php

print "<li>";
print "<a href='page?id=".xssafe($row->TRUSTED_VALUE)."'>".xssafe($row->UNTRUSTED_VALUE)."</a>";
print "</li>";

由于多种原因，例如可伸缩性，分页性，灵活性，我们正在转向面向AJAX的方案。 而不是直接打印出这些LI块，我们在页面加载时立即对其进行AJAX处理（技术上是$（document）.ready（）），然后让客户端通过javascript和jQuery处理一切。 我对这种方法感到担忧，因为我已经阅读了很多有关该主题的内容，但仍然对如何维护XSS安全性不满。

我们的新设置是这样的：

resolve.php（我最初仍然有xssafe（）包装器，但请注意我应该只使用json_encode（））

$data['TRUSTED_VALUE'] = $row->TRUSTED_VALUE; // 123
$data['UNTRUSTED_VALUE'] = $row->UNTRUSTED_VALUE; // who knows?
header('Content-Type: application/json');
print json_encode($data);

show.php

<script src="show.js"></script>

show.js

$.ajax({
        url: 'retrive.php',
        dataType: 'json',
        data: {page: pageNum},
        success: loadLI
}); 

function loadLI() {
        data = response.data;
        var li = document.createElement('li');
        var anchor = document.createElement('a');
        anchor.setAttribute('href', 'page?id='+encodeURIComponent(data.TRUSTED_VALUE));
        anchor.appendChild(document.createTextNode(data.UNTRUSTED_VALUE));
        li.appendChild(anchor);

}

我是否应该将xssafe（）包装函数保留在我们的retrieve.php脚本中，然后保留json_encode，然后通过Javascript注入这些值？ 还是我们的新设置安全？ 还是有更好的方法来做到这一点？ 谢谢。

Answer 1

您正在做的事情看起来很安全。

createTextNode在页面上创建一个文本节点createTextNode将为您内部处理编码。

setAttribute将在页面上设置一个属性-此处同样适用，该参数被视为强类型值，并且不可能使用恶意代码对其进行转义。

我应该将xssafe（）包装函数保留在我们的retrieve.php脚本中，然后是json_encode

所以不行。