百度编辑器umeditor使用总结

       百度编辑器是一个功能很全、很强大。

百度单张图片上传只能存储在项目下面，而不能独立自定义存储位置，因此重写上传代码

百度文章中的图片是通过base64实现的，直接存储在数据库中

tomcat通过虚拟路径实现将静态资源从项目中独立出来，避免更新项目解压war后文件丢失

  

 

umeditor 配置都是在umeditor.config.js

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

定义文件位置

     window.UMEDITOR_CONFIG['imagePath'] = "/upload";

如何生成umeditor实例

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

     文章内容含有图片时，百度编辑器通过对图片进行base64编码，然后跟随文章内容一起保存在数据库中。

若是通过图片上传按钮插件，支持，php，asp,jsp接收，这样主要讲jsp，返回通过jsonp方式回调方法。image.js进行图片的上传和回调插入文章内容中

    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); //单位KB    up.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>");    }

接收图片并保存到的代码是

package com.baidu.ueditor.um;import java.io.*;import java.text.SimpleDateFormat;import java.util.*;import org.apache.commons.fileupload.*;import org.apache.commons.fileupload.FileUploadBase.InvalidContentTypeException;import org.apache.commons.fileupload.FileUploadBase.SizeLimitExceededException;import org.apache.commons.fileupload.util.*;import org.apache.commons.fileupload.servlet.*;import org.apache.commons.fileupload.FileItemIterator;import org.apache.commons.fileupload.disk.DiskFileItemFactory;import com.moral.util.Common;import com.moral.util.Constants;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 String physicalPath = Constants.Html.EDITOR_UPLOAD_PATH;private HttpServletRequest request = null;private String title = "";//百度插件默认的图片在项目中保存路径private String savePath = "upload";/*自定义的独立的存储路径，目的是在重新发布后仍然保存有这些图片，避免文件丢失*/private String aliasPath = "";// 文件允许格式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);/*复制文件到指定目录下*/Common.copyFile(this.getPhysicalPath(this.url), this.aliasPath + "/" + this.fileName, 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());System.out.println(this.getPhysicalPath(path));File dir = new File(this.getPhysicalPath(path));if (!dir.exists()) {try {dir.mkdirs();} catch (Exception e) {this.state = this.errorInfo.get("DIR");return "";}}this.aliasPath = this.physicalPath + "/" + path;System.out.println("aliasPath="+aliasPath);File aliasDir = new File(this.aliasPath);if(!aliasDir.exists()){try {aliasDir.mkdirs();} catch (Exception e) {e.printStackTrace();}}return path;}/** * 根据传入的虚拟路径获取物理路径 *  * @param path * @return */private String getPhysicalPath(String path) {String realPath = "";String servletPath = this.request.getServletPath();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;}public String getPhysicalPath() {return physicalPath;}public void setPhysicalPath(String physicalPath) {this.physicalPath = physicalPath;}}