javascript - 如何安全地 XSS 编码来自 PHP 的不受信任的数据，通过 AJAX 通过 javascript 注入(inject)到 DOM 中？

Question

我对我们网站上的旧设置的 XSS 预防非常有信心......我们使用 OWASP 的 XSS 缓解功能从数据库中删除用户提供的数据(我们通过准备好的语句直接将值注入(inject)数据库，不编码发生到输出时间)并通过(为了便于阅读而简化)打印它:

显示.php

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

出于多种原因，可扩展性、分页、灵 active ，我们正在切换到面向 AJAX 的方案。我们没有直接打印出这些 LI block ，而是在页面加载时立即对它们进行 AJAX(技术上是 $(document).ready())，并让客户端通过 javascript 和 jQuery 处理所有内容。我很担心这种方法，因为我已经阅读了大量有关该主题的内容，但仍然对如何维护 XSS 安全性没有信心。

我们的新设置是这样的:

retrieve.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);

显示.php

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

显示.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);

}

我应该在我们的 retrieve.php 脚本中保留 xssafe() 包装函数，然后是 json_encode，然后通过 Javascript 注入(inject)这些值吗？或者我们的新设置安全吗？或者有更好的方法吗？谢谢。

Answer 1

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

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

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

Should I keep the xssafe() wrapper functions in our retrieve.php script, then json_encode

所以，不。