如何阻止DustJS将实体转换回普通字符?

时间:2016-08-25 01:53:22

标签: javascript escaping dust.js html-escape-characters

要复制我的问题,请转到here,然后将此代码粘贴到相应的部分:

灰尘模板:

{title|s}

数据:

{
  "title": "<script>alert('yo');</script>"
}

您将看到以下输出:

<script>alert('yo');</script>

在我看来,这是一种错误的行为,因为实体被转换回普通字符。这导致alert被执行。

我想控制我插入模板的值是否通过JS进行HTML转义。所以Dust JS不应该做任何智能操作,只需要提供完全符合我想要的内容的模板。我怎样才能做到这一点?

1 个答案:

答案 0 :(得分:1)

|s似乎代表了对库完成的任何其他转义例程的压制。由于您已经将数据作为转义HTML输入,因此它会准确地吐出您提供的数据。浏览器将其呈现为<script>alert('yo');</script>,但在幕后它仍然&lt;script&gt;alert('yo');&lt;/script&gt;由于您的字符串已被转义,因此不会执行任何警报:

&#13;
&#13;
var data = {
  "title": "&lt;script&gt;alert('yo');&lt;/script&gt;"
};

//innerHTML version
var src = document.getElementById('template-s').textContent;
var compiled = dust.compile(src, 'output-s');

dust.loadSource(compiled);

dust.render('output-s', data, function(err, out) {
  document.getElementById('output-s').innerHTML = out;
});

// textContent version

src = document.getElementById('template-s-textContent').textContent;
compiled = dust.compile(src, 'output-s-textContent');

dust.loadSource(compiled);

dust.render('output-s-textContent', data, function(err, out) {
  document.getElementById('output-s-textContent').textContent = out;
});
&#13;
<script src="https://cdnjs.cloudflare.com/ajax/libs/dustjs-linkedin/2.7.3/dust-full.js"></script>
<script type="text/dust" id="template-s">Output {title|s}</script>
<script type="text/dust" id="template-s-textContent">Output {title|s}</script>

<h3>Flag: |s set as innerHTML</h3>
<div id="output-s"></div>
<h3>Flag: |s set as textContent</h3>
<div id="output-s-textContent"></div>
&#13;
&#13;
&#13;

This article似乎在解释过滤器方面比官方文档做得更好。他的示例有一个非转义字符串,用于说明根据您使用的标志执行警报的时间。