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;
}