java实现 wangEditor 实现上传图片后获取图片的url

在 Java 后端中，你可以使用 Spring Boot 框架来实现上传图片的接口，并返回图片的 URL。具体实现步骤如下：

1. 配置文件上传的参数

在 Spring Boot 中，我们可以通过在 `application.properties` 或 `application.yml` 文件中配置文件上传的参数。以下是一个示例配置文件：

# application.yml

spring:
  servlet:
    multipart:
      max-file-size: 10MB  # 上传文件的最大大小
      max-request-size: 10MB  # 上传请求的最大大小
      file-size-threshold: 1MB  # 上传文件的阈值，超过该大小会写入磁盘

2. 编写上传图片的接口

在 Spring Boot 中，我们可以使用 `@RestController` 注解来定义一个 RESTful 风格的接口，并使用 `@PostMapping` 注解来处理 POST 请求。以下是一个示例接口：

@RestController
public class UploadController {
    @PostMapping("/upload")
    public Map<String, Object> upload(@RequestParam("file") MultipartFile file) {
        Map<String, Object> result = new HashMap<>();

        if (!file.isEmpty()) {
            try {
                // 构造文件名，避免文件名重复
                String filename = LocalDateTime.now().format(DateTimeFormatter.ofPattern("yyyyMMddHHmmssSSS"))
                        + "." + FilenameUtils.getExtension(file.getOriginalFilename());
                String filepath = "/path/to/upload/dir/" + filename;  // 保存文件的路径

                // 将文件保存到服务器
                file.transferTo(new File(filepath));

                // 构造返回结果
                result.put("errno", 0);
                result.put("data", new String[]{"/uploads/" + filename});
            } catch (IOException e) {
                e.printStackTrace();
                result.put("errno", 1);
                result.put("errmsg", "上传失败");
            }
        } else {
            result.put("errno", 1);
            result.put("errmsg", "上传失败");
        }

        return result;
    }
}

在上述代码中，我们通过 `MultipartFile` 类型的参数获取上传的文件，并将文件保存到服务器。接口返回一个 Map 类型的 JSON 对象，其中包含图片的 URL。

3. 配置 WangEditor 的上传图片接口

在前端使用 WangEditor 编辑器时，我们可以通过 `editor.config.uploadImgServer` 参数来设置上传图片的接口。我们可以将该参数设置为我们刚才定义的上传图片接口的 URL。以下是一个示例代码：

editor.config.uploadImgServer = '/upload';

在用户上传图片后，WangEditor 会将图片发送到 `/upload` 接口，并等待接口返回包含图片 URL 的 JSON 对象。在接口返回成功后，WangEditor 会自动将图片插入到编辑器中。