[置顶] KindEditor 在线编辑器 自定义文件上传与图片管理器实现

引入:kindeditor.js

前台页面

KindEditor.ready(function(K) {

//初始化编辑器

window.editor = K.create('#promorionText', {

//容器的各项功能

items: ['source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'code', 'cut', 'copy', 'paste','plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright','justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript','superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/','formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold','italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage','flash', 'media', 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak','anchor', 'link', 'unlink', '|', 'about'],

//本地图片上传

uploadJson: '../../image_upload.action',

//图片空间管理

fileManagerJson: '../../image_manage.action',//指定是否开启【浏览服务器】功能allowFileManager: true});});

后台接收

import java.io.File;import java.io.IOException;import java.text.SimpleDateFormat;import java.util.ArrayList;import java.util.Arrays;import java.util.HashMap;import java.util.List;import java.util.Map;import java.util.UUID;import org.apache.commons.io.FileUtils;import org.apache.struts2.ServletActionContext;import org.apache.struts2.convention.annotation.Action;import org.apache.struts2.convention.annotation.Namespace;import org.apache.struts2.convention.annotation.ParentPackage;import org.apache.struts2.convention.annotation.Result;import org.springframework.context.annotation.Scope;import org.springframework.stereotype.Controller;import com.opensymphony.xwork2.ActionContext;import cn.action.common.BaseAction;/*** @date 日期:2017年11月18日* @author 作者:kaisen***/@ParentPackage("json-default")@Namespace("/")@Controller@Scope("prototype")public class ImageAction extends BaseAction<Object> {private File imgFile;private String imgFileFileName;private String imgFileContentType;public void setImgFile(File imgFile) {this.imgFile = imgFile;}public void setImgFileFileName(String imgFileFileName) {this.imgFileFileName = imgFileFileName;}public void setImgFileContentType(String imgFileContentType) {this.imgFileContentType = imgFileContentType;}// 将文件保存到服务器磁盘上@Action(value = "image_upload", results = { @Result(name = "success", type = "json") })public String upload() {// 接收文件名及文件System.out.println("文件：" + imgFile);System.out.println("文件名：" + imgFileFileName);System.out.println("文件类型：" + imgFileContentType);// 绝对路径String savePath = ServletActionContext.getServletContext().getRealPath("/upload/");// 相对路径System.out.println(savePath);String saveUrl = ServletActionContext.getRequest().getContextPath() + "/upload/";// 将文件保存到磁盘上// 图片名随机String uid = UUID.randomUUID().toString().replace("-", "");String ext = imgFileFileName.substring(imgFileFileName.lastIndexOf("."));String randomFileName = uid + ext;// 保存文件File destFile = new File(savePath + "/" + randomFileName);System.out.println(destFile.getAbsolutePath());try {FileUtils.copyFile(imgFile, destFile);} catch (IOException e) {// TODO Auto-generated catch blocke.printStackTrace();}// 将文件路径返回至浏览器// 通知浏览器文件上传成功Map<String, Object> result = new HashMap<String, Object>();result.put("error", 0);result.put("url", saveUrl + randomFileName); // 返回相对路径ActionContext.getContext().getValueStack().push(result);return SUCCESS;}

//图片空间管理@Action(value = "image_manage", results = { @Result(name = "success", type = "json") })public String imageManage() {String rootPath = ServletActionContext.getServletContext().getRealPath("/") + "upload/";// 根目录URL，可以指定绝对路径，比如 http://www.yoursite.com/attached/ String rootUrl = ServletActionContext.getRequest().getContextPath() + "/upload/";// 遍历目录取的文件信息List<Map<String, Object>> fileList = new ArrayList<Map<String, Object>>();// 当前上传目录File currentPathFile = new File(rootPath);// 图片扩展名String[] fileTypes = new String[] { "gif", "jpg", "jpeg", "png", "bmp" };if (currentPathFile.listFiles() != null) {for (File file : currentPathFile.listFiles()) {Map<String, Object> hash = new HashMap<String, Object>();String fileName = file.getName();if (file.isDirectory()) {hash.put("is_dir", true);hash.put("has_file", (file.listFiles() != null));hash.put("filesize", 0L);hash.put("is_photo", false);hash.put("filetype", "");} else if (file.isFile()) {String fileExt = fileName.substring(fileName.lastIndexOf(".") + 1).toLowerCase();hash.put("is_dir", false);hash.put("has_file", false);hash.put("filesize", file.length());hash.put("is_photo", Arrays.<String> asList(fileTypes).contains(fileExt));hash.put("filetype", fileExt);}hash.put("filename", fileName);hash.put("datetime", new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(file.lastModified()));fileList.add(hash);}}Map<String, Object> result = new HashMap<String, Object>();result.put("moveup_dir_path", "");result.put("current_dir_path", rootPath);result.put("current_url", rootUrl);result.put("total_count", fileList.size());result.put("file_list", fileList);ActionContext.getContext().getValueStack().push(result);return SUCCESS;}}