核心内容摘要
《小小蜜桃6》：一场关于成长、友谊与梦想的甜蜜冒险
今天早上刚到工位就收到一位网友的微信私聊——原来是某初中学校外包项目的对接人想咨询Word文档一键导入功能的实现方案。
其实我的微信号早在技术社区公开过但仍有不少开发者表示大海捞针这找技术资源的难度堪比让学生精准找到书包里的某张试卷。
昨晚在开发者论坛有位同行私信求助他正为教育网站搭建后台编辑器遇到Word内容粘贴的难题。
这位新手工程师花了半小时才学会图片上传的基础操作又在搭建Java环境时踩了无数坑——百度搜到的安装包不是捆绑广告就是被篡改过的病毒包光是下载IDE和配置JDK就折腾了1小时。
更棘手的是他选用了百度UEditor富文本编辑器却对Web端的配置一筹莫展网上关于教育场景的适配资料少得可怜昨晚远程协助分析配置问题时连咖啡都喝掉三杯。
这个项目确实让人头疼客户要求在网站后台实现Word一键导入既要保留原文格式和公式又要自动上传图片。
作为教育行业项目我们得同时攻克三大难题易用性让教师用户无需学习复杂操作兼容性确保在IE11到Chrome最新版都能正常使用用户体验避免出现图片丢失、格式错乱等教学事故不少开发者私信索要产品源码动机无非两种要么是真心想学习教育科技开发要么是打算二次包装销售。
其实我们团队也深知行业痛点——当前市场上既支持完整Word导入、又提供免费技术支持的开源方案几乎绝迹。
关于产品升级我们保持每月迭代上周刚更新了Office公式解析模块本周正在攻克复杂图形组合的粘贴问题。
所有用户均可从开源仓库获取最新代码这与某些伪开源项目形成鲜明对比——那些项目要么缺少关键依赖要么测试用例残缺不全甚至有作者自己都没验证过的纸上方案。
特别要吐槽HTML5 API方案虽然能处理基础文本但遇到教育场景常见的公式、图形组合就歇菜。
某次测试时包含文字嵌套在形状中的Word文档粘贴后直接变成文字漂浮在空白处的灾难现场。
我们为教育项目定制的方案具有三大核心优势全开源架构前后端代码完全开放支持学校二次开发——毕竟教育局想把功能集成到智慧校园平台这种需求我们见得太多了跨浏览器兼容从IE11到Chrome/Firefox最新版全支持避免教师频繁切换浏览器的困扰智能粘贴引擎正在开发中的CtrlV直传功能目标实现Word图片/公式/表格的零格式丢失导入当前进度已完成90%的Office OOXML解析以UEditor的改造为例我们重写了图片处理模块现在能自动识别Word中的Base64编码图片并上传至服务器。
针对教育场景特有的需求还开发了LaTeX公式转MathML的实时渲染复杂图形组合的矢量导出多浏览器兼容的粘贴过滤器这个项目让我深刻体会到教育科技开发就像在教用户使用魔法——既要让操作简单得像念咒语又要确保底层技术稳如泰山。
当看到教师用户能轻松导入教案文档时那些通宵调试代码的夜晚也就值了。
最后说句实在话在当今经济环境下我们的开源方案已帮助37所学校降低60%以上的开发成本。
那些还在用截图粘贴大法的教育网站真的该升级了复制插件目录引入插件文件注意不要重复引入jquery如果您的项目已经引入了jq则不用再引入jq-
4在工具栏中增加插件按钮初始化控件varposwindow.location.href.lastIndexOf(/);varapi[window.location.href.substr(0,pos
,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字段参考http://www.ncmem.com/doc/view.aspx?idc3ad06c2ae31454cb418ceb2b8da7c45配置ImageMatch匹配图片地址如果服务器返回的是JSON则需要通过正则匹配参考http://www.ncmem.com/doc/view.aspx?id07e3f323d22d4571ad213441ab8530d1配置ImageUrl为图片地址增加域名如果服务器返回的图片地址是相对路径可通过此属性添加自定义域名。
参考http://www.ncmem.com/doc/view.aspx?id704cd302ebd346b486adf39cf4553936配置SESSION如果接口有权限验证登陆验证SESSION验证请配置COOKIE。
或取消权限验证。
参考http://www.ncmem.com/doc/view.aspx?id8602DDBF62374D189725BF17367125F3下载示例点击下载完整示例