去年做信创项目时,客户在需求文档里只写了一行:从Word复制的公式,粘贴到我们基于XHEDITOR搭建的在线编辑页面里,显示要正常,最好还能二次编辑。一行需求,我从方案设计到上线前后改了四版,踩的坑比想的还多。
先说症状。Word里插一个公式复制,切到XHEDITOR按Ctrl+V。运气好,出来的是一张截图,模糊且不能改;运气不好,粘贴框里直接空白;要是对方用MathType,还会粘进去一个白框或者一堆乱掉的标签。更麻烦的是,信创电脑上操作系统、浏览器、办公软件的搭配非常杂,同一个方案在开发机上好好的,到客户环境就翻车。
这篇文章主要面向做在线文档、富文本编辑器、题库系统、协同办公平台的开发同学。如果你正在被“Word公式粘贴进HTML编辑器”这个问题折磨,下面这一整条链路——从剪贴板格式、OMML、MathML、MathJax,到信创浏览器差异、服务端导出Word——应该能帮你少走很多弯路。
1. 先看问题:公式粘贴进XHEDITOR时的三个真实痛点
1.1 公式变成了图片,而且往往是不完整的图片
用Word 2019做一份包含数学公式的试卷,复制到XHEDITOR,默认情况下编辑器会从剪贴板读到一份位图,把它当成普通图片插入。初看好像没啥问题,但用户真正用起来会发现:公式在Word里是矢量的,放大多少倍都清晰,一旦变成位图,在100%缩放下可能还好,页面放大到150%或者打印预览,公式边缘的锯齿会非常明显;如果页面背景不是纯白色,公式周围自带的白底会显得很突兀。
更极端的情况是,用户在WPS或某些Linux办公环境里复制公式,剪贴板里给到的是WMF或EMF格式图片。Chromium内核的浏览器根本没有办法直接渲染这两种格式,粘贴完后只能看到一个空白占位框,连图都没有。我曾经在客户现场遇到过,用户以为是系统坏了,实际上就是粘贴结果的格式兼容性问题。
图片方案的另一个致命伤是不可编辑。对在线题库、试卷系统这类场景,老师经常只想把题目拿走改几个数字,结果公式变成图片后只能整图删除重做。这种工单反馈多了,需求方就会提“公式必须能编辑”,你之前的图片方案就白做了。
1.2 MathType公式“粘进来之后只剩一个空壳”
MathType的历史比Office自带的公式编辑器更久,很多老课件、老试卷里都是MathType公式对象。这类对
