文献:http://bbs.csdn.net/topics/390883077
代码例子:http://download.csdn.net/download/itmyhome/7851265
1.原先
2.修改
<script type="text/javascript"> window.onload = function(){ var zy = null;//摘要 zy = CKEDITOR.replace('zy',{ language : 'zh-cn', filebrowserImageUploadUrl : '图片上传的servlet', 注意此处由于浏览器内核不同,路径有些许不同。 image_previewText : ' 预览内容,此处设为空', }); } </script> <textarea value="" name="zy" rows="8" class="form-control"></textarea>
3.修改后的样子
4、实践
js
<script type="text/javascript"> window.onload = function(){ var xwnr = null;//摘要 xwnr = CKEDITOR.replace('xwnr',{ language : 'zh-cn', filebrowserImageUploadUrl : 'login/newsphoto.do', image_previewText : '', }); } </script>
servlet
1 public class NewsPhotoServlet extends HttpServlet { 2 3 4 public void doPost(HttpServletRequest request, HttpServletResponse response) 5 throws ServletException, IOException { 6 7 response.setContentType("text/html"); 8 response.setCharacterEncoding("UTF-8"); 9 request.setCharacterEncoding("UTF-8"); 10 PrintWriter pout = response.getWriter(); 11 // CKEditor提交的很重要的一个参数 12 String callback = request.getParameter("CKEditorFuncNum"); 13 //得到上传文件的保存目录,将上传的文件存放于目录下, 14 String savePath = this.getServletContext().getRealPath("/files"); 15 //上传时生成的临时文件保存目录 16 String tempPath = this.getServletContext().getRealPath("/files/temp"); 17 File tmpFile = new File(tempPath); 18 if(!tmpFile.exists()){ 19 //如果临时目录不存在,创建临时目录 20 tmpFile.mkdir(); 21 } 22 //图片名称 23 String photoname = ""; 24 try { 25 //使用Apache文件上传组件处理文件上传步骤: 26 //1、创建一个DiskFileItemFactory工厂 27 DiskFileItemFactory factory = new DiskFileItemFactory(); 28 //设置工厂的缓冲区的大小,当上传的文件大小超过缓冲区的大小时,就会生成一个临时文件存放到指定的临时目录当中。 29 //设置缓冲区的大小为100KB,如果不指定,那么缓冲区的大小默认是10KB 30 factory.setSizeThreshold(1024*100); 31 //设置上传时生成的临时文件的保存目录 32 factory.setRepository(tmpFile); 33 //2、创建一个文件上传解析器 34 ServletFileUpload upload = new ServletFileUpload(factory); 35 //监听文件上传进度 36 upload.setProgressListener(new ProgressListener(){ 37 38 public void update(long pBytesRead, long pContentLength, int arg2) { 39 System.out.println("文件大小为:" + pContentLength + ",当前已处理:" + pBytesRead); 40 } 41 }); 42 //解决上传文件名的中文乱码 43 upload.setHeaderEncoding("UTF-8"); 44 //3、判断提交上来的数据是否是上传表单的数据 45 if(!ServletFileUpload.isMultipartContent(request)){ 46 //按照传统方式获取数据 47 return; 48 } 49 //设置上传单个文件的大小的最大值,目前是设置为1024*1024字节,也就是1MB 50 upload.setFileSizeMax(1024*1024); 51 //设置上传文件总量的最大值,最大值=同时上传的多个文件的大小的最大值的和,目前设置为10MB 52 upload.setSizeMax(1024*1024*10); 53 //4、使用ServletFileUpload解析器解析上传数据, 54 //解析结果返回的是一个List<FileItem>集合,每一个FileItem对应一个Form表单的输入项 55 List<FileItem> list = upload.parseRequest(request); 56 for(FileItem item : list){ 57 //如果fileitem中封装的是普通输入项的数据 58 if(item.isFormField()){ 59 String name = item.getFieldName(); 60 //解决普通输入项的数据的中文乱码问题 61 String value = item.getString("UTF-8"); 62 System.out.println(name + "=" + value); 63 }else{ 64 //如果fileitem中封装的是上传文件 65 //得到上传的文件名称, 66 String filename = item.getName(); 67 System.out.println("filename:"+filename); 68 if(filename==null || filename.trim().equals("")){ 69 continue; 70 } 71 //注意:不同的浏览器提交的文件名是不一样的, 72 //有些浏览器提交上来的文件名是带有路径的,如: c:a1.txt, 73 //而有些只是单纯的文件名,如:1.txt 74 //处理获取到的上传文件的文件名的路径部分,只保留文件名部分 75 filename = filename.substring(filename.lastIndexOf("\")+1); 76 //得到上传文件的扩展名 77 String fileExtName = filename.substring(filename.lastIndexOf(".")+1); 78 //如果需要限制上传的文件类型,那么可以通过文件的扩展名来判断上传的文件类型是否合法 79 System.out.println("上传的文件的扩展名是:"+fileExtName); 80 //获取item中的上传文件的输入流 81 InputStream in = item.getInputStream(); 82 //得到文件保存的名称 83 String saveFilename = makeFileName(filename); 84 if(saveFilename != null){ 85 photoname = saveFilename; 86 } 87 //得到文件的保存目录 88 String realSavePath = makePath(saveFilename, savePath); 89 System.out.println("realSavePath:"+realSavePath); 90 //创建一个文件输出流 91 FileOutputStream out = new FileOutputStream(realSavePath + "\" + saveFilename); 92 //创建一个缓冲区 93 byte buffer[] = new byte[1024]; 94 //判断输入流中的数据是否已经读完的标识 95 int len = 0; 96 //循环将输入流读入到缓冲区当中,(len=in.read(buffer))>0就表示in里面还有数据 97 while((len=in.read(buffer))>0){ 98 //使用FileOutputStream输出流将缓冲区的数据写入到指定的目录(savePath + "\" + filename)当中 99 out.write(buffer, 0, len); 100 } 101 //关闭输入流 102 in.close(); 103 //关闭输出流 104 out.close(); 105 //删除处理文件上传时生成的临时文件 106 item.delete(); 107 } 108 } 109 } catch (FileUploadBase.FileSizeLimitExceededException e) { 110 e.printStackTrace(); 111 return; 112 }catch (FileUploadBase.SizeLimitExceededException e) { 113 e.printStackTrace(); 114 return; 115 }catch (Exception e) { 116 e.printStackTrace(); 117 } 118 // 返回"图像"选项卡并显示图片 request.getContextPath()为web项目名 119 pout.println("<script type="text/javascript">"); 120 pout.println("window.parent.CKEDITOR.tools.callFunction(" + callback 121 + ",'" + request.getContextPath() + "/files/photo/" + photoname + "','')"); 122 pout.println("</script>"); 123 System.out.println("ok1!"); 124 125 } 126 127 //构造存储文件名 128 private String makeFileName(String filename){ //2.jpg 129 //为防止文件覆盖的现象发生,要为上传文件产生一个唯一的文件名 130 return UUID.randomUUID().toString() + "_" + filename; 131 } 132 133 //构造存储路径 134 private String makePath(String filename,String savePath){ 135 136 String dir1 = "photo"; 137 //构造新的保存目录 138 String dir = savePath +"\"+dir1; //目录:uploadphoto 139 //File既可以代表文件也可以代表目录 140 File file = new File(dir); 141 //如果目录不存在 142 if(!file.exists()){ 143 //创建目录 144 file.mkdirs(); 145 } 146 return dir; 147 }
注意:如果这个页面加了x-frame-options:deny,则此插件上传图片会出错。