SpringBoot,前端html5 整合WangEditor5富文本编辑器,并自定义图片、视频上传至FTP服务器

以下是一个简化的示例，展示了如何在Spring Boot项目中使用WangEditor5并将图片和视频上传到FTP服务器：

1. 添加WangEditor5到你的HTML页面：

<div id="editor">
    <p>这里是初始化的编辑器</p>
</div>
 
<script src="https://cdn.jsdelivr.net/npm/wangeditor@5.1.5/dist/wangEditor.min.js"></script>
<script>
    const editor = new wangEditor('editor'); // 初始化编辑器
    editor.create(); // 创建编辑器
 
    // 配置图片和视频上传的服务端地址
    editor.config.uploadImgServer = '/upload/image';
    editor.config.uploadVideoServer = '/upload/video';
    editor.create(); // 创建编辑器
</script>

2. 在Spring Boot Controller中处理上传请求：

import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;
import java.io.InputStream;
import java.nio.file.Files;
import java.nio.file.Path;
import java.nio.file.Paths;
import java.nio.file.StandardCopyOption;
 
@RestController
public class UploadController {
 
    @PostMapping("/upload/image")
    public String uploadImage(@RequestParam("file") MultipartFile file) {
        return uploadToFtp(file, "image");
    }
 
    @PostMapping("/upload/video")
    public String uploadVideo(@RequestParam("file") MultipartFile file) {
        return uploadToFtp(file, "video");
    }
 
    private String uploadToFtp(MultipartFile file, String type) {
        try {
            // 这里使用FTP客户端库来上传文件到FTP服务器
            // 示例中省略了FTP客户端的具体实现，你需要引入相应的库并实现FTP上传功能
            // 假设uploadToFtp是一个实现FTP上传功能的方法
            String ftpUrl = uploadToFtp(file.getInputStream(), file.getOriginalFilename());
            return "{url: '" + ftpUrl + "'}"; // 返回FTP上的文件URL
        } catch (Exception e) {
            e.printStackTrace();
            return "上传失败";
        }
    }
 
    private String uploadToFtp(InputStream fileContent, String fileName) {
        // 这里应该是实现将文件内容上传到FTP服务器的代码
        // 返回的应该是文件在FTP服务器上的URL
        // 示例中仅提供了伪代码
        return "ftp://ftp.example.com/" + fileName;
    }
}

注意：以上代码仅为示例，实际使用时需要替换FTP客户端库和实现上传逻辑。你需要引入FTP客户端库（如Apache Commons Net），并实现uploadToFtp方法。

此外，你还需要配置FTP服务器的相关信息，并确保Spring Boot应用有权限访问FTP服务器。

这个示例展示了如何在Spring Boot应用中接收WangEditor5的上传请求，并将文件上传到FTP服务器。在实际应用中，你可能需要添加安全控制、错误处理、多文件上传等功能。