百度富文本编辑器UMeditor使用

1、插件官方下载地址：

/website/download.html#mini

2、解压下载的插件包，将里面的文件放到web项目的根目录下面，同时将里面的JAR复制到lib文件夹下

3、将umeditor.config.js、umeditor.mini.js引入到WEB页面

var um = UM.getEditor('myEditor');um.addListener('blur',function(){ var editorContent = UM.getEditor('myEditor').getContent(); if(editorContent != ""){ editorContent = filterHtml(editorContent); $("#myEditorContent").val(escape(editorContent)); } });

并配置umeditor.config.js文件：

//图片上传配置区,imageUrl:URL+"jsp/imageUp.jsp" //图片上传提交地址,imagePath:URL + "jsp/" //图片修正地址，引用了fixedImagePath,如有特殊需求，可自行配置,imageFieldName:"upfile" //图片数据的key,若此处修改，需要在后台对应文件修改对应参数

4、jsp配置,Jsonp回调方法，在插件包imageUp.jsp文件中配置，注意要更改引入包路径：

<%@ page language="java" contentType="text/html; charset=utf-8"pageEncoding="utf-8"%><%@ page import="com.baidu.ueditor.um.Uploader" %>//要更改为自己Uploader.java的包路径<%request.setCharacterEncoding("utf-8");response.setCharacterEncoding("utf-8");Uploader up = new Uploader(request);up.setSavePath("upload");String[] fileType = {".gif" , ".png" , ".jpg" , ".jpeg" , ".bmp"};up.setAllowFiles(fileType);up.setMaxSize(10000); //单位KBup.upload();String callback = request.getParameter("callback");String result = "{\"name\":\""+ up.getFileName() +"\", \"originalName\": \""+ up.getOriginalName() +"\", \"size\": "+ up.getSize() +", \"state\": \""+ up.getState() +"\", \"type\": \""+ up.getType() +"\", \"url\": \""+ up.getUrl() +"\"}";result = result.replaceAll( "\\\\", "\\\\" );if( callback == null ){response.getWriter().print( result );}else{response.getWriter().print("<script>"+ callback +"(" + result + ")</script>");}%>

5、将里面的Uploader.java放在项目里，并更改包的路径，Uploader.java代码如下

