Springmvc 模式 UEditor上传图片

第一步

<!-- 配置文件 -->   
 <script type="text/javascript" src="/jsplug/ueditor/ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="/jsplug/ueditor/ueditor.all.js"></script>
<script type="text/javascript" src="/jsplug/ueditor/lang/zh-cn/zh-cn.js"></script>

 

第二步，页面元素

<script id="container" name="content" type="text/plain"></script>

第三步，加载插件

var ue = UE.getEditor('container', {
    toolbars: [
        ['undo', 'redo','|','fontfamily', 'fontsize', 'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc','simpleupload',]
    ],
    autoHeightEnabled: true,
    autoFloatEnabled: true
});

第四步，引入jar文件

第五步，编写上传控制器

@RequestMapping("/uEditorUpload.do")
	public void uEditorUpload(MultipartFile upfile,HttpServletRequest request, HttpServletResponse response) throws IOException {
		request.setCharacterEncoding("UTF-8");
		response.setHeader("Content-Type", "text/html");
		System.out.println("url : " + request.getRequestURL().toString());
		String value = request.getParameter("action");
		System.out.println("action:" + value);
		// 文件上传的路径
		String result = null;
		if ("config".equals(value)) { //  读取配置文件，将配置文件数据以json格式返回
			String configPath = "/jsplug/ueditor/jsp/config.json";//配置文件路径， 相对于classpath
			File file = new File(realPathResolver.get(configPath));
			String builder = org.apache.commons.io.FileUtils.readFileToString(file,"utf-8");
			// 过滤输入字符串, 剔除多行注释以及替换掉反斜杠
			result =  builder.toString().replaceAll( "/\\*[\\s\\S]*?\\*/", "" ).replaceAll(" ", "");
			System.out.println("result:" + result);
		} else if ("uploadimage".equals(value)) {// 上传文件
			// 上传成功后返回的json数据
			/*
			 * {"state": "SUCCESS","original": "Hydrangeas.jpg","size": "595284","title":
			 * "1551927256870045443.jpg","type": ".jpg","url":
			 * "/upload/image/20190307/1551927256870045443.jpg"}
			 */
			String originalFilename = upfile.getOriginalFilename();
			String type = originalFilename.substring(originalFilename.indexOf("."), originalFilename.length()) ;
			long size = upfile.getSize();
			System.out.println(originalFilename);
			System.out.println(size);
			try {
                CmsStorePath storePath = FastDfsUtil.upload(upfile);
                if(storePath!=null) {
                	Map<String,Object> map = new HashMap<String,Object>() ;
    				map.put("state", "SUCCESS") ;
    				map.put("original", originalFilename) ;
    				map.put("size", size) ;
    				map.put("title", originalFilename) ;
    				map.put("type", type) ;
    				map.put("url", storePath.getImageUrl()) ;
    				result = JSON.toJSONString(map);
                }
				System.out.println("result : " + result);
			} catch (Exception e) {
				e.printStackTrace();
			}
		}
		PrintWriter writer = response.getWriter();
		writer.write(result);
		writer.flush();
		writer.close();
	}

第六步，配置上传路径,上传图片控制器请求地址

 

文件读取介绍

realPathResolver.get(configPath)

//realPathResolver.get("/jsplug/ueditor/jsp/config.json")

@Component
public class ServletContextRealPathResolver implements RealPathResolver, ServletContextAware {
	
	public String get(String path) {
		return context.getRealPath(path);
	}

	public void setServletContext(ServletContext servletContext) {
		this.context = servletContext;
	}

	private ServletContext context;
}

通过context 获取项目 WebRoot 下文件