UEditor 前后端分离【java版本】
Ueditor官网文档地址：http://fex.baidu.com/ueditor/#server-deploy
1. java后台配置：
下载源码包，解压后把\ueditor-1.4.3.3\ueditor-1.4.3.3\jsp\src\com\baidu\ueditor的文件拷贝到java项目src下。
Base64Uploader.java 因为jdk1.8不支持Base64.decodeBase64(content); private static byte[] decode(String content) { return Base64.getDecoder().decode(content); //Base64.decodeBase64(content); } 把config.json 放到src/main/resource
修改ConfigManager.java 文件，把originalPath 修改为：src/main/resources/config.json
/* * 通过一个给定的路径构建一个配置管理器， 该管理器要求地址路径所在目录下必须存在config.properties文件 */ private ConfigManager ( String rootPath, String contextPath, String uri ) throws FileNotFoundException, IOException { rootPath = rootPath.replace( "\\", "/" ); this.rootPath = rootPath; this.contextPath = contextPath; this.originalPath = "src/main/resources/config.json"; // if ( contextPath.length() > 0 ) { // this.originalPath = this.rootPath + uri.substring( contextPath.length() ); // } else { // this.originalPath = this.rootPath + uri; // } this.initEnv(); } 新建一个controller package com.ganjiangps.wangdaibus.controller; import java.io.IOException; import java.io.PrintWriter; import java.io.UnsupportedEncodingException; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.json.JSONException; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.CrossOrigin; import org.springframework.web.bind.annotation.RequestMapping; import com.baidu.ueditor.ActionEnter; @Controller @CrossOrigin public class UeditorController { @RequestMapping("/config") public void config(HttpServletRequest request,HttpServletResponse response) throws UnsupportedEncodingException, JSONException{ response.setContentType("application/json"); String rootPath = request.getSession().getServletContext().getRealPath("/"); try { // ActionEnter actionEnter = new ActionEnter(request, rootPath); String exec=actionEnter.exec(); PrintWriter writer = response.getWriter(); writer.write(exec); writer.flush(); writer.close(); } catch (IOException e) { e.printStackTrace(); }; } } <mark>浏览器输入：http://localhost:8080/config?action=config</mark>
如果输入以下信息则后台配置成功：
{"videoMaxSize":102400000,"videoActionName":"uploadvideo","fileActionName":"uploadfile","fileManagerListPath":"/ueditor/jsp/upload/file/","imageCompressBorder":1600,"imageManagerAllowFiles":[".png",".jpg",".jpeg",".gif",".bmp"],"imageManagerListPath":"/ueditor/jsp/upload/image/","fileMaxSize":51200000,"fileManagerAllowFiles":[".png",".jpg",".jpeg",".gif",".bmp",".flv",".swf",".mkv",".avi",".rm",".rmvb",".mpeg",".mpg",".ogg",".ogv",".mov",".wmv",".mp4",".webm",".mp3",".wav",".mid",".rar",".zip",".tar",".gz",".7z",".bz2",".cab",".iso",".doc",".docx",".xls",".xlsx",".ppt",".pptx",".pdf",".txt",".md",".xml"],"fileManagerActionName":"listfile","snapscreenInsertAlign":"none","scrawlActionName":"uploadscrawl","videoFieldName":"upfile","imageCompressEnable":true,"videoUrlPrefix":"","fileManagerUrlPrefix":"","catcherAllowFiles":[".png",".jpg",".jpeg",".gif",".bmp"],"imageManagerActionName":"listimage","snapscreenPathFormat":"/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}","scrawlPathFormat":"/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}","scrawlMaxSize":2048000,"imageInsertAlign":"none","catcherPathFormat":"/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}","catcherMaxSize":2048000,"snapscreenUrlPrefix":"","imagePathFormat":"/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}","imageManagerUrlPrefix":"","scrawlUrlPrefix":"","scrawlFieldName":"upfile","imageMaxSize":2048000,"imageAllowFiles":[".png",".jpg",".jpeg",".gif",".bmp"],"snapscreenActionName":"uploadimage","catcherActionName":"catchimage","fileFieldName":"upfile","fileUrlPrefix":"","imageManagerInsertAlign":"none","catcherLocalDomain":["127.0.0.1","localhost","img.baidu.com"],"filePathFormat":"/ueditor/jsp/upload/file/{yyyy}{mm}{dd}/{time}{rand:6}","videoPathFormat":"/ueditor/jsp/upload/video/{yyyy}{mm}{dd}/{time}{rand:6}","fileManagerListSize":20,"imageActionName":"uploadimage","imageFieldName":"upfile","imageUrlPrefix":"","scrawlInsertAlign":"none","fileAllowFiles":[".png",".jpg",".jpeg",".gif",".bmp",".flv",".swf",".mkv",".avi",".rm",".rmvb",".mpeg",".mpg",".ogg",".ogv",".mov",".wmv",".mp4",".webm",".mp3",".wav",".mid",".rar",".zip",".tar",".gz",".7z",".bz2",".cab",".iso",".doc",".docx",".xls",".xlsx",".ppt",".pptx",".pdf",".txt",".md",".xml"],"catcherUrlPrefix":"","imageManagerListSize":20,"catcherFieldName":"source","videoAllowFiles":[".flv",".swf",".mkv",".avi",".rm",".rmvb",".mpeg",".mpg",".ogg",".ogv",".mov",".wmv",".mp4",".webm",".mp3",".wav",".mid"]}
2. 前端配置：
下载[1.4.3.3 Jsp 版本] 解压，修改ueditor.config.js 的serverUrl为：“http://localhost:8080/config”。
浏览器打开index.html，显示如下，配置成功：
以下是把图片上传到图片服务器：
这是ueditor二次开发返回示例链接：
http://fex.baidu.com/ueditor/#dev-request_specification
这里是自定义请求地址示例链接：
http://fex.baidu.com/ueditor/#qa-customurl
ueditor 编辑页面自定义anction请求地址【记得自定义action请求地址】：
文件上传Controller ：
这里的uploadimage anction地址就是编辑页面自定义的action请求地址。
@ResponseBody @RequestMapping("/uploadimage") public Map<String,Object> uploadImageTest(@RequestParam("upfile") MultipartFile multipartFile){ System.out.println("===uploadimage======="); Map<String,Object> res = new HashMap<>(); try{ //封装的图片上传方法 AjaxResult ajax = preForumAttachmentService.uploadImageApi(multipartFile, (long)999999); res.put("url", "url");//上传的图片路径 res.put("state", "SUCCESS"); res.put("title", multipartFile.getOriginalFilename()); res.put("original", multipartFile.getOriginalFilename()); return res ; }catch(Exception e){ e.printStackTrace(); return res; } } 这里特别说明下，多图上传和单图上传是一样的，多图上传则是循环调用了单图上传。
单图上传例子，返回格式：
{
"state": "SUCCESS",
"url": "upload/demo.jpg",
"title": "demo.jpg",
"original": "demo.jpg"
}
以下为部署linux服务器时修改的配置：
com.baidu.ueditor.ConfigManager.java private static final String configFileName = "WEB-INF/classes/config.json";//部署linux 配置项 //部署linux 配置项 if ( contextPath.length() > 0 ) { this.originalPath = this.rootPath + uri.substring( contextPath.length() ); } else { this.originalPath = this.rootPath + uri; } 
京公网安备 11010502036488号