kindeditor的简单使用

上传到云：

一、引入kindeditor

<%@ page language="java" contentType="text/html; charset=UTF-8"%>

<%@ include file="/WEB-INF/views/commons/taglibs.jsp"%>

<html>

    <head>

        <script type="text/javascript">

            yepnope({

                load:[

                '${ctx}/resources/kindeditor/themes/default/default.css',

                '${ctx}/resources/kindeditor/plugins/code/prettify.css',

                '${ctx}/resources/js/ux/KindEditor.js',

                '${ctx}/resources/kindeditor/kindeditor.js',

                '${ctx}/resources/kindeditor/lang/zh_CN.js',

                '${ctx}/resources/kindeditor/plugins/code/prettify.js',

                '${ctx}/resources/extjs/ux/combotree/ComboTree.js',

                '${ctx}/resources/extjs/ux/css/Spinner.css',

                '${ctx}/resources/extjs/ux/Spinner.js',

                '${ctx}/resources/extjs/ux/SpinnerField.js',

                '${ctx}/resources/extjs/ux/DateTimeField.js',

                '${ctx}/plugins/websites/web/resources/js/news/NewsFormPanel.js',

                '${ctx}/plugins/websites/web/resources/js/news/NewsFormWin.js',

                '${ctx}/plugins/websites/web/resources/js/news/NewsReadWindow.js',

                '${ctx}/plugins/websites/web/resources/js/news/NewsUploadWindow.js',

                '${ctx}/plugins/websites/web/resources/js/news/NewsPanel.js',

                '${ctx}/plugins/websites/web/resources/js/news/NewsSynFormWin.js',

                '${ctx}/plugins/websites/web/resources/js/news/NewsSynFormPanel.js',

                '${ctx}/plugins/websites/web/resources/js/news/ImportNewsWin.js',

                '${ctx}/plugins/websites/web/resources/js/news/TreeWindow.js',

                '${ctx}/resources/js/shareux.js',

                '${ctx}/resources/js/ux/StarHtmleditor.js'],

                complete:function(){

                    var panel = new Ext.websites.NewsPanel({

                        height : index.tabPanel.getInnerHeight() - 1,

                        id: '${param.id}' + '_panel',

                        actionJson:${actionJson},

                        renderTo: '${param.id}'

                    });

                }

            });

        </script>

    </head>

    <body>

        <div id="${param.id}"></div>

    </body>

</html>

二、重写下kindeditor方法

Ext.ux.KindEditor = Ext.extend(Ext.form.TextArea, {

    uploadUrl:null,

    render : function(editor) {

        Ext.ux.KindEditor.superclass.render.call(this, editor);

        var contentId = this.id;

        if(this.uploadUrl == undefined){

                this.uploadUrl = 'kindEditor/upload';

        }

        var that = this;

        window.setTimeout(function() {

            that.myEditor = KindEditor.create('#' + contentId, {

                cssPath : 'resources/kindeditor/plugins/code/prettify.css',

                uploadJson : that.uploadUrl,

                // uploadJson:'resources/kindeditor/jsp/upload_json.jsp',

                fileManagerJson : 'resources/kindeditor/jsp/file_manager_json.jsp',

                resizeType : 1,

                resizeMode : 1,

                 filterMode : false,

                allowFileManager : true,

                afterCreate : function(id) {

                    /* 响应 ctrl + v ，保存图片* */

                    //KindEditor.ctrl(document, 'v', function() {

                        //    });

//                    KindEditor.ctrl(KindEditor.g[id].iframeDoc, 86, function() {

//                                KindEditor.util.setData(id);

//                                var doc = KindEditor.g[id].iframeDoc;

//                                setTimeout(dealdoc(doc), 100);

//                            });

//                    // ie 中粘贴 --- 包括 toolbar 中 的粘贴和右键浏览器菜单中的粘贴

//                    KindEditor.g[id].iframeDoc.body.onpaste = function() {

//                        var doc = KindEditor.g[id].iframeDoc;

//                        setTimeout(dealdoc(doc), 100);

//                    };

//                    // firefox 粘贴 --- 包括 ctrl+v 和右键浏览器菜单中的粘贴

//                    $(KindEditor.g[id].iframeDoc).bind('paste', null, function() {

//                                var doc = KindEditor.g[id].iframeDoc;

//                                setTimeout(dealdoc(doc), 100);

//                            });

        }

            });

        }, 500);

    },

    getValue : function() {

        if (this.myEditor) {

            return this.myEditor.html();

        } else {

            return '';

        }

    },

    setValue : function(v) {

        var contentId = this.id;

        var that = this;

        window.setTimeout(function() {

                    KindEditor.html('#' + contentId, v);

                }, 500);

    }

});

