Part 1:下载富文本编辑器源码及JSP代码
官网下载传送门:UEditor下载链接
下载版本如图所示:
Part 2:搭建运行环境
将源码文件夹中这个文件夹放入\src\main\java\com\下
将jsp文件下这些东西放入\src\main\resources\static下
配置资源文件路径[1.5版本springboot可以不配]
@Configuration public class WebMvcAdapterConfig extends WebMvcConfigurationSupport{ @Override protected void addResourceHandlers(ResourceHandlerRegistry registry) { // TODO Auto-generated method stub registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/"); registry.addResourceHandler("/path/**").addResourceLocations("file:/C:/upload/img/"); super.addResourceHandlers(registry); } @Override public void addViewControllers(ViewControllerRegistry registry) { // TODO Auto-generated method stub registry.addViewController("/index.html").setViewName("index"); super.addViewControllers(registry); } }
添加依赖包
修改index.html js引用路径,根据4中配置决定
启动项目,如果访问页面看到下图,代表配置初步成功,已经可以使用基本功能[我的工具栏自定义过,所以会比正常的少一些控件]
Part 3:上传图片功能配置
完成Part 2配置后,点击图片上传功能,发现不可用,提示
将jsp文件夹下的config.json文件放入\src\main\resources\下
依据源码里的controller.jsp,写一个映射路径为config的控制层方法
/** * 百度富文本编辑器 * @param request * @param response */ @RequestMapping(value="/config") public void config(HttpServletRequest request, HttpServletResponse response) { response.setContentType("application/json"); String rootPath = request.getSession().getServletContext().getRealPath("/"); try { String exec = new ActionEnter(request, rootPath).exec(); PrintWriter writer = response.getWriter(); writer.write(exec); writer.flush(); writer.close(); } catch (JSONException e) { e.printStackTrace(); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } }
修改ConfigManage类的getConfigPath()方法
private String getConfigPath () { try{ //获取classpath下的config.json路径 return this.getClass().getClassLoader().getResource("config.json").toURI().getPath(); }catch (URISyntaxException e){ return null; } }
配置ueditor.config.js
运行项目路径http://localhost:8080/config?action=config,如下图显示则表示可读取到config.json文件[我这是自动转换json格式插件,正常情况配置文件内容输出出来就可以了]
修改BinaryUploader 类,解决其无法获得带字节流的request的问题
public class BinaryUploader { public static final State save(HttpServletRequest request, Map<String, Object> conf) { // FileItemStream fileStream = null; // boolean isAjaxUpload = request.getHeader( "X_Requested_With" ) != null; if (!ServletFileUpload.isMultipartContent(request)) { return new BaseState(false, AppInfo.NOT_MULTIPART_CONTENT); } // ServletFileUpload upload = new ServletFileUpload( // new DiskFileItemFactory()); // // if ( isAjaxUpload ) { // upload.setHeaderEncoding( "UTF-8" ); // } try { // FileItemIterator iterator = upload.getItemIterator(request); // // while (iterator.hasNext()) { // fileStream = iterator.next(); // // if (!fileStream.isFormField()) // break; // fileStream = null; // } // // if (fileStream == null) { // return new BaseState(false, AppInfo.NOTFOUND_UPLOAD_DATA); // } MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request; MultipartFile multipartFile = multipartRequest.getFile(conf.get("fieldName").toString()); if(multipartFile==null){ return new BaseState(false, AppInfo.NOTFOUND_UPLOAD_DATA); } String savePath = (String) conf.get("savePath"); //String originFileName = fileStream.getName(); String originFileName = multipartFile.getOriginalFilename(); String suffix = FileType.getSuffixByFilename(originFileName); originFileName = originFileName.substring(0, originFileName.length() - suffix.length()); savePath = savePath + suffix; long maxSize = ((Long) conf.get("maxSize")).longValue(); if (!validType(suffix, (String[]) conf.get("allowFiles"))) { return new BaseState(false, AppInfo.NOT_ALLOW_FILE_TYPE); } savePath = PathFormat.parse(savePath, originFileName); String physicalPath = (String) conf.get("rootPath") + savePath; //InputStream is = fileStream.openStream(); InputStream is = multipartFile.getInputStream(); State storageState = StorageManager.saveFileByInputStream(is, physicalPath, maxSize); is.close(); if (storageState.isSuccess()) { storageState.putInfo("url", PathFormat.format(savePath)); storageState.putInfo("type", suffix); storageState.putInfo("original", originFileName + suffix); } return storageState; // } catch (FileUploadException e) { // return new BaseState(false, AppInfo.PARSE_REQUEST_ERROR); } catch (IOException e) { } return new BaseState(false, AppInfo.IO_ERROR); } private static boolean validType(String type, String[] allowTypes) { List<String> list = Arrays.asList(allowTypes); return list.contains(type); } }
Part 4:配置图片上传路径
打开config.json文件配置上传路径[图片回显路径是映射图片上传路径的,一般在Part 2 第3步实现]
打开ConfigManager.java,在getConfig方法中修改
conf.put( "basePath", this.jsonConfig.getString("basePath") ); conf.put( "savePath", savePath ); conf.put( "rootPath", this.rootPath );
打开BinaryUploader.java,在save方法中修改
String basePath=(String) conf.get("basePath"); String physicalPath = basePath + savePath;
打开application.properties新增
web.upload-path=C:/ spring.mvc.static-path-pattern=/** spring.resources.static-locations=classpath:/META-INF/resources/,classpath:/resources/,classpath:/static/,classpath:/public/,file:${web.upload-path}