CKEditor 5 显示视频元素，但插入 div 中的纯 HTML 不显示该元素

我正在创建一个课程编辑器。用户可以编辑内容（文本、视频、链接、图像等）或查看最终结果（渲染的 html）。

编辑器工作正常，但是当我显示渲染的 html 时，链接的 YouTube 视频不可见。

这是编辑器部分，您可以看到链接的视频可见：

这是“渲染”版本；视频丢失（看起来它没有渲染figure标签和oembed标签，但为什么？）：

html 是：

<h2>This is the header of this section</h2>
<figure class="media">
<oembed url="https://www.youtube.com/watch?v=7km4EHgkQiw&amp;list=RDQK-Z1K67uaA&amp;index=9"></oembed>
</figure>

<p>Please let the student introduce himself.</p><blockquote><p>&nbsp; ‘I was in no mood for talk and I was unpleasantly surprised to find Judy Poovey brushing her teeth at the sink. […]<br>‘Hi, Richard,’ she said, and spit out a mouthful of toothpaste. She was wearing cut-off jeans that had bizarre, frantic designs drawn on them in Magic Marker and a spandex top which revealed her intensely aerobicized midriff.<br>‘Hello,’ I said, setting to work on my tie.<br>‘You look cute today.’<br>‘Thanks.’<br>‘Got a date?’<br>I looked away from the mirror, at her. ‘What?’<br>‘Where you going?’<br>By now I was used to her interrogations.’ (pp. 51-52)</p></blockquote>

<figure class="media">
<oembed url="https://www.youtube.com/watch?v=7km4EHgkQiw&amp;list=RDQK-Z1K67uaA&amp;index=9">
</oembed>
</figure>

您需要更新您的CKEditor配置为了Media embed plugin。通过设置previewsInData to true生成的 HTML 在功能上等同于您在设计时在 CKEditor 中看到的内容。

将以下行包含在配置.

mediaEmbed: {previewsInData: true}

如果这不是您想要的，那么您需要将服务器端或客户端的输出转换为仅从 CKEditor 生成的 HTML产生语义输出。 CKEditor 文档建议使用以下工具：Iframely or Embedly来做到这一点，但您可以按照您希望的任何方式进行。