防止CKEditor过滤Radiant标签（无效的HTML标签）

我正在使用CKEditor和refinerycms（rails CMS）我还添加了对radius标签的基本支持（它们是Radiant中使用的标签，另一个是rails CMS）所以我能够在页面中列出模型中的一些元素插入代码。 问题是radius标签模仿html：

当使用CKEditor修改页面内容时，它认为radius标签是无效的HTML，这是正确的和预期的行为，但我找不到告诉CKEditor忽略这些标签的方法。

有任何想法吗？

提前致谢

编辑：事实certificate，标签是由RefineryCMS调用的rails中的sanitize方法过滤的。

Answer 1

您对自定义标记有什么问题？ 在哪些浏览器上？

我检查过CKEditor保留了这个标签，但用它包装了整个内容。 为了避免这种情况，你必须编辑CKEDITOR.dtd ，即：

 CKEDITOR.dtd.$empty[ 'r:product_listing' ] = 1; 

但这仍然可能还不够。 为了获得更好的支持，您需要在此对象中进行更多更改 – 尤其重要的是定义可以作为其父项的内容以及它是内联标记。 例如：

 CKEDITOR.dtd.p[ 'r:product_listing' ] = 1; // it is allowed in 
 tag CKEDITOR.dtd.$inline[ 'r:product_listing' ] = 1; 

这仍然可能还不够 – 例如，您很可能不会有复制和粘贴支持。

所以，如果你需要更可靠的支持，我会尝试一些不同的方式。 使用CKEDITOR.dataProcessor，您可以在将数据加载到编辑器中时将此标记转换为正常标记，并在检索数据时将其转换回该标记。

示例解决方案

 // We still need this, because this tag has to be parsed correctly. CKEDITOR.dtd.p[ 'r:product_listing' ] = 1; CKEDITOR.dtd.$inline[ 'r:product_listing' ] = 1; CKEDITOR.dtd.$empty[ 'r:product_listing' ] = 1; CKEDITOR.replace( 'editor1', { on: { instanceReady: function( evt ) { var editor = evt.editor; // Add filter for html->data transformation. editor.dataProcessor.dataFilter.addRules( { elements: { 'r:product_listing': function( element ) { // Span isn't self closing element - change that. element.isEmpty = false; // Save original element name in data-saved-name attribute. element.attributes[ 'data-saved-name' ] = element.name; // Change name to span. element.name = 'span'; // Push zero width space, because empty span would be removed. element.children.push( new CKEDITOR.htmlParser.text( '\u200b' ) ); } } } ); // Add filter for data->html transformation. editor.dataProcessor.htmlFilter.addRules( { elements: { span: function( element ) { // Restore everything. if ( element.attributes[ 'data-saved-name' ] ) { element.isEmpty = true; element.children = []; element.name = element.attributes[ 'data-saved-name' ]; delete element.attributes[ 'data-saved-name' ] } } } } ); } } } ); 

现在r:product_listing元素将被转换为内部零宽度空间的span。 在编辑器内部将有一个正常的跨度，但在源模式和editor#getData()方法获得的数据中，您将看到原始的r:product_listing标记。

我认为这个解决方案应该是最安全的。 例如复制和粘贴工作。

Answer 2

你也可以添加为受保护的源，因此不会进行过滤或解析。

 config.protectedSource.push(//g); 

只需将这些行添加到您的config.js（[\ s \ S] *？适用于任何随机内容）
查看http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-protectedSource