ueditor+word粘贴上传

本文介绍了一个成熟的文本上传项目,该工程能完美处理文档及图片上传,统一使用img标签,并展示出色的传输进度条效果。图片统一存储,优化工程项目,展现良好商业前景。

公司做的项目要用到文本上传功能。

网上找了很久,大部分都有一些不成熟的问题,终于让我找到了一个成熟的项目。

下面就来看看:

1、打开工程:

对于文档的上传我们需要知道这个项目是否符合我们的初衷。

运行:

复制随便一篇文档,粘贴进去。

通过粘贴后,文档以及图片被粘贴进来了,看看html代码是否如我们的预期:

看来这个工程完全符合我们的预期,图片全部使用img标签统一。传输进度条的效果超出了我的意料。

来看看我们的文档图片被放置在哪了:

地址:D:\apache-tomcat-6.0.29\webapps\WordPaster2UEditor1x\upload\2019\04\16

图片被统一放置在文件夹。

由此看来这个项目的实际效果大大超出了我的意料了,带入工程后完美的优化了工程项目,商业前景非常好啊!

DEMO地址:https://dwz.cn/ORcEz9fz

 

要实现 UEditor 上传 Word 文件,可参考以下步骤及代码示例。首先需实现 UEditor上传接口,以下是一个 Java 示例代码: ```java import org.springframework.beans.factory.annotation.Value; import org.springframework.web.bind.annotation.*; import org.springframework.web.multipart.MultipartFile; import java.io.File; import java.io.IOException; import java.util.HashMap; import java.util.Map; import java.util.UUID; @RestController @RequestMapping("/api/ueditor") public class UEditorController { @Value("${file.upload-dir}") private String uploadDir; @PostMapping("/upload") public Map<String, Object> upload(@RequestParam("upfile") MultipartFile file) { Map<String, Object> result = new HashMap<>(); try { // 1. 确保目录存在 File dir = new File(uploadDir); if (!dir.exists()) { dir.mkdirs(); } // 2. 生成唯一文件名 String fileName = UUID.randomUUID() + file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf(".")); // 3. 保存文件 file.transferTo(new File(dir, fileName)); // 4. 返回 UEditor 需要的格式 result.put("state", "SUCCESS"); result.put("url", "/uploads/" + fileName); result.put("title", fileName); result.put("original", file.getOriginalFilename()); } catch (IOException e) { result.put("state", "ERROR"); } return result; } } ``` 此代码通过 Spring Boot 框架实现了 UEditor上传接口。在 `upload` 方法里,会接收一个 `MultipartFile` 类型的文件,接着将文件保存到指定目录,最后返回 UEditor 所需的格式。 同时,在使用 UEditor 粘贴 Word 图片前,需要进行相关配置,可参考文章:http://blog.ncmem.com/wordpress/2019/08/07/umeditor%E7%B2%98%E8%B4%B4word%E5%9B%BE%E7%89%87/ [^2]。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值