一种支持公式的在线文档编辑器的设计

侯霞　王杨　张磊

摘要：随着网络技术的发展，在线编辑文档的要求越来越普遍，而编辑内容也不再仅限于文本，内容形式越来越丰富。但是目前Web浏览器和编辑器对数学公式输入与显示的支持非常有限。该文将详细介绍一种改进的基于CKEditor的支持公式的文档编辑器的设计方案，该方案既解决了浏览器对公式的兼容性问题，又利用了开源的公式编辑器提供了公式数据的可重用性。

关键词：在线编辑；公式编辑器；CKEditor

中图分类号：TP311 文献标识码：A文章编号：1009-3044（2016）13-0073-02

Abstract：With the development of Internet technology， online editing document requirements become more and more. Thetypes of edited content become more and more rich but not limited to text. But the current Web browsers and editors cannot support inputting and displaying for mathematical formula very well. An Implementation is presented to support formula editing in the online editor. It can also solve the WEB Browsers compatibility， but also help to reuse the formula data based on formula editor.

Key words：online editing；formula editor； CKEditor

1 背景

随着网络技术的发展，在线编辑文档的要求越来越普遍，而编辑内容也不再仅限于文本，内容形式越来越丰富。数学是科学技术的基本语言，对于教育和科研领域来说，解决基于网页的数学公式编辑问题显得更为重要。但是目前Web浏览器和编辑器对数学公式输入与显示的支持非常有限，并且各个浏览器的支持程度存在差别。

事实上，数学公式一直以来都是一个致力解决的重大问题，许多研究人员也给出了一些技术解决方案。综合来看，在浏览器中显示公式分为两类技术：一类是基于图片的显示；另一类是基于数学公式标记语言MathML[1]（Mathematical Markup Language）来标记数学公式。

第一类方式又分为普通静态图片显示和动态生成图片显示两种，前者是直接利用某些软件制作数学公式图片后，将图片置为网络资源。这种方法的优点是可以保证公式在浏览器中的正常显示，但最大的问题是在浏览器中公式数据无法重用，不能进行二次编辑。后者是服务器接受到公式数据信息后由浏览器解析并显示。但是各种浏览器的支持程度不同，在某些情况下公式显示结果不正常。在动态生成图片发送至网络终端，但其中的公式备注信息需要通过深入学习才能理解和使用，对于网络交互使用十分不便，其占用网络服务器和网络传输资源较大，不能适应大并发数的网络交互应用。

第二类方式是基于MathML的处理。MathML的目标就是使Web可以服务、接收、处理数学公式，正如HTML处理文本的功能那样。Mathml基于xml语言，具有xml语言具有的一切特征，可以实现数据与显示相分离。MathML元素可以包含于带命名空间的XHTML文档。MathML 2.0还包含MathML DOM（MathML文档对象模型），可以识别MathML组件并能用任何脚本语言操作它。虽然MathML功能十分强大，但是需要浏览器来解析MathML。而目前浏览器对MathML的支持程度残次不齐，支持程度不太乐观。因此单纯的利用MathML作为数学公式的显示尚有不足

从国际互联网协会（W3C）网站收录的情况来看，目前实现在主流的IE浏览器下显示和编辑数学公式的方案，无一例外地需要安装额外的软件或插件。为了帮助用户可以在线编辑文档，不但能支持常用的文本，表格，图片等数据的编辑，还能较好地支持数学公式的编写，本文提出一种用户可以编辑文本与数学公式的在线编辑器。此类编辑器用户可以在编辑文档的过程中随意的插入表格，图片数学公式等常用数据。用户编写的数据可以保存在服务器中。

2 系统方案

本文提出一种能够支持公式编辑的在线编辑器的实现方案。目前有一些开源的在线编辑器和公式编辑器，经过多方面的考虑，选用Ckeditor[2]和MathIML Editor[3]。

2.1 现有技术分析

1）Ckeditor

Ckeditor是一个开源的项目，是目前最优秀的可见即可得网页编辑器之一，采用JavaScript编写。并且有丰富的官方文档与API。该编辑器功能比较强大，提供了良好的可视化界面，支持常用的内容编辑。底层的数据格式是html。

CKeditor自身支持数学公式的格式化编辑，并且显示良好，操作方便并且操作过程中可与用户进行良好的互动。但是其采用js+css+html相结合的方式，在浏览器兼容性方面会有一些问题。且公式数据是CKeditor的私有格式，不便于数据共享和处理。

2）MathlML Editor

MathlML Editor也是一个开源项目。它一个基于Web的公式编辑器，该项目使用 MathML Formula for Flash 来编辑和显示公式。最重要的，它可以解析MathML类型的数据，并且可以将用户编辑的数学公式保存为图片、MathML等多种数据形式。该编辑器可嵌入在web页面中，因此，可以将其嵌入在Ckeditor中使用。