JSP solve Kindeditor online editor struts picture upload problem

1. Download

Download CKEditor, extract the unnecessary parts after decompression, only need to keep the Plugin,lang,theme folder, the three folders can be deleted, such as the Lang file to store all language files js, just keep en.js and zh_ Cn.js, keep the JSP folder json_upload.jsp files and kindeditor.js files can be, the JSP below the jar import

　　

Online Editor: http://kindeditor.net/

 

2, modify the json_upload.jsp

Modify the json_upload.jsp file save path can be modified two sentences.

File Save directory path
String Savepath = Pagecontext.getservletcontext (). Getrealpath("/upload");

File save directory URL, absolute path here
String Saveurl = Request.getcontextpath() + "/upload";

3. Optional

Obj.put ("url", Request.getcontextpath () + "/img/" + newfilename);//Modify the picture returned to the editor display

4. Modify in Plugins/images/image.js

Uploadjson = K.undef (Self.uploadjson, Self.basepath + ' jsp/upload_json.jsp ')

5. Modify in Plugins/filemanager/filemanager.js

Filemanagerjson = K.undef (Self.filemanagerjson, Self.basepath + ' jsp/file_manager_json.jsp '),

6, in the JSP

<link rel= "stylesheet" href= "<%=application.getcontextpath ()%>/themes/default/default.css"/>
<script charset= "Utf-8" src= "<%=application.getcontextpath ()%>/js/kindeditor.js" ></script>
<script charset= "Utf-8" src= "<%=application.getcontextpath ()%>/lang/zh_cn.js" ></script>

<script charset= "Utf-8" src= "<%=application.getcontextpath ()%>/lang/zh_cn.js" ></script>
<script>
var editor;
Kindeditor.ready (function (K) {
editor = k.create (' textarea[id= ' content "] ', {
Filtermode:false,
Resizetype:1,
Allowpreviewemoticons:true,
Allowimageupload:true,
items: [
' FontName ', ' fontsize ', ' | ', ' forecolor ', ' hilitecolor ', ' bold ', ' italic ', ' underline ',
' Removeformat ', ' | ', ' justifyleft ', ' justifycenter ', ' justifyright ', ' insertorderedlist ',
' insertunorderedlist ', ' | ', ' emoticons ', ' image ', ' link '
                    
                    });
K (' input[name=submit] '). Click (function (e) {
Editor.value=editor.text ();
                });
            });
</script>

<textarea tabindex= "4" name= "brand.content" id= "Content" style= "width:80.2%" ></textarea>

----------------------------Struts----------------------------------------------------

1, struts direct <url-pattern>/*</url-pattern> will intercept the online editor URL, so you need to configure the following, this is only one of the problems to solve the problem

2. Custom Filter

Public class Kindeditorurlfilter extends Strutsprepareandexecutefilter {

@Override
Public void DoFilter (ServletRequest req, servletresponse Res,
Filterchain chain) throws IOException, servletexception {
        
httpservletrequest request = (httpservletrequest) req;
//non-filtered URLs
String url = request.getservletpath ();
           
if ("/js/jsp/file_manager_json.jsp". Equals (URL)) {
                
Chain.dofilter (req, res);
}else if ("/js/jsp/upload_json.jsp". Equals (URL)) {
Chain.dofilter (req, res);
}else{
//system.out.println ("Use default filter");
Super.dofilter (req, res, chain);
           }    
    }
}

3. Web. XML Configuration Filter

<filter>
<filter-name>struts2</filter-name>
<filter-class>com.dan.action.KindeditorUrlFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>

JSP solve Kindeditor online editor struts picture upload problem