// 返回 一个无参的方法，用于setTimeout

function dealdoc(doc) {

    return function() {

        deal(doc);

    }

}

// 粘贴时处理图片-- 方法二：同步，可以接受多张图片

function deal(doc) {

    var links = doc.getElementsByTagName("img");

    for (var i = 0; i < links.length; i++) {

        var lin = $(links[i]);

        if ($(lin).attr("add_src")) {

        } else {

            // links[i].src = "<c:url

            // value='/saveImageServlet?mageurl='/>"+links[i].src;

            var imgurl = $(lin).attr("src");

            var html = $.ajax({

                        type : "POST",

                        url : "<c:url value='/saveImageServlet'/>",

                        data : "imageurl=" + imgurl,

                        dataType : "html",

                        async : false

                    }).responseText;

            $(lin).attr("src", "");

            $(lin).attr("src", html);

            $(lin).attr("add_src", "1");

        }

    }

}

Ext.reg('kindeditor', Ext.ux.KindEditor);

这个是上面引入的ux包下的kindeditor方法

三、kindeditor上传的controller

package cn.edu.hbcf.privilege.web.controller;

import java.io.PrintWriter;

import java.util.Arrays;

import java.util.HashMap;

import java.util.Map;

import java.util.UUID;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import org.apache.commons.lang.StringUtils;

import org.json.simple.JSONObject;

import org.springframework.stereotype.Controller;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.RequestParam;

import org.springframework.web.multipart.MultipartFile;

import cn.edu.hbcf.common.hadoop.FileManager;

import cn.edu.hbcf.common.hadoop.FileSysFactory;

import cn.edu.hbcf.common.hadoop.FileSysType;

@Controller

@RequestMapping("/kindEditor")

public class KindeditorController {

    @RequestMapping("/upload")

    public void upload(@RequestParam

    MultipartFile imgFile, HttpServletRequest request, String dir,

            HttpServletResponse response) {

        try {

            // 定义允许上传的文件扩展名

            response.setContentType("text/html; charset=UTF-8");

            PrintWriter out = response.getWriter();

            Map<String, String> extMap = new HashMap<String, String>();

            extMap.put("image", "gif,jpg,jpeg,png,bmp");

            extMap.put("flash", "swf,flv");

            extMap.put("media",

                    "swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb");

            extMap.put("file",

                    "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2");

            String fileName = imgFile.getOriginalFilename();

            // 检查扩展名

            String fileExt =  StringUtils.substringAfterLast(fileName, ".").toLowerCase();

            if (!Arrays.<String> asList(extMap.get(dir).split(",")).contains(

                    fileExt)) {

                out.println(getError("上传文件扩展名是不允许的扩展名。\n只允许" + extMap.get(dir)

                        + "格式。"));

                return;

            }

            // 获取文件后缀名

            String saveName = UUID.randomUUID().toString().replace("-", "")+("".equals(fileExt) ? "" : "." + fileExt);

            String filePath="/filesharesystem/attach";

            FileManager fileMgr=FileSysFactory.getInstance(FileSysType.HDFS);

            fileMgr.putFile(imgFile.getInputStream(), filePath, saveName);

//

            JSONObject obj = new JSONObject();

            obj.put("error", 0);

            if("image".equals(dir)||"media".equals(dir)||"flash".equals(dir)){

                obj.put("url", "dfs/queryResource?resourcePath="+filePath+"/"+saveName);

            }else{

                obj.put("url", "dfs/downloadFile?filePath="+filePath+"/"+saveName+"&fileName="+fileName);

            }

            System.out.println("AAAAAAAAAURL:"+obj.get("url"));

            out.println(obj.toJSONString());

        } catch (Exception e) {

            e.printStackTrace();

        }

    }

