Question

我尝试在满足某些逻辑条件后从辅助函数返回HTML。但是，使用Spacebars.SafeString()函数似乎并不起作用，我认为使用此方法返回HTML是不安全的，并且很容易从外部源代码注入。

例如，返回此HTML：

<object data="/rating/what.svg" width="20" height="20" type="image/svg+xml"></object>

设置如下：

Spacebars.SafeString("<object data=" + "/rating/what.svg" + "width='20' height='20' type=" + "image/svg+xml" + "></object>");

任何人都可以指导我从帮助者返回HTML以及如何执行此类任务的最佳方法吗？无法在其他任何地方找到确定的答案。

Answer 1

首先，如果您的要求允许，请不要回复HTML，只需使用模板并使用数据上下文填充它，例如：

在你的模板中：

<template name="someHtml">
  <object data="/rating/{{dynamicName}}.svg" width="20" height="20" type="image/svg+xml"></object>
</template>

在相应的帮手中：

Template.someHtml.helpers({
  dynamicName: function() {
    return 'what'; // obviously, you generate this with some code
  }
})

但是，如果你真的必须使用html内容进行打印，你可以使用两个最受欢迎的清理软件包之一，djedi:sanitize-html-client或vazco:universe-html-purifier

第一个：

cleanHtml = sanitizeHtml(dirtyHtml, {
  allowedTags: [ 'b', 'i', 'em', 'strong', 'a' ],
  allowedAttributes: {
    'a': [ 'href' ]
  }
});

和后者：

cleanHtml = UniHTML.purify(dirtyHtml, {
  withoutTags: ['b', 'img'], 
  noFormatting: true
});

然后，当然，您在模板中包含这些三重括号的返回值，以便不转义HTML。

Answer 2

你是正确的Spacebars.SafeString()可以返回不安全的代码。你最好的办法就是去除你不想要的坏标签或注射，并使用Spacebars.SafeString()或三重括号语法，如下所示：

<div>
  {{{htmlHelper}}}
</div>

htmlHelper: function() {
  return "<img src=..."
}