首页 > 代码库 > SpringMVC:学习笔记(10)——整合Ckeditor且实现图片上传
SpringMVC:学习笔记(10)——整合Ckeditor且实现图片上传
搞清楚路径位置
配置CKEDITOR
精简文件
- 解压之后可以看到ckeditor/lang下面有很多语言的js,如果不需要那么多种语言的,可以只剩下en.js,zh.js,zh-cn.js
- 图片上传时图像信息中的预览会显示一堆英文信息,会干扰预览。找到ckeditor/plugins/image/dialogs/image.js,搜索“d.config.image_previewText”就能找到这段鸟语了,(d.config.image_previewText||”)引号中的内容全删除。
配置上传路径
默认的插入图片对话框不显示上传选项
第一步:image.js文件搜索“upload”可以找到这一段 id:‘Upload‘,hidden:true或id:"Upload",hidden:!0,将其改为false
第二步:打开config.js文件,加入下面一句话
config.filebrowserImageUploadUrl = "imageUpload.do"; //用于接收上传文件并处理的Servlet
处理上传的Controller
代码
@RequestMapping("/imageUpload.do") public String imageUpload(@RequestParam("upload") MultipartFile file, @RequestParam("CKEditorFuncNum") String CKEditorFuncNum, HttpServletResponse response, HttpServletRequest request) throws IOException { System.out.println("有文件想要上传"); PrintWriter out = response.getWriter(); String name = null; name = new String(file.getOriginalFilename().getBytes("iso-8859-1"), "UTF-8"); String uploadContentType = file.getContentType(); //处理文件后缀 String expandedName = ""; if (uploadContentType.equals("image/pjpeg") || uploadContentType.equals("image/jpeg")) { // IE6上传jpg图片的headimageContentType是image/pjpeg,而IE9以及火狐上传的jpg图片是image/jpeg expandedName = ".jpg"; } else if (uploadContentType.equals("image/png") || uploadContentType.equals("image/x-png")) { // IE6上传的png图片的headimageContentType是"image/x-png" expandedName = ".png"; } else if (uploadContentType.equals("image/gif")) { expandedName = ".gif"; } else if (uploadContentType.equals("image/bmp")) { expandedName = ".bmp"; } else { //文件格式不符合,返回错误信息 out.println("<script type=\"text/javascript\">"); out.println("window.parent.CKEDITOR.tools.callFunction(" + CKEditorFuncNum + ",‘‘," + "‘文件格式不正确(必须为.jpg/.gif/.bmp/.png文件)‘);"); out.println("</script>"); return null; } //文件命名并保存到服务器 DateFormat df = new SimpleDateFormat("yyyyMMddHHmmss"); name = df.format(new Date()) +expandedName; String DirectoryName =request.getContextPath()+"/tempImag"; System.out.println(DirectoryName); try { File file1 = new File(request.getServletContext().getRealPath("/tempImag"),name); System.out.println(file1.getPath()); file.transferTo(file1); } catch (Exception e) { e.printStackTrace(); } String fileURL =request.getContextPath() + "/tempImag/"+name; // 返回"图像"选项卡和图像在服务器的地址并显示图片 out.println("<script type=\"text/javascript\">"); out.println("window.parent.CKEDITOR.tools.callFunction(" + CKEditorFuncNum + ",‘" +fileURL+"‘,‘‘)"); out.println("</script>"); out.close(); return null; }
SpringMVC:学习笔记(10)——整合Ckeditor且实现图片上传
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。