Ueditor Usage Summary (integration with SPRINGMVC)

Recently Rich text box, chose the ueditor, the reason is: beautiful interface, Baidu Open source
However

Open the road to integration (how to do) 1. Download plugins

Download only put the plugin under WebApp,

2. Modification

After the import we need to modify some parameters to meet our needs.

We want to modify the image save path, because the plugin is saved in the project deployment path, each time the redeployment of the picture will disappear, so we need to save the picture separately to a picture server, the controller of the display picture is as follows

@RequestMapping (value = "/showimage") Public voidShowImage (httpservletrequest request, HttpServletResponse response,string filePath) {String RootPath=request.getsession (). Getservletcontext (). Getrealpath ("/"); String Absolutepath=rootpath+FilePath;//intercept file suffix nameString suffix=absolutepath.substring (Absolutepath.lastindexof (".") +1); String Responsetype= "Image/jpeg";if("PNG". Equals (suffix)) {Responsetype= "Image/png";} Else if("JPG". Equals (suffix) | | "JPEG". Equals (suffix)) {Responsetype= "Image/jpeg";} Else if("GIF". Equals (suffix)) {Responsetype= "Image/gif";} Response.setcontenttype (Responsetype); FileInputStream InputStream=NULL; OutputStream os=NULL;Try {intCount;inputstream=NewFileInputStream (absolutepath); OS=Response.getoutputstream ();byte[] buffer=New byte[1024*1024]; while(Count=inputstream.read (buffer))!=-1) {os.write (buffer,0, count);}}Catch(IOException ex) {Logger.error ("Picture not Found {}", ex);}finally {if(inputstream!=NULL){Try{inputstream.close ();}Catch(IOException e) {e.printstacktrace ();}}if(os!=NULL){Try{Os.flush (); Os.close ();}Catch(IOException e) {e.printstacktrace (); }}}}

If you don't want to change it, we're done, because my project uses the SPRINGMVC, if you're on the web. XML side of the configuration

Multi-image upload may encounter the pop-up box can not display problems
Because the popup static resource is image.html, The image.html does not have a corresponding controller, after being intercepted by Dispatcherservlet, will not find the controller, and then will throw 404 of the error, the current temporary approach is to fix a image.html suffix of htm, so that it is not intercepted.

3. Use

Front desk Use

class class= "Required" ></script>= ue.geteditor (' editor '); Ue.ready (function () { Ue.setcontent ($ ("#info"

Related code structure and principles

The Ueditor upload function is implemented in the controller.jsp

<%@ page language= "java" contenttype= "text/html; Charset=utf-8 "pageencodingImport=" Com.baidu.ueditor.ActionEnter "%><%@ page Trimdirectivewhitespaces= "true"%><%"Utf-8" ) Response.setheader ("Content-type", "text/ HTML "= Application.getrealpath ("/"new  actionenter (Request, RootPath). exec ()); %>

The entrance is in the ueditor.config.js.
=========================================================================

The Perfect dividing line

If you feel that using controller.jsp as an upload service is inappropriate, we can also modify the upload code into the controller
The code is as follows:

 PackageCom.lyz.controller;ImportCom.baidu.ueditor.ActionEnter;ImportOrg.slf4j.Logger;Importorg.slf4j.LoggerFactory;ImportOrg.springframework.stereotype.Controller;Importorg.springframework.web.bind.annotation.RequestMapping;Importjavax.servlet.http.HttpServletRequest;ImportJavax.servlet.http.HttpServletResponse;ImportJava.io.FileInputStream;Importjava.io.IOException;ImportJava.io.OutputStream;ImportJava.io.PrintWriter;/*** Created by Xiangwei on 2017/7/16.*/@Controller @requestmapping ("/ueditor") Public classUeditorcontroller {PrivateLogger logger= Loggerfactory.getlogger (Ueditorcontroller.class); @RequestMapping (Value= "/dispatch") Public voidConfig (httpservletrequest request, httpservletresponse response) {Response.setcontenttype ("Application/json"); String RootPath= Request.getsession (). Getservletcontext (). Getrealpath ("/"); Response.setheader ("Content-type", "text/html");Try{String exec=NewActionenter (Request, RootPath). exec (); PrintWriter writer=Response.getwriter (); Writer.write (exec); Writer.flush (); Writer.close ();} Catch(IOException e) {logger.error ("Picture upload failed!"); E.printstacktrace (); }}}

Then modify the Ueditor.config.js file in the

Then modify the Getconfigpath () method of the ConfigManager class to specify the path to the Config.json path.

Such as:

Private String Getconfigpath () {//    return This.parentpath + File.separator + Configmanager.configfilename; return this. rootpath+file.separator+ "static/ueditor/" + "jsp" +file.separator+configmanager.configfilename;}

Ueditor Usage Summary (integration with SPRINGMVC)