了解飞镖1.11的新追加HTML清理

我刚刚升级到飞镖1.11，我并不完全不了解.appendHTML()发生了什么。我有一个非常大的项目使用飞镖和.appendHTML()经常使用。我已经在这个应用程序上工作了一年多，现在没有任何工作了。：/了解飞镖1.11的新追加HTML清理

我的控制台看起来就像这样：

Removing disallowed attribute <DIV style="width: 100%; text-align: right;"> 
Removing disallowed attribute <DIV style="height: 2em;"> 
Removing disallowed attribute <DIV style="height: 0.6em;"> 
Removing disallowed attribute <DIV style="height: 2em;"> 
Removing disallowed attribute <DIV style="height: 1em;"> 
Removing disallowed attribute <DIV style="text-align: justify;"> 
Removing disallowed attribute <DIV style="height: 1em;"> 
Removing disallowed attribute <DIV style="height: 0.6em;"> 
Removing disallowed attribute <SPAN style="color: #0d4b63; font-size: 1.6em;">

大多数我创建使用new Element()和设置风格使用.style.元素......但有时它只是没有必要的，附加的HTML作为字符串是时间只是更快，更好地阅读。

什么原因，内联样式被清除时被删除？我可以制作自己的NodeTreeSanitizer这里提到：appendHtml() doesn't append the full HTML - Dart

但是，这似乎不是一个很好的解决方案，因为我猜这是有理由发生。

我已经使用了尤伯杯简单的webapp模板，只是增加了这行代码：

querySelector('#output').appendHtml('<div style="height: 2em; background: red;">Test</div>');

而且款式刚刚得到的删除：

Removing disallowed attribute <DIV style="height: 2em; background: red;">

但它看起来像合法的HTML我。：/

有人可以向我解释这里发生了什么，为什么以及如何让我的项目再次运行。

非常感谢！

编辑：

而且SVG元素得到去除：

Removing disallowed element <g> 
Removing disallowed element <text> 
Removing disallowed element <image> 
Removing disallowed element <polygon>

来源

2015-07-11 Dafen

创建自定义NodeTreeSanitizer是要走的路。随着HTML卫生应用，文字可以添加到DOM的任何地方。这只是一个疏忽，卫生没有在.appenedHTML()完成。重点是您明确声明哪些元素可以添加到DOM，哪些属性可以添加到这些元素。这样做是为了确保没有恶意的HTML或JS可以被错误地添加到页面中。

来源

2015-07-11 10:03:37

谢谢！我仍然不明白为什么style属性是恶意的并且正在被删除。我会等到1.12被释放，然后使用'NodeTreeSanitizer.trusted'。 – Dafen

您可以隐藏防止用户正确使用您的页面的UI元素，或者显示并放置其他不应该显示的元素。 CSS非常强大，特别是与其他技术相结合，可以为攻击打开漏洞。安全是繁琐的，但您的客户应该是值得的。 –

我明白，但为什么'新DivElement（）..style.height ='3em''确定但appendHtml（'

'）'不是？或者是为了防止类似的东西从数据库中获取HTML。（HTML中不是由开发人员在代码中提供的） – Dafen

了解飞镖1.11的新追加HTML清理

回答

相关问题