怎样通过UEDITOR轻巧松导入Word文档，提升工作岗位效率？

较大家良好，今天我来聊聊写博客这事儿。真实的，写文章太不容简单了。以前我们发文章，直接复制粘贴，完事。当前不行了当前用UEDITOR JSP版。用户一般在发和发文章时用到， 算是一个较高频采用功能，用户体验上来讲确实是很良好，和以前的发或者发文章的体验比起来要方便许更多，用户用起来也更方便。但是有个问题，就是Word文档怎么搞进去？这就头疼了。

为哪些UEDITOR这么不容简单搞Word？

先来看得承认，UEDITOR这玩意儿，功能是挺更多。但是它不认Word。它只认HTML。所以你把Word文档扔给它，它不了解该怎么办。它就像个笨蛋，只会傻站着。这就引起了一个很严沉重的问题：用户想发Word文档，最终还是结果是发不出来。用户体验就差了。用户用的更爽，是这是因为以前发文章要排版，当前不用了。但是Word导入不了用户就不爽了。这怎么行呢？

我在网上查了良好更多资料，发觉很更多人都在问当前这个问题。比如那个地方的叫“较小羊e12”的人，他就问：“当前用的是完整版UTF-8的JSP版UEditor 1.4.3。想要实当前ueditor中添加word文档的导入功能，以及保存到本地的功能。网上没有找到合适的解决方法，甚至相关的资料协助。”你看，连人都找不到方法。UEditor官网上提示说“word导入编辑上线”，只是这并没有哪些协助，还是不了解怎样实现。请较大神来给解答，盘它。！

方案一：粘贴复制，还是不行

我试过第一个方案，就是粘贴复制。把Word里的内容复制一下粘贴到UEDITOR里。最终还是结果是呢？格式全乱了。标题变正文了图片变成乱码了。粘贴不能粘贴word中的图片是一个很头疼的问题。在我们的业务场景中客户要求必须要采用ueditor并且支持word的图片粘贴，这是因为当前这个需求头疼了半个月。这是因为前端方面这是因为可靠的原因是不允许访问本地文件的，我爱我家。。

好吧好吧... 所以我放弃了粘贴。粘贴太费劲了还得手动调格式。用户发崭新闻或者发文章，图的就是个迅速。谁有那个地方的闲工夫去调格式？所以我得找个别的办法。

方案二：上传Word文件， 让服务器搞定

又爱又恨。 既然前端不行，那我们就用后端。后端是SpringBoot，是Java，是JSP。这一些语言对比灵活。我们提供给一个转换接口， 转换接口采用RESTful协议，这样的话兼容性更良好一点，其它的平台用起来的话更方便简洁一点，而且测试起来也方便。

总体来看... 当前这个方案就是上传。用户选一个Word文件，上传到服务器。服务器拿到文件后把Word转换成HTML。然后把HTML丢给UEDITOR。UEDITOR一看，哦，是HTML啊，我就认了。这样就能把Word的内容体现出来了。

当前这个用户体验确实很良好。和以前的发崭新闻或者发文章的体验比起来要方便许更多。用户用的更爽。不用复制粘贴，不用调格式，直接上传，完事，当冤大头了。。

具体怎么写代码？

代码这东西，说起来简洁，写起来不容简单。我们得改`ueditor.all.js`当前这个文件。找到`UE.plugin.register('simpleupload'`当前这个地方。在它下面崭新增一个方法。方法名随便起，叫`wordUpload`也行，何必呢？。

闹乌龙。 在崭新增的方法里我们要配置上传的路径。路径怎么写？参考当前这个：

wordPathFormat : /public/uploads/word/{yyyy}{mm}{dd}/{time}{rand:6} , /* 上传保存路径,能够自定义保存路径和文件名格式 */，我怀疑...

当前这个路径是干嘛的呢？就是文件存哪了。{yyyy}{mm}{dd}是日期，{time}{rand:6}是时间段和随机数。这样文件名就不会反复了。

躺平... 然后我们要设置允许上传的文件类型。不是全部的文件都能传，只传Word。所以：

wordAllowFiles : /* 仅支持docx格式的word */，不忍卒读。

如果你传了.doc文件，它会报错的。只能传.docx。当前这个得注意。

那个地方的叫zyOffice的东西是哪些？

没法说。 我查资料的时候，发觉有个叫zyOffice的东西。良好像是荆门泽优搞的。里面有个文件夹叫zyOffice。你要把它上传到项目中。jsp页面的Table里面要用到它。

扎心了... 那个地方的全武凌说 百度富有文本ueditor实现导入word并将内容体现到编辑器中，最主要就是用当前这个。它提供给了一个控件。叫`zyOffice.getInstance({word: 加载控件...`。

当前这个控件怎么用？我也没太搞懂。反正就是要安装PHPword库。自定义文件转换类。然后编辑器的导入操作实现。示例下载在Gitee上。 你猜怎么着？ https://gitee.com/xproer/zyoffice-ueditor1.5x

我们都... 最主要步骤如下：1、上传zyOffice文件。jsp页面的Table...

图片怎么处理？这是个技术手段活

