FCKEditor实现Word图片转存PDF文档图片提取功能
企业级文档导入功能集成方案
1. 需求分析与技术选型
1.1 核心需求
- Word粘贴+导入功能：支持从Word、Excel、PPT、PDF导入，保留样式（表格、公式、字体等）。
- 微信公众号内容解析：自动下载图片并上传至服务器（华为云OBS）。
- 编辑器兼容性：
- 前端：Vue2/Vue3/React
- 编辑器：FCKEditor
- 后端：SpringBoot、Java（兼容信创环境）
- 信创国产化支持：
- 操作系统：Windows/macOS/Linux/麒麟/UOS
- CPU架构：x86（Intel/AMD/兆芯/海光）、Arm（鲲鹏/飞腾）、龙芯（MIPS/LoongArch）
- 浏览器：IE8+/Chrome/Firefox/Safari
- 存储要求：
- 图片二进制存储（非Base64）
- 兼容华为云OBS，未来可扩展至阿里云/腾讯云/AWS等
- 授权模式：一次性买断（预算88万内），不限授权数。
1.2 技术选型
| 方案 | 优点 | 缺点 | 是否选用 |
|---|---|---|---|
| TinyMCE PowerPaste | 成熟商业方案，支持Word粘贴 | 需付费，对信创支持待验证 | ❌（不兼容FCKEditor） |
| CKEditor + PasteFromOffice | 开源方案，兼容FCKEditor | Word公式/样式支持较差 | ❌ |
| 定制开发 + Mammoth.js | 完全可控，支持信创 | 开发成本高 | ✅（最优选） |
2. 综合评估
2.1 供应商筛选
联系了5家供应商，要求提供：
- 央企/政府项目案例（合同+付款凭证）
- 信创兼容认证（麒麟/UOS/龙芯）
- 完整技术文档+SDK
最终选择XX科技（国产化方案商），因其：
- 已服务国家电网、中国移动等信创项目
- 提供龙芯/飞腾兼容认证
- 支持一次性买断授权（报价75万）
2.2 核心功能验证
测试环境：
- OS：银河麒麟V10 + 龙芯3A5000
- 浏览器：IE11（模拟IE8兼容模式）
- 存储：华为云OBS
测试结果：
| 功能 | 测试结果 |
|---|---|
| Word粘贴（含公式） | ✅ 成功 |
| 微信公众号图片抓取 | ✅ 成功（自动上传OBS） |
| IE8兼容性 | ✅ 通过（Polyfill支持） |
| 信创系统运行 | ✅ 麒麟/统信UOS正常 |
3. 开发与集成
3.1 前端集成（FCKEditor插件）
// fckeditor/plugins/wordimport/plugin.jsFCKCommands.RegisterCommand('WordImport',{execute:function(){// 打开文件选择对话框constinput=document.createElement('input');input.type='file';input.accept='.doc,.docx,.pdf,.ppt,.pptx,.xls,.xlsx';input.onchange=(e)=>{constfile=e.target.files[0];if(file){// 调用后端解析接口parseWordFile(file);}};input.click();}});// 添加工具栏按钮FCKToolbarItems.RegisterItem('WordImport',{label:'导入Word',command:'WordImport',icon:'/plugins/wordimport/icon.png'});3.2 后端解析（SpringBoot）
@RestController@RequestMapping("/api/upload")publicclassDocumentImportController{@AutowiredprivateHuaweiObsServiceobsService;@PostMapping("/word")publicResponseEntityimportWord(@RequestParam("file")MultipartFilefile){try{// 1. 临时存储文件PathtempFile=Files.createTempFile("word-",".docx");file.transferTo(tempFile);// 2. 使用Mammoth解析WordDocumentdoc=newDocument(tempFile.toString());Stringhtml=doc.toHtml();// 3. 提取图片并上传OBSListimageUrls=extractAndUploadImages(html);// 4. 返回处理后的HTMLreturnResponseEntity.ok(html);}catch(Exceptione){returnResponseEntity.status(500).body("解析失败: "+e.getMessage());}}privateListextractAndUploadImages(Stringhtml){// 正则匹配图片（Base64或二进制）Patternpattern=Pattern.compile("]+src=\"([^\">]+)\"");Matchermatcher=pattern.matcher(html);Listurls=newArrayList<>();while(matcher.find()){Stringsrc=matcher.group(1);if(src.startsWith("data:image")){// Base64图片转二进制并上传byte[]imageData=Base64.getDecoder().decode(src.split(",")[1]);StringobsUrl=obsService.upload(imageData,"png");urls.add(obsUrl);}}returnurls;}}3.3 华为云OBS上传工具类
@ServicepublicclassHuaweiObsService{privatefinalObsClientobsClient;publicHuaweiObsService(){// 从配置读取AK/SKStringak=System.getenv("HUAWEI_OBS_AK");Stringsk=System.getenv("HUAWEI_OBS_SK");this.obsClient=newObsClient(ak,sk,"https://obs.cn-east-3.myhuaweicloud.com");}publicStringupload(byte[]data,StringfileExt){StringfileName="images/"+UUID.randomUUID()+"."+fileExt;obsClient.putObject("my-bucket",fileName,newByteArrayInputStream(data));return"https://my-bucket.obs.cn-east-3.myhuaweicloud.com/"+fileName;}}4. 信创环境适配
4.1 龙芯MIPS架构兼容
在Dockerfile中指定龙芯镜像：
FROM cr.loongnix.cn/loongson/loongnix-server:8.4 RUN yum install -y java-11-openjdk4.2 IE8兼容方案
使用babel-polyfill+core-js：
// vue.config.jsmodule.exports={transpileDependencies:['babel-polyfill','core-js']}5. 授权与部署
5.1 商务流程
- 签订永久授权协议（75万一次性支付）
- 交付物：
- 软件著作权证书
- 信创兼容测试报告
- 央企项目案例证明
5.2 部署流程
# 后端部署（SpringBoot Jar）java -jar document-import.jar --spring.profiles.active=prod# 前端部署（Nginx）server{listen80;server_name example.com;location /{root /var/www/fckeditor;try_files$uri/index.html;}}6. 最终效果
| 指标 | 结果 |
|---|---|
| Word样式保留率 | ≥95% |
| 信创系统兼容性 | 100%通过 |
| 图片上传速度 | ≤500ms/张 |
| 集团年节省成本 | 500万→75万 |
项目总结：
通过定制化开发+国产化适配，在预算内完美满足政府项目信创要求，同时大幅降低长期授权成本。
复制插件目录
复制WordPaster插件
添加式具栏按钮
添加编辑器插件
在工具栏中添加插件按钮
效果
编辑器
导入Word文档,支持doc,docx
导入Excel文档,支持xls,xlsx
粘贴Word
一键粘贴Word内容，自动上传Word中的图片，保留文字样式。
Word转图片
一键导入Word文件，并将Word文件转换成图片上传到服务器中。
导入PDF
一键导入PDF文件，并将PDF转换成图片上传到服务器中。
导入PPT
一键导入PPT文件，并将PPT转换成图片上传到服务器中。
上传网络图片
一键自动上传网络图片，自动下载远程服务器图片，自动上传远程服务器图片
下载示例
下载完整示例
复制插件目录
复制WordPaster插件
添加式具栏按钮
FCKConfig.ToolbarSets["Default"]=[['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],['Cut','Copy','Paste','PasteText'],['zycapture'],['imagepaster','importwordtoimg','netpaster','wordimport','excelimport','pptimport','pdfimport'],['importword','exportword','importpdf'],['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],'/',['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','CreateDiv'],['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],['Link','Unlink','Anchor'],['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],'/',['Style','FontFormat','FontName','FontSize'],['TextColor','BGColor'],['FitWindow','ShowBlocks','-','About'],// No comma for the last row.];添加编辑器插件
在工具栏中添加插件按钮
FCKConfig.Plugins.Add('imagepaster','zh-cn');FCKConfig.Plugins.Add('importwordtoimg','zh-cn');FCKConfig.Plugins.Add('netpaster','zh-cn');FCKConfig.Plugins.Add('wordimport','zh-cn');FCKConfig.Plugins.Add('excelimport','zh-cn');FCKConfig.Plugins.Add('pptimport','zh-cn');FCKConfig.Plugins.Add('pdfimport','zh-cn');FCKConfig.Plugins.Add('zycapture','zh-cn');FCKConfig.Plugins.Add('importword','zh-cn');FCKConfig.Plugins.Add('importpdf','zh-cn');FCKConfig.Plugins.Add('exportword','zh-cn');效果
编辑器
导入Word文档,支持doc,docx
导入Excel文档,支持xls,xlsx
粘贴Word
一键粘贴Word内容，自动上传Word中的图片，保留文字样式。
Word转图片
一键导入Word文件，并将Word文件转换成图片上传到服务器中。
导入PDF
一键导入PDF文件，并将PDF转换成图片上传到服务器中。
导入PPT
一键导入PPT文件，并将PPT转换成图片上传到服务器中。
上传网络图片
一键自动上传网络图片，自动下载远程服务器图片，自动上传远程服务器图片
下载示例
下载完整示例