    private String getError(String message) {

        JSONObject obj = new JSONObject();

        obj.put("error", 1);

        obj.put("message", message);

        return obj.toJSONString();

    }

}

四、根据地址预览、下载文件的方法

package cn.edu.hbcf.cloud.hadoop.dfs.controller;

import java.io.BufferedInputStream;

import java.io.BufferedOutputStream;

import java.io.IOException;

import java.io.OutputStream;

import java.io.UnsupportedEncodingException;

import java.util.List;

import java.util.UUID;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import javax.servlet.http.HttpSession;

import org.apache.commons.lang.StringUtils;

import org.apache.hadoop.fs.FSDataInputStream;

import org.apache.hadoop.io.IOUtils;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.stereotype.Controller;

import org.springframework.ui.Model;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.RequestMethod;

import org.springframework.web.bind.annotation.RequestParam;

import org.springframework.web.bind.annotation.ResponseBody;

import org.springframework.web.multipart.MultipartFile;

import cn.edu.hbcf.cloud.hadoop.dfs.service.DFSService;

import cn.edu.hbcf.cloud.hadoop.dfs.vo.DfsInfo;

import cn.edu.hbcf.common.constants.WebConstants;

import cn.edu.hbcf.common.hadoop.CFile;

import cn.edu.hbcf.common.hadoop.FileManager;

import cn.edu.hbcf.common.hadoop.FileSysFactory;

import cn.edu.hbcf.common.hadoop.FileSysType;

import cn.edu.hbcf.common.vo.Criteria;

import cn.edu.hbcf.common.vo.ExceptionReturn;

import cn.edu.hbcf.common.vo.ExtFormReturn;

import cn.edu.hbcf.plugin.oa.pojo.NoteBook;

import cn.edu.hbcf.privilege.pojo.BaseUsers;

@Controller

@RequestMapping("/dfs")

public class DFSController {

    @Autowired

    private DFSService dfsService;

    @RequestMapping(method=RequestMethod.GET)

    public String index(HttpServletRequest request,HttpSession session,Model model){

        return "plugins/cloud/web/views/hadoop/dfs/dfs";

    }

    @RequestMapping(value = "/play",method=RequestMethod.GET)

    public String play(HttpServletRequest request,HttpSession session,Model model){

        return "plugins/cloud/web/views/hadoop/dfs/play";

    }

    @RequestMapping("/upload")

    public void upload(@RequestParam MultipartFile file, HttpServletRequest request, HttpServletResponse response){

        String uploadFileName = file.getOriginalFilename();

        FileManager fileMgr=FileSysFactory.getInstance(FileSysType.HDFS);

        String path=request.getParameter("path");

        HttpSession session=request.getSession(true);

        BaseUsers u = (BaseUsers) session.getAttribute(WebConstants.CURRENT_USER);

        // 获取文件后缀名

        String fileType = StringUtils.substringAfterLast(uploadFileName, ".");

        String saveName = UUID.randomUUID().toString().replace("-", "")+("".equals(fileType) ? "" : "." + fileType);

        String filePath="/filesharesystem/"+u.getAccount()+path;

        try {

            fileMgr.putFile(file.getInputStream(), filePath, saveName);

            System.out.println("path="+filePath+" uploadFileName="+uploadFileName);

            StringBuffer buffer = new StringBuffer();

            buffer.append("{success:true,fileInfo:{fileName:'").append(uploadFileName).append("',");

            buffer.append("filePath:'").append(filePath+saveName).append("',");

            buffer.append("projectPath:'").append(filePath+saveName).append("',");

            buffer.append("storeName:'").append(saveName);

            buffer.append("'}}");

            response.setContentType("text/html;charset=utf-8;");

            response.getWriter().write(buffer.toString());

            response.getWriter().flush();

            response.getWriter().close();

        } catch (IOException e) {

            // TODO Auto-generated catch block

            e.printStackTrace();

        }

    }

