从 CKEditor 生成非 HTML 标记答案

【问题标题】：Generate Non-HTML Markup from CKEditor从 CKEditor 生成非 HTML 标记
【发布时间】：2013-12-08 19:48:48
【问题描述】：

TL;DR：我想破解 CKEditor 的内部结构，以便它为富文本（而不是 HTML）生成另一种格式，我希望专家对可行性提出意见这个想法。

我正在开发一个需要协作式富文本编辑器（如 Google Docs）的项目，并且我计划使用操作转换库 (ShareJS) 来实现它。但是由于标签嵌套规则，操作转换很难用 HTML 实现。例如，一个幼稚的 OT 实现很容易产生这种垃圾：

<b>overlapping bold <i>and</b> italic text.</i>

在 HTML 中表示此类文本的正确方法应该是这样的：

<b>overlapping bold </b>
<b><i>and</i></b>
<i> italic text.</i>

或者更好的是，像这样：

<span class="bold">overlapping bold </span>
<span class="bold italic">and</span>
<span class="italic"> italic text.</span>

但是，要获得这些类型的表示，OT 实现需要了解 HTML 标记嵌套的所有规则以及如何纠正错误的合并。

我一直在考虑一种可能的解决方案，它使用一种完全不强制执行标签嵌套规则的替代形式的标记。像这样的：

BOLD (start: 0, length: 20)
ITALIC (start: 17, length: 16)
TEXT:overlapping bold and italic text.

使用这样的格式，我可以使用普通的 OT 库来管理正在进行的 diff/rebase/merge 操作，然后在最后时刻将生成的文档转换为 HTML，然后更新两侧的 GUI合作。

实现这一点的最简单方法是向 CKEditor 询问其 HTML 输出，然后在事后以新格式重建文档。但是 OT 会要求我在每次按键时都执行这种转换，这似乎有点过于重量级了。出于性能原因，我想知道是否可以覆盖 CKEditor 中的默认 HTML 编写器，要求它在遍历 DOM 时生成另一种格式。

你怎么看？

【问题讨论】：

听起来很困难，因为 ckeditor 使用 contenteditable 并且非常依赖浏览器。在 QA 预览中使用 StackOverflow 之类的系统怎么样？我的意思是使用某种甚至限制，这样转换不会发生在每个触发的事件上，而是使用 setTimeout 来限制它，说最大 1/秒。
在整个可编辑结构中每 1 秒仍然存在差异可能很重。特别是对于 OT，您需要首先对内容进行规范化，因为 HTML 上的 OT 非常困难。正如您所提到的，监听用户操作将很难，因为浏览器处理其中的一半并且浏览器是不可预测的。就我个人而言，我不会冒险使用 OT 并创建可以在 DOM 树上运行的自定义算法。
@Reinmar，作为核心提交者，我对您的意见特别感兴趣。但是暂时，如果您愿意假装这是一个好主意，我很想听听如何我可以实现自己的 DOM-walker 来替换 CKEditor 内部的 HTML 输出.这是否是一个好主意是一个单独的问题。我对如何开始感兴趣。谢谢！

标签： javascript ckeditor operational-transform

【解决方案1】：

这可能是一个非常无知的答案——但我一直在考虑用 CKEditor 做类似的事情。我的想法（我还没有尝试过）是挂钩到撤消/重做缓冲区，并将其用作一种通过电线来回发送的穷人的 OT。它可能需要编写自己的撤消/重做缓冲区（或显着扩展已经存在的缓冲区）。然后，所有编辑将变成一系列命令模式实例，撤消/重做缓冲区变成可播放命令的巨大列表。

就像我说的，我还没有尝试过实现它。出于多种原因，这可能是一个糟糕的主意。这是我使用 CKEditor 实现某种协作编辑功能的第一个想法。

【讨论】：