CKEditor 移除 IFrame答案

【问题标题】：CKEditor Removes IFrameCKEditor 移除 IFrame
【发布时间】：2019-10-31 19:34:53
【问题描述】：

当我尝试将数据库中的值加载到 CKEditor 可编辑的字段中时，它会从中删除 iframe 标记。

例如，我将以下 html 发送到屏幕上打印出来：

<div class="videodetector">
    <iframe src="https://www.youtube.com/embed/eSYKJ8WQ508?autohide=1&controls=1&showinfo=0" 
        frameborder="0" allowfullscreen=""></iframe>
</div>

但是当我查看打印出来的 html 时，我看到的是这样的：

<div class="videodetector"><img class="cke_iframe" data-cke-realelement="%3Ciframe%20src%3D%22https%3A%2F%2Fwww.youtube.com%2Fembed%2FeSYKJ8WQ508%3Fautohide%3D1%26amp%3Bcontrols%3D1%26amp%3Bshowinfo%3D0%22%20frameborder%3D%220%22%20allowfullscreen%3D%22%22%3E%3C%2Fiframe%3E" data-cke-real-node-type="1" alt="IFrame" title="IFrame" align="" src="data:image/gif;base64,R0lGODlhAQABAPABAP///wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==" data-cke-real-element-type="iframe" data-cke-resizable="true"></div>

它似乎在 iframe 应该去的地方注入了这个图像标签。

我在网上对此进行了研究，并尝试将以下代码添加到 config.js 中，但这对我没有任何影响：

config.extraAllowedContent = 'iframe(*)';
config.allowedContent = true;

注意：如果我将其打印在 CKEditor 不可编辑的 div 中，则 iframe 加载时不会出现任何问题。

【问题讨论】：

标签： c# html iframe ckeditor ckeditor4.x

【解决方案1】：

我这样做：

CKEDITOR.on('instanceReady', function () {
 var CKEIframes = $('.cke_iframe');
 var CKEIframesL = CKEIframes.length;
 for (i = 0; i <CKEIframesL; i ++ ) {
  $(CKEIframes[i]).replaceWith(decodeURIComponent($(CKEIframes[i]).data('cke-realelement')));
}
});

【讨论】：

【解决方案2】：

我需要在我的文本中添加许多 HTML 标记，包括 iframe。所以我使用这些设置，它们工作正常：

'extraAllowedContent'=>'*(*)',
'allowedContent'=>true

【讨论】：