《Word转存大作战一个穷学生的CMS升级日记》一、需求分析与绝望的开始作为一名月生活费2000还要养女朋友的计科狗当我看到产品经理其实就是我自己提出的需求时手里的泡面突然不香了核心需求Word内容带格式粘贴表格/公式/形状全保留图片自动上传到OSS我的阿里云账户在颤抖多格式文件导入还要保留样式LaTeX转MathML数学系女友的特别要求技术现状前端Vue2 UEditor远古版本后端PHP还在用mysql_connect的那种预算99元买杯奶茶都要犹豫三天二、全网掘地三尺找方案第一天GitHub挖宝记搜索关键词“word paste keep format ueditor plugin”发现宝藏wangEditor的word-paste-moduleStar 3.2k优点免费支持图片上传缺点公式支持不行表格样式会崩KindEditor的word插件最后更新2016年优点有现成的PHP后端缺点不支持Vue代码像考古发现的// 尝试集成wangEditor的惨痛经历importEfromwangeditorconsteditornewE(#editor)editor.config.pasteFilterStylefalse// 关闭样式过滤editor.config.pasteTextHandle(content){// 这里应该处理Word内容...但我不会returncontent.replace(//g, match {// 理论上应该上传图片...但怎么拿到文件流return})}第二天CSDN悬赏问答发帖标题“99元求Word粘贴插件可接受学生作品”收到回复某培训机构“来我们这学全栈开发原价19800学生价只要998”某热心网友“用这个轮子xxx.com只要88元”下载后发现是加密的PHP文件注释写着解密联系QQ123456第三天技术群跪求大佬在223813913群的聊天记录我[红包0.01] 大佬们救命啊 A哥你这需求得加钱 B姐我们公司用的TinyMCE专业版一年8万 C学长我毕业设计做过类似的代码早删了三、穷逼解决方案1. 前端魔改方案// ueditor.config.js 魔改配置window.UEDITOR_CONFIG{// 启用word粘贴插件wordImageUrl:/api/upload_word_image,// 图片上传接口wordMediaUrl:/api/upload_word_media,// 多媒体上传接口catchRemoteImage:true,// 抓取远程图片latexToMathML:true,// 这个配置其实不存在是我YY的}// 自定义按钮假装是官方功能UE.registerUI(wordpaste,function(editor){varbtnnewUE.ui.Button({icon:wordpaste,tooltip:粘贴Word内容,click:function(){editor.execCommand(wordpaste);// 这个命令也不存在...}});returnbtn;});2. PHP后端处理穷鬼版// upload_word_image.phpputObject($bucket,$filename,$image);echojson_encode([successtrue,urlhttps://.$bucket...$endpoint./.$filename]);}catch(Exception$e){echojson_encode([successfalse,message上传失败.$e-getMessage()]);}四、最终实现效果功能对比表需求实现程度花费Word格式保留60%表格会歪0元图片自动上传支持但偶尔丢图0元LaTeX转MathML用截图代替别打我0元多格式导入仅Word基本可用0元我的头发剩余30%无价意外收获在GitHub上发现latex2mathml开源库虽然集成后公式显示像蚯蚓爬学会用phpword解析文档能提取文字就是胜利获得女友安慰“你做的东西再烂我也用”五、给同病相怜者的建议低配解决方案用Pandoc做格式转换服务器装个命令行工具MathJax渲染公式放弃治疗版表格用截图大法别告诉用户高配建议存钱买WPS云服务API1980元/年抱紧学院项目大腿蹭经费劝女友转专业误六、技术交流邀请欢迎加入我们的**“穷鬼技术交流群”**QQ群223813913日常内容互扔GitHub星链分享破解版工具支持正版吐槽面试被拒经历交换各公司零食测评最后分享我的毕设秘笈// 万能解决方案if(problem_is_serious()){echo建议考研延缓危机;}else{echo重启试试;}本文代码仅供娱乐实际使用请准备至少99元预算复制插件目录引入插件文件UEditor 1.4.3.3示例注意不要重复引入jquery如果您的项目已经引入了jq则不用再引入jq-1.4在工具栏中增加插件按钮//工具栏上的所有的功能按钮和下拉框可以在new编辑器的实例时选择自己需要的重新定义toolbars:[[fullscreen,source,|,zycapture,|,wordpaster,importwordtoimg,netpaster,wordimport,excelimport,pptimport,pdfimport,|,importword,exportword,importpdf]]初始化控件varposwindow.location.href.lastIndexOf(/);varapi[window.location.href.substr(0,pos1),asp/upload.asp].join();WordPaster.getInstance({//上传接口http://www.ncmem.com/doc/view.aspx?idd88b60a2b0204af1ba62fa66288203edPostUrl:api,//为图片地址增加域名http://www.ncmem.com/doc/view.aspx?id704cd302ebd346b486adf39cf4553936ImageUrl:,//设置文件字段名称http://www.ncmem.com/doc/view.aspx?idc3ad06c2ae31454cb418ceb2b8da7c45FileFieldName:file,//提取图片地址http://www.ncmem.com/doc/view.aspx?id07e3f323d22d4571ad213441ab8530d1ImageMatch:});//加载控件注意如果接口字段名称不是file请配置FileFieldName。ueditor接口中使用的upfile字段点击查看详细教程配置ImageMatch匹配图片地址如果服务器返回的是JSON则需要通过正则匹配ImageMatch:,点击参考链接配置ImageUrl为图片地址增加域名如果服务器返回的图片地址是相对路径可通过此属性添加自定义域名。ImageUrl:,点击查看详细教程配置SESSION如果接口有权限验证登陆验证SESSION验证请配置COOKIE。或取消权限验证。参考http://www.ncmem.com/doc/view.aspx?id8602DDBF62374D189725BF17367125F3效果编辑器界面导入Word文档,支持doc,docx导入Excel文档,支持xls,xlsx粘贴Word一键粘贴Word内容自动上传Word中的图片保留文字样式。Word转图片一键导入Word文件并将Word文件转换成图片上传到服务器中。导入PDF一键导入PDF文件并将PDF转换成图片上传到服务器中。导入PPT一键导入PPT文件并将PPT转换成图片上传到服务器中。上传网络图片下载示例点击下载完整示例