    @RequestMapping(value="/downloadFile", method = RequestMethod.GET)

    public void download(HttpServletRequest request, HttpServletResponse response,String filePath,String fileName) {

         //String fileName=request.getParameter("fileName");

         try {

             fileName=new String(fileName.getBytes("ISO-8859-1"),"UTF-8");

             filePath=new String(filePath.getBytes("ISO-8859-1"),"UTF-8");

         } catch (UnsupportedEncodingException e1) {

             // TODO Auto-generated catch block

             e1.printStackTrace();

         }

         OutputStream output = null;

         BufferedInputStream bis=null;

         BufferedOutputStream bos=null;

          FileManager fileMgr=FileSysFactory.getInstance(FileSysType.HDFS);

         //response.setContentType("application/x-msdownload");

         //response.setCharacterEncoding("UTF-8");

         try {

             output = response.getOutputStream();

             response.setHeader("Content-Disposition","attachment;filename="+new String(fileName.getBytes("gbk"),"iso-8859-1"));

             bis=new BufferedInputStream(fileMgr.getFile(filePath));

             bos=new BufferedOutputStream(output);

             byte[] buff=new byte[2048];

             int bytesRead;

             while(-1!=(bytesRead=bis.read(buff,0,buff.length))){

                 bos.write(buff,0,bytesRead);

             }

         } catch (UnsupportedEncodingException e) {

             // TODO Auto-generated catch block

             e.printStackTrace();

         } catch (IOException e) {

             // TODO Auto-generated catch block

             e.printStackTrace();

         } finally{

             if(bis!=null)

                 try {

                     bis.close();

                 } catch (IOException e) {

                     // TODO Auto-generated catch block

                     e.printStackTrace();

                 }

             if(bos!=null)

                 try {

                     bos.close();

                 } catch (IOException e) {

                     // TODO Auto-generated catch block

                     e.printStackTrace();

                 }

         }

     }

    @RequestMapping("/delete")

    public void delete(String path, HttpServletResponse response){

        FileManager fileMgr=FileSysFactory.getInstance(FileSysType.HDFS);

        try {

            fileMgr.deleteFile(path);

            StringBuffer buffer = new StringBuffer();

            buffer.append("{success:true}");

            response.setContentType("text/html;charset=utf-8;");

            response.getWriter().write(buffer.toString());

            response.getWriter().flush();

            response.getWriter().close();

        } catch (IOException e) {

            // TODO Auto-generated catch block

            e.printStackTrace();

        }

    }

    @RequestMapping(value ="/queryMovie",method=RequestMethod.GET)

    public void queryMovie( HttpServletRequest request, HttpServletResponse response){

        response.setContentType("application/octet-stream");

        FileManager fileMgr = FileSysFactory.getInstance(FileSysType.HDFS);

        FSDataInputStream fsInput = fileMgr.getStreamFile("/filesharesystem/admin/test/a.swf");

        OutputStream os;

        try {

            os = response.getOutputStream();

            IOUtils.copyBytes(fsInput, os, 4090, false);

            os.flush();

            os.close();

        } catch (IOException e) {

            // TODO Auto-generated catch block

            e.printStackTrace();

        } 

    }

    /**

     * 根据提交的路径，从云上获取swf格式和picture文档内容

     */

    @RequestMapping(value = "/queryResource", method = RequestMethod.GET)

    public void queryResource(HttpServletRequest request,

            HttpServletResponse response, String resourcePath) {

        response.setContentType("application/octet-stream");

        FileManager fileMgr = FileSysFactory.getInstance(FileSysType.HDFS);

        FSDataInputStream fsInput = fileMgr.getStreamFile(resourcePath);

        OutputStream os = null;

        try {

            os = response.getOutputStream();

            IOUtils.copyBytes(fsInput, os, 4090, false);

        } catch (IOException e) {

            // TODO Auto-generated catch block

            e.printStackTrace();

        } finally{

            try {

                if(os != null){

                    os.flush();

                    os.close();

                }

                if(fsInput!= null){

                    fsInput.close();

                }

            } catch (IOException e) {

                // TODO Auto-generated catch block

                e.printStackTrace();

            }

        }

    }