package com.baidu.ueditor.um;//更改你的包路径import java.io.*;import java.text.SimpleDateFormat;import java.util.*;import mons.fileupload.*;import mons.fileupload.FileUploadBase.InvalidContentTypeException;import mons.fileupload.FileUploadBase.SizeLimitExceededException;import mons.fileupload.util.*;import mons.fileupload.servlet.*;import mons.fileupload.FileItemIterator;import mons.fileupload.disk.DiskFileItemFactory;import sun.misc.BASE64Decoder;import javax.servlet.http.HttpServletRequest;/*** UEditor文件上传辅助类**/public class Uploader {// 输出文件地址private String url = "";// 上传文件名private String fileName = "";// 状态private String state = "";// 文件类型private String type = "";// 原始文件名private String originalName = "";// 文件大小private long size = 0;private HttpServletRequest request = null;private String title = "";// 保存路径private String savePath = "upload";// 文件允许格式private String[] allowFiles = { ".rar", ".doc", ".docx", ".zip", ".pdf",".txt", ".swf", ".wmv", ".gif", ".png", ".jpg", ".jpeg", ".bmp" };// 文件大小限制，单位KBprivate int maxSize = 10000;private HashMap<String, String> errorInfo = new HashMap<String, String>();public Uploader(HttpServletRequest request) {this.request = request;HashMap<String, String> tmp = this.errorInfo;tmp.put("SUCCESS", "SUCCESS"); //默认成功tmp.put("NOFILE", "未包含文件上传域");tmp.put("TYPE", "不允许的文件格式");tmp.put("SIZE", "文件大小超出限制");tmp.put("ENTYPE", "请求类型ENTYPE错误");tmp.put("REQUEST", "上传请求异常");tmp.put("IO", "IO异常");tmp.put("DIR", "目录创建失败");tmp.put("UNKNOWN", "未知错误");}public void upload() throws Exception {boolean isMultipart = ServletFileUpload.isMultipartContent(this.request);if (!isMultipart) {this.state = this.errorInfo.get("NOFILE");return;}DiskFileItemFactory dff = new DiskFileItemFactory();String savePath = this.getFolder(this.savePath);dff.setRepository(new File(savePath));try {ServletFileUpload sfu = new ServletFileUpload(dff);sfu.setSizeMax(this.maxSize * 1024);sfu.setHeaderEncoding("utf-8");FileItemIterator fii = sfu.getItemIterator(this.request);while (fii.hasNext()) {FileItemStream fis = fii.next();if (!fis.isFormField()) {this.originalName = fis.getName().substring(fis.getName().lastIndexOf(System.getProperty("file.separator")) + 1);if (!this.checkFileType(this.originalName)) {this.state = this.errorInfo.get("TYPE");continue;}this.fileName = this.getName(this.originalName);this.type = this.getFileExt(this.fileName);this.url = savePath + "/" + this.fileName;BufferedInputStream in = new BufferedInputStream(fis.openStream());File file = new File(this.getPhysicalPath(this.url));FileOutputStream out = new FileOutputStream( file );BufferedOutputStream output = new BufferedOutputStream(out);Streams.copy(in, output, true);this.state=this.errorInfo.get("SUCCESS");this.size = file.length();//UE中只会处理单张上传，完成后即退出break;} else {String fname = fis.getFieldName();//只处理title，其余表单请自行处理if(!fname.equals("pictitle")){continue;}BufferedInputStream in = new BufferedInputStream(fis.openStream());BufferedReader reader = new BufferedReader(new InputStreamReader(in));StringBuffer result = new StringBuffer(); while (reader.ready()) { result.append((char)reader.read()); }this.title = new String(result.toString().getBytes(),"utf-8");reader.close(); }}} catch (SizeLimitExceededException e) {this.state = this.errorInfo.get("SIZE");} catch (InvalidContentTypeException e) {this.state = this.errorInfo.get("ENTYPE");} catch (FileUploadException e) {this.state = this.errorInfo.get("REQUEST");} catch (Exception e) {this.state = this.errorInfo.get("UNKNOWN");}}/*** 接受并保存以base64格式上传的文件* @param fieldName*/public void uploadBase64(String fieldName){String savePath = this.getFolder(this.savePath);String base64Data = this.request.getParameter(fieldName);this.fileName = this.getName("test.png");this.url = savePath + "/" + this.fileName;BASE64Decoder decoder = new BASE64Decoder();try {File outFile = new File(this.getPhysicalPath(this.url));OutputStream ro = new FileOutputStream(outFile);byte[] b = decoder.decodeBuffer(base64Data);for (int i = 0; i < b.length; ++i) {if (b[i] < 0) {b[i] += 256;}}ro.write(b);ro.flush();ro.close();this.state=this.errorInfo.get("SUCCESS");} catch (Exception e) {this.state = this.errorInfo.get("IO");}}/*** 文件类型判断* * @param fileName* @return*/private boolean checkFileType(String fileName) {Iterator<String> type = Arrays.asList(this.allowFiles).iterator();while (type.hasNext()) {String ext = type.next();if (fileName.toLowerCase().endsWith(ext)) {return true;}}return false;}/*** 获取文件扩展名* * @return string*/private String getFileExt(String fileName) {return fileName.substring(fileName.lastIndexOf("."));}/*** 依据原始文件名生成新文件名* @return*/private String getName(String fileName) {Random random = new Random();return this.fileName = "" + random.nextInt(10000)+ System.currentTimeMillis() + this.getFileExt(fileName);}/*** 根据字符串创建本地目录 并按照日期建立子目录返回* @param path * @return */private String getFolder(String path) {SimpleDateFormat formater = new SimpleDateFormat("yyyyMMdd");path += "/" + formater.format(new Date());File dir = new File(this.getPhysicalPath(path));if (!dir.exists()) {try {dir.mkdirs();} catch (Exception e) {this.state = this.errorInfo.get("DIR");return "";}}return path;}/*** 根据传入的虚拟路径获取物理路径* * @param path* @return*/private String getPhysicalPath(String path) {String servletPath = this.request.getServletPath();String realPath = this.request.getSession().getServletContext().getRealPath(servletPath);return new File(realPath).getParent() +"/" +path;}public void setSavePath(String savePath) {this.savePath = savePath;}public void setAllowFiles(String[] allowFiles) {this.allowFiles = allowFiles;}public void setMaxSize(int size) {this.maxSize = size;}public long getSize() {return this.size;}public String getUrl() {return this.url;}public String getFileName() {return this.fileName;}public String getState() {return this.state;}public String getTitle() {return this.title;}public String getType() {return this.type;}public String getOriginalName() {return this.originalName;}}

6、在运行时发现一些问题：

6.1运行到while (fii.hasNext()) 时会直接跳出，fii.hasNext()值为false，原因主要是获取不到当前的request，在Struts2中jsp上传文件的请求被拦截了，处理方法是在struts.xml文件中添加不过滤当前位置JSP的请求：

<constant name="struts.action.excludePattern" value="/umeditor/.*"></constant>