spring-boot gradle thymelef 集成 ueditor实现图片上传

ueditor使用详细说明

1.ueditor下载官网下载

2.将下载包解压放到目录下

这里需要导入ueditor需要的jar包，打开/jsp/lib目录

将jar包拷贝到项目一个包下，我这里使用的是libs

项目引入

3.使用ueditor

创建页面

编写控制器

访问进入页面，会出现如下页面

至此，ueditor可以进行文件简单编辑，但是图片上传功能不能使用，需要做如下修改

4.图片上传配置

ueditor默认使用/jsp/controller.jsp充当文件上传后台，由于spring-boot舍弃了jsp所以此文件不能正常使用，

首先修改ueditor.config.js文件如下位置，这个文件原本指向的是上面/jsp/controller.jsp，修改后会访问项目/config 控制器，所以需要自创建

项目中需要写自己的上传文件方法，如下UploadController，

详细代码

package com.wangyq.testueditor.ueditor;

import com.baidu.ueditor.ActionEnter;

import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Controller;
import org.springframework.util.ClassUtils;
import org.springframework.util.ResourceUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.*;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;
import java.util.UUID;

@Controller
public class UploadController {
    @Value("${root.path}")
    private String rootPath;

    @ResponseBody
    @RequestMapping("/config")
    public Object demo(HttpServletRequest request, HttpServletResponse response) {
        SimpleDateFormat formater = new SimpleDateFormat("yyyyMMdd");
        String path = "/images/" + formater.format(new Date());
        String action = request.getParameter("action");
        //读取config.json路径，
        String rPath = rootPath+ "/ueditor/jsp";//.substring(1);
        String sPath = rootPath;
        System.out.println(rPath);
        //uploadimage是对应config.json中图片上传配置
        if (action.equals("uploadimage")) {
            MultipartHttpServletRequest multipartHttpServletRequest = (MultipartHttpServletRequest) request;
            MultipartFile multipartFile = multipartHttpServletRequest.getFile("upfile");
            String filePath = sPath + path;
            File file = new File(filePath);
            if (!file.exists()) {
                file.mkdirs();
            }
            String imgName = multipartFile.getOriginalFilename();
            String hz = imgName.substring(imgName.indexOf("."));
            String uuid = UUID.randomUUID().toString();
            String uuid1 = UUID.randomUUID().toString();
            uuid = uuid.replace("-", "");
            uuid1 = uuid1.replace("-", "");
            String name = filePath + "//" + uuid + hz;
            String fileName = filePath + "//" + uuid1 + hz;
            File f = new File(name);
            File f1 = new File(fileName);
            try {
                multipartFile.transferTo(f);
                InputStream inputStream = new FileInputStream(f);
                OutputStream os = new FileOutputStream(f1);
                ImageUtil.resizeImage(inputStream, os, 300, hz.replace(".", ""));
                f.delete();
            } catch (Exception e) {
                e.printStackTrace();
            }

            Map<String, Object> map = new HashMap<String, Object>();
            map.put("original", multipartFile.getOriginalFilename());
            map.put("name", multipartFile.getOriginalFilename());
            map.put("url",path + "/" + uuid1 + hz);
            map.put("size", multipartFile.getSize());
            map.put("type", "." + hz);
            map.put("state", "SUCCESS");
            return map;
        } else {
            response.setContentType("application/json");
            try {
                response.setCharacterEncoding("utf-8");
                request.setCharacterEncoding("utf-8");
                PrintWriter writer = response.getWriter();
                writer.write(new ActionEnter(request, rPath).exec());
                writer.flush();
                writer.close();
            } catch (Exception r) {
                r.printStackTrace();
            }
        }
        return null;
    }

}

package com.wangyq.testueditor.ueditor;

import javax.imageio.ImageIO;
import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;

/**
 * 图片压缩保存工具类
 */
public  class ImageUtil {
    public static void resizeImage(InputStream is, OutputStream os, int size, String format) throws IOException {
        BufferedImage prevImage = ImageIO.read(is);
        double width = prevImage.getWidth();
        double height = prevImage.getHeight();
        double percent = size / width;
        int newWidth = (int) (width * percent);
        int newHeight = (int) (height * percent);
        BufferedImage image = new BufferedImage(newWidth, newHeight, BufferedImage.TYPE_INT_BGR);
        Graphics graphics = image.createGraphics();
        graphics.drawImage(prevImage, 0, 0, newWidth, newHeight, null);
        ImageIO.write(image, format, os);
        os.flush();
        is.close();
        os.close();
    }
}

UploadController类中有一行是指向config.json路径
我写的是本地磁盘路径，这样做不会因为打包而出现找不到文件的情况，

另上传图片保存到本地磁盘上后，容器回显需要映射

package com.wangyq.testueditor.ueditor;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

@Configuration
public class MyWebAppConfiguration extends WebMvcConfigurerAdapter {
  @Override
  public void addResourceHandlers(ResourceHandlerRegistry registry) {
 /**
 * @Description: 对文件的路径进行配置,创建一个虚拟路径/Path/** ，即只要在<img src="/images/picName.jpg" />便可以直接引用图片
 *这是图片的物理路径 "file:/+本地图片的地址"
 */   registry.addResourceHandler("/images/**").addResourceLocations("file:E:/images/");
    super.addResourceHandlers(registry);
  }
}

至此ueditor上传图片并回显已经完成,不足地方请指正