    @RequestMapping(value = "/queryListForTree", method = RequestMethod.POST)

    @ResponseBody

    public List<CFile> queryListForTree(HttpServletRequest request) {

        HttpSession session=request.getSession(true);

        BaseUsers u = (BaseUsers) session.getAttribute(WebConstants.CURRENT_USER);

        Criteria criteria = new Criteria();

        criteria.put("username", u.getAccount());

        return dfsService.queryListForTree(criteria);

    }

    @RequestMapping(value="/status",method=RequestMethod.GET)

    public String dfsIndex(HttpServletRequest request,HttpSession session,Model model){

        return "plugins/cloud/web/views/hadoop/dfs/dfsStatus";

    }

    @RequestMapping(value="/status", method = RequestMethod.POST)

    @ResponseBody

    public Object get(HttpSession session){

        try{

            DfsInfo dfs = dfsService.getDfsInfo();

            if(dfs != null){

                return new ExtFormReturn(true,dfs);

            }else{

                return new ExtFormReturn(false);

            }

        }catch(Exception e){

            e.printStackTrace();

            return new ExceptionReturn(e);

        }

    }

    @RequestMapping(value="/dataNode", method = RequestMethod.POST)

    @ResponseBody

    public Object dataNode(){

        try{

            return dfsService.getDataNodeList();

        }catch(Exception e){

            e.printStackTrace();

            return new ExceptionReturn(e);

        }

    }

}

即可。

上传到本地服务器：

/**

    * 描述：公司网站内容kindeditor上传图片

    * @param imgFile

    * @param request

    * @param dir

    * @param response

    */

    @RequestMapping("/uploadKindEditor")

    public void upload(@RequestParam

    MultipartFile imgFile, HttpServletRequest request, String dir,

            HttpServletResponse response) {

            try {

                response.setContentType("text/html;charset=utf-8;");

                PrintWriter out = response.getWriter();

                Map<String, String> extMap = new HashMap<String, String>();

                extMap.put("image", "gif,jpg,jpeg,png,bmp");

                extMap.put("flash", "swf,flv");

                extMap.put("media",

                        "swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb");

                extMap.put("file",

                        "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2");

                // 检查扩展名

                String fileName = imgFile.getOriginalFilename();

                String fileExt =  StringUtils.substringAfterLast(fileName, ".").toLowerCase();

                if (!Arrays.<String> asList(extMap.get(dir).split(",")).contains(

                        fileExt)) {

                    out.println(getError("上传文件扩展名是不允许的扩展名。\n只允许" + extMap.get(dir)

                            + "格式。"));

                    return;

                }

                // 保存的地址

                String savePath = request.getSession().getServletContext().getRealPath("/"+"/upload/web");

                // 上传的文件名 //需要保存

                String uploadFileName = imgFile.getOriginalFilename();

                // 获取文件后缀名 //需要保存

                String fileType = StringUtils.substringAfterLast(uploadFileName, ".");

                // 以年月/天的格式来存放

                String dataPath = DateFormatUtils.format(new Date(), "yyyy-MM" + File.separator + "dd");

                // uuid来保存不会重复

                String saveName = UUID.randomUUID().toString().replace("-", "");

                // 最终相对于upload的路径，解决没有后缀名的文件 //需要保存

                // 为了安全，不要加入后缀名

                // \2011-12\01\8364b45f-244d-41b6-bbf4-8df32064a935，等下载的的时候在加入后缀名

                String finalPath = File.separator + dataPath + File.separator + saveName + ("".equals(fileType) ? "" : "." + fileType);

//                String filePath = savePath.replace("\\", "/")+finalPath.replace("\\", "/");

                File saveFile = new File(savePath + finalPath);

                // 判断文件夹是否存在，不存在则创建

                if (!saveFile.getParentFile().exists()) {

                    saveFile.getParentFile().mkdirs();

                }

                // 写入文件

                FileUtils.writeByteArrayToFile(saveFile, imgFile.getBytes());

                // 保存文件的基本信息到数据库

                //图片相对tomcat路径

                String imgPath = "/upload/web".replace("\\", "/") + finalPath.replace("\\", "/");

                JSONObject obj = new JSONObject();

                obj.put("error", 0);

                if("image".equals(dir)){

                    obj.put("url", "web/queryResource?resourcePath="+imgPath);

//                    obj.put("url", "web/queryResource?resourcePath="+filePath+"/"+saveName);

                }else{

//                    obj.put("url", "dfs/downloadFile?filePath="+filePath+"/"+saveName+"&fileName="+fileName);

                    out.println(getError("上传文件扩展名是不允许的扩展名。\n只允许" + extMap.get(dir)

                            + "格式。"));

                    return;

                }

                System.out.println("AAAAAAAAAURL:"+obj.get("url"));

                out.println(obj.toJSONString());

            } catch (Exception e) {

                e.printStackTrace();

            }

    }

    @RequestMapping(value = "/queryResource", method = RequestMethod.GET)

    public void queryResource(HttpServletRequest request,

            HttpServletResponse response, String resourcePath) {

        response.setContentType("application/octet-stream");

//        FileManager fileMgr = FileSysFactory.getInstance(FileSysType.HDFS);

//        FSDataInputStream fsInput = fileMgr.getStreamFile(resourcePath);

        String path = request.getSession().getServletContext().getRealPath("/");

        File file = new File(path+resourcePath);

        InputStream in = null;

        OutputStream os = null;

        try {

            in = new FileInputStream(file);

            os = response.getOutputStream();

            IOUtils.copy(in, os);

        } catch (IOException e) {

            e.printStackTrace();

        } finally{

            try {

                if(os != null){

                    os.flush();

                    os.close();

                }

                if(in != null){

                    in.close();

                }

            } catch (IOException e) {

                e.printStackTrace();

            }

        }

    }

   private String getError(String message) {

        JSONObject obj = new JSONObject();

        obj.put("error", 1);

        obj.put("message", message);

        return obj.toJSONString();

   }

