核心内容摘要
QuickRecorder：重新定义macOS录屏体验的轻量化开源工具
企业级文档导入与粘贴解决方案作为贵州IT行业集团公司项目负责人我司需要为企业网站后台管理系统的文章发布模块增加以下功能Word粘贴功能支持从Word复制内容粘贴到编辑器图片自动上传Word文档导入支持Word、Excel、PPT、PDF文档导入并保留样式微信公众号内容粘贴自动下载公众号文章图片并上传至服务器技术架构设计系统架构图[客户端] ←HTTPS(SM4/AES)→ [网关层] ←→ [业务逻辑层] ←→ [存储层] ↑ ↑ ↑ | | | [管理控制台] ←→ [监控中心] ←→ [审计日志] ←→ [密钥管理]前端实现方案UEditor插件扩展 (wordPastePlugin.js)UE.registerUI(wordpaste,function(editor,uiName){// 创建按钮varbtnnewUE.ui.Button({name:uiName,title:粘贴Word/公众号内容,cssRules:background-position: -380px 0;,onclick:function(){// 监听粘贴事件editor.addListener(paste,function(type,evt){varclipboardDataevt.clipboardData||window.clipboardData;varitemsclipboardData.items;for(vari0;iitems.length;i){if(items[i].type.indexOf(image)!-
{// 处理图片上传varblobitems[i].getAsFile();uploadImage(blob,function(url){editor.execCommand(insertHtml,);});evt.preventDefault();}}// 处理Word格式内容setTimeout(function(){cleanWordPaste(editor);},
;});}});returnbtn;});// 文档导入组件Vue.component(document-importer,{template:导入文档,methods:{triggerFileInput(){this.$refs.fileInput.click();},asynchandleFileUpload(event){constfileevent.target.files[0];if(!file)return;constformDatanewFormData();formData.append(file,file);try{constresponseawaitaxios.post(/api/document/import,formData,{headers:{Content-Type:multipart/form-data}});// 将返回的HTML内容插入编辑器this.$emit(content-imported,response.data.content);}catch(error){console.error(文档导入失败:,error);}}}});后端Java实现文件上传控制器 (FileUploadController.java)RestControllerRequestMapping(/api/upload)publicclassFileUploadController{AutowiredprivateStorageServicestorageService;PostMapping(/image)publicResponseEntityuploadImage(RequestParam(file)MultipartFilefile){try{StringfileUrlstorageService.uploadFile(file);returnResponseEntity.ok().body(Map.of(url,fileUrl,originalName,file.getOriginalFilename(),size,file.getSize()));}catch(IOExceptione){returnResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(Map.of(error,文件上传失败));}}}文档导入控制器 (DocumentImportController.java)RestControllerRequestMapping(/api/document)publicclassDocumentImportController{AutowiredprivateDocumentParserServicedocumentParserService;PostMapping(/import)publicResponseEntityimportDocument(RequestParam(file)MultipartFilefile){try{StringextensionFilenameUtils.getExtension(file.getOriginalFilename()).toLowerCase();StringhtmlContentdocumentParserService.parseDocument(file.getInputStream(),extension);returnResponseEntity.ok().body(Map.of(fileName,file.getOriginalFilename(),content,htmlContent,fileType,extension));}catch(Exceptione){returnResponseEntity.status(HttpStatus.BAD_REQUEST).body(Map.of(error,文档解析失败: e.getMessage()));}}}文档解析服务 (DocumentParserService.java)ServicepublicclassDocumentParserService{AutowiredprivateStorageServicestorageService;publicStringparseDocument(InputStreaminputStream,StringfileType)throwsException{switch(fileType){casedoc:casedocx:returnparseWordDocument(inputStream);casexls:casexlsx:returnparseExcelDocument(inputStream);caseppt:casepptx:returnparsePowerPointDocument(inputStream);casepdf:returnparsePdfDocument(inputStream);default:thrownewIllegalArgumentException(不支持的文档类型: fileType);}}privateStringparseWordDocument(InputStreaminputStream)throwsException{XWPFDocumentdocumentnewXWPFDocument(inputStream);StringBuilderhtmlnewStringBuilder();// 处理段落for(XWPFParagraphparagraph:document.getParagraphs()){html.append();for(XWPFRunrun:paragraph.getRuns()){html.append();html.append(run.getText(
);html.append();}html.append();}// 处理表格for(XWPFTabletable:document.getTables()){html.append();for(XWPFTableRowrow:table.getRows()){html.append();for(XWPFTableCellcell:row.getTableCells()){html.append();}html.append();}html.append();for(XWPFParagraphp:cell.getParagraphs()){html.append(p.getText());}html.append();}// 处理图片for(XWPFPictureDatapicture:document.getAllPictures()){StringimageUrlstorageService.uploadImage(picture.getData(),word_img_System.currentTimeMillis().picture.getPictureType().extension);html.append();}html.append();returnhtml.toString();}privateStringgetParagraphStyle(XWPFParagraphparagraph){// 实现段落样式转换return;}privateStringgetRunStyle(XWPFRunrun){// 实现文本样式转换return;}}数据库设计文件存储表CREATETABLEsys_uploaded_files(idbigint(
NOTNULLAUTO_INCREMENT,original_namevarchar(
NOTNULL,storage_pathvarchar(
NOTNULL,file_sizebigint(
NOTNULL,file_typevarchar(
NOTNULL,mime_typevarchar(
NOTNULL,upload_timedatetimeNOTNULLDEFAULTCURRENT_TIMESTAMP,upload_bybigint(
DEFAULTNULL,is_temptinyint(
DEFAULT0,PRIMARYKEY(id),KEYidx_upload_by(upload_by),KEYidx_upload_time(upload_time))ENGINEInnoDBDEFAULTCHARSETutf8mb4;文档导入记录表CREATETABLEdocument_imports(idbigint(
NOTNULLAUTO_INCREMENT,original_filenamevarchar(
NOTNULL,file_typeenum(WORD,EXCEL,PPT,PDF)NOTNULL,file_sizebigint(
NOTNULL,import_bybigint(
DEFAULTNULL,import_timedatetimeNOTNULLDEFAULTCURRENT_TIMESTAMP,content_summarytext,PRIMARYKEY(id),KEYidx_import_by(import_by),KEYidx_import_time(import_time))ENGINEInnoDBDEFAULTCHARSETutf8mb4;信创环境适配国产化适配清单操作系统统信UOS验证文件路径兼容性银河麒麟验证服务启动脚本数据库达梦DM8调整SQL语法人大金仓验证事务隔离级别中间件东方通TongWeb验证Servlet容器兼容性金蝶AAS验证JNDI数据源配置适配代码示例// 操作系统检测publicstaticclassOSValidator{publicstaticbooleanisUOS(){returnSystem.getProperty(os.name).contains(UOS);}publicstaticbooleanisKylin(){returnSystem.getProperty(os.name).contains(Kylin);}}// 达梦数据库方言publicclassDamengDialectextendsorg.hibernate.dialect.Dialect{OverridepublicStringgetLimitString(Stringsql,intoffset,intlimit){returnsql LIMIT limit OFFSET offset;}}部署方案基础环境要求操作系统Windows Server 2012/CentOS 7/统信UOSJava环境JDK
8 (信创环境使用龙芯JDK)数据库MySQL
7/达梦DM8/人大金仓Redis
0 (用于断点续传信息存储)部署步骤数据库初始化mysql -u root -pinit.sql配置文件修改# application.ymlstorage:local:path:/data/file-storageoss:enabled:trueendpoint:https://oss-cn-shenzhen.aliyuncs.comaccess-key-id:your-access-key-idaccess-key-secret:your-access-key-secretbucket-name:your-bucket-name发布和部署使用Maven打包项目部署到Tomcat或Spring Boot内嵌容器成功案例央企客户A项目规模部署节点200传输数据量日均5TB稳定性连续运行180天无故障政府客户B安全要求等保三级认证适配环境统信UOS 达梦DM8性能指标100GB文件传输平均耗时35分钟商务合作方案授权模式源代码授权98万一次性买断包含全部知识产权无限次部署权限1年免费技术支持持续服务第二年服务费15万/年紧急响应服务5万/次资质证明软件著作权证书登记号2023SR123456商用密码产品认证证书5个央企客户合作证明含合同复印件复制插件目录引入插件文件UEditor
1.
4.
3示例注意不要重复引入jquery如果您的项目已经引入了jq则不用再引入jq-
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,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字段点击查看详细教程配置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转换成图片上传到服务器中。
上传网络图片下载示例点击下载完整示例