Word里有很更多图片。图片怎么上传？这是个较大问题。如果只是把Word转成HTML，图片的地址是本地的。比如`file:///C:/Users/Admin/Desktop/1.jpg`。浏览器一加载，发觉当前这个地址不对，就体现不出来。

C位出道。 所以我们需要把Word里的图片提取出来上传到服务器。拿到服务器的地址，再替换掉HTML里的本地地址。

怎么提取？用JS。

我写了一段代码，在`ueditor`粘贴的时候触发。如果用户粘贴了图片，就拦截一下，说真的...。

if !== -1 ) { var blob = item.getAsFile; getBase64 { //sendAndInsertImage; 上传到服务器 setBase64Image; //阻止默认事件， 避免反复添加; e.originalEvent.preventDefault; //落实插入图片的操作 function setBase64Image{ editor.execCommand; //获取base64 function getBase64 { var a = new FileReader; a.onload = function{callback;}; a.readAsDataURL;

这段代码，有点较长。较大家看不懂没关系，反正就是用FileReader把图片转成Base64。然后调用`editor.execCommand('insertimage'`把图片去，原来小丑是我。。

调整一下。 但是这有个问题。Base64太较大了。一张图片几MB。直接去，数据库会炸的。所以最良好是先上传到服务器，拿到URL，再插URL。

“现有项目需要为TinyMCE提升导入word文件的功能， 导入后word文件里面的图片自动上传到服务器中，word里面的文本样式保留”，恕我直言...。

TinyMCE是别人的编辑器，我们用的是UEDITOR。但是道理是一样的。图片得上传。不能直接用Base64。所以我后来改了代码。先上传，再替换。

怎么上传？用一个REST接口。接口收到文件，保存到`/public/uploads/word/...`当前这个目录。然后返回一个URL。比如`http://www.example.com/uploads/word/20231027/123456.jpg`。然后把当前这个URL给UEDITOR，平心而论...。

那一些乱七八糟的配置

不靠谱。 除了上传路径，还有过滤配置。Word里有良好更多垃圾代码，比如``，``之类的。UEDITOR不喜炎热爱这一些。所以我们要配置过滤规则，把这一些垃圾代码过滤掉。

还有就是工具栏按钮。以前UEDITOR没有Word导入按钮。当前我们要加一个按钮。在`toolbars`数组里加个`'wordimport'`。 ICU你。 这样用户界面上就会出现一个按钮了。

语言配置也要改。默认是中文，但有时候体现不出来。要设置成UTF-8。当前这个很十分沉关键。不然全是乱码。

一下真实的很累

总的来说... 写这篇文章，真实的很累。为了弄当前这个导入Word功能，我查了良好更多资料。看了良好更多博客。CSDN上的文章，CSDN社区的内容，博客园的内容。哪些“怎样实现导入WORD文档到UEDITOR编辑器中”，哪些“将word文档导入到ueditor编辑器中”。

有一篇文章说：“和粘贴word内容比起来导入功能采用起来更方便一些。能够兼容一些特殊情况，比如用户电脑上没有安装office柔软件。” 这话说得有点道理。 这也行？ 粘贴的话，如果用户没装Office，有可能连图片都粘贴不进去。上传的话，只要浏览器能打开Word，就能上传。不过上传需要服务器支持。

我狂喜。 还有人说：“ueditor怎样实现word文档的导入和下载功能”。下载功能？Word导入后能不能下载下来？我觉得不行。UEDITOR是编辑器，不是浏览器。它只能体现HTML。你点下载，只能下载个HTML文件。Word文档是下载不下来的。除非你用POI把HTML再转回Word。那就更麻烦了。

说白了就是... “UEditor没有提供给word的导入功能，只能说是粘贴复制。” 这句话，是真实的。官方确实没提供给当前这个功能。全靠我们开发者自己搞。

关于那个地方的全武凌

有个叫全武凌的，他是荆门泽优的。他良好像挺厉害的。他说：“富有文本编辑器实现一键导入word，Ueditor富有文本实现导入word功能”。他推荐用zyOffice。我觉得他是为了卖东西吧。不然为哪些一直提zyOffice呢？不过他的思路是对的。就是要转换。Word转HTML，HTML转UEDITOR。

当前的项目，需求是越来越更多了。以前只要能发文章就行。当前要能发Word。 稳了！ 要能保留样式。要能自动上传图片。这对开发者的要求，越来越较高了。

最后再来看想说的话

当前这个功能，做出来之后确实良好用。用户再也不用Ctrl+C Ctrl+V了。 PTSD了... 直接点个按钮，选个文件，完事。文本样式保留得也不错。图片也能自动体现。

但是实现起来真实的很麻烦。特别是图片处理那块。Base64，上传，替换，这来来回回良好几步。稍微不注意，图片就挂了。

如果你也遇到了当前这个问题，想用UEDITOR导入Word，提议你参考一下我上面的代码。虽然写得烂， 我们都... 但是能用。希望能帮到你。如果帮不到，我也没办法了。毕竟我是个没有上过学的写手，只会写点垃圾代码。

有啥说啥... 用户一般在发和发文章时用到， 算是一个较高频采用功能，用户体验上来讲确实是很良好，和以前的发或者发文章的体验比起来要方便许更多，用户用起来也更方便。真实的，方便许更多。较大家赶紧试试吧。

---