<%@ page language="java" contentType="text/html; charset=UTF-8"%><%@ include file="/WEB-INF/views/commons/taglibs.jsp"%><html><head><script type="text/javascript">yepnope({load:['${ctx}/resources/kindeditor/themes/default/default.css','${ctx}/resources/kindeditor/plugins/code/prettify.css','${ctx}/resources/js/ux/KindEditor.js','${ctx}/resources/kindeditor/kindeditor.js','${ctx}/resources/kindeditor/lang/zh_CN.js','${ctx}/resources/kindeditor/plugins/code/prettify.js','${ctx}/resources/extjs/ux/combotree/ComboTree.js','${ctx}/resources/extjs/ux/css/Spinner.css','${ctx}/resources/extjs/ux/Spinner.js','${ctx}/resources/extjs/ux/SpinnerField.js','${ctx}/resources/extjs/ux/DateTimeField.js','${ctx}/plugins/websites/web/resources/js/news/NewsFormPanel.js','${ctx}/plugins/websites/web/resources/js/news/NewsFormWin.js','${ctx}/plugins/websites/web/resources/js/news/NewsReadWindow.js','${ctx}/plugins/websites/web/resources/js/news/NewsUploadWindow.js','${ctx}/plugins/websites/web/resources/js/news/NewsPanel.js','${ctx}/plugins/websites/web/resources/js/news/NewsSynFormWin.js','${ctx}/plugins/websites/web/resources/js/news/NewsSynFormPanel.js','${ctx}/plugins/websites/web/resources/js/news/ImportNewsWin.js','${ctx}/plugins/websites/web/resources/js/news/TreeWindow.js','${ctx}/resources/js/shareux.js', '${ctx}/resources/js/ux/StarHtmleditor.js'],complete:function(){var panel = new Ext.websites.NewsPanel({height : index.tabPanel.getInnerHeight() - 1, id: '${param.id}' + '_panel', actionJson:${actionJson}, renderTo: '${param.id}'});}});</script></head><body><div id="${param.id}"></div></body></html>

秒客网

kindeditor的简单使用

相关文章