CKEditor文件上传-多种方式-自定义上传-保存在项目外

本文介绍2种使用ckeditor上传文件保存至项目外（即硬盘）的方法。

环境：tomcat + spring

第一种：CKEditor文件上传-多种方式-与ckfinder结合上传

第二种：使用自己写的上传方法。

 

 

下面我们来说说第二种方法的实现：

1.Action中的方法

/**
	 * 使用ckeditor编辑器 上传图片[保存至本地硬盘-项目外]
	 * 
	 * @param m
	 * @param request
	 * @param response
	 * @return
	 */
	@RequestMapping(value = "/doCkeditorUpload", method = RequestMethod.POST)
	public String doCkeditorUpload(Model m,
			MultipartHttpServletRequest request, HttpServletResponse response)
			throws IOException {
		String url = "";
		try {
			Iterator<String> iterator = request.getFileNames();
			while (iterator.hasNext()) {
				String next = iterator.next();
				List<MultipartFile> files = request.getFiles(next);
				for (MultipartFile file : files) {
						String name = file.getOriginalFilename();
						String type = FileUploadUtil.getType(name);
						String fileId = UUID.randomUUID().toString();
						String newName = fileId + "." + type;
						
						//写入文件
						StringBuffer filePath = new StringBuffer();
						filePath.append(FileUploadUtil.filePath);
						filePath.append(FileUploadUtil.getRelativePath(
								"ckeditor", type));
						FileUploadUtil.checkFile(filePath.toString());
						FileOutputStream fos = null;
						fos = new FileOutputStream(filePath + newName);
						fos.write(file.getBytes());
						fos.flush();
						fos.close();

						//保存至外部
						url=request.getContextPath() + "/system/attachment/fileUpload/getCkeditorFile.htm?type="+type+"&fileId="+fileId;
						
						//保存至内部
						//url = FileUploadUtil.getUrl("xheditor", type, newName);
						//url = request.getContextPath() + "/files" + url;
						response.setContentType("text/html; charset=UTF-8");
						response.setHeader("Cache-Control", "no-cache");
						PrintWriter out = response.getWriter();
						String callback = request
								.getParameter("CKEditorFuncNum");
						out.println("<script type=\"text/javascript\">");
						out.println("var parentWindow = ( window.parent == window ) ? window.opener : window.parent;");
						out.println("parentWindow.CKEDITOR.tools.callFunction("
								+ callback + ",'" + url + "',''" + ")");
						out.println("</script>");
						out.flush();
						out.close();
					}
			}
		} catch (Exception e) {
			url = "";
			e.printStackTrace();
		}
		return null;
	}

	/**
	 * 获取文件流
	 * @param request
	 * @param response
	 * @return
	 * @throws Exception
	 */
	@RequestMapping(value = "/getCkeditorFile")
	public String getCkeditorFile(HttpServletRequest request,
			HttpServletResponse response) throws Exception {
		String type = request.getParameter("type");
		String fileId = request.getParameter("fileId");
		
		response.reset();
		response.addHeader("Content-Disposition", "attachment;filename="
				+ URLEncoder.encode(fileId+"."+type, "UTF-8"));
		response.setContentType("application/octet-stream");
		if (isNotBlank(fileId) && isNotBlank(type)) {
			//写出文件
			StringBuffer filePath = new StringBuffer();
			filePath.append(FileUploadUtil.filePath);
			filePath.append(FileUploadUtil.getRelativePath(
					"ckeditor", type));
			String fileName = fileId+"."+type;
			
			File file = new File(filePath+fileName);
			FileInputStream is = new FileInputStream(file);
			int i = -1;
			try {
				while ((i = is.read()) != -1) {
					response.getWriter().write(i);
				}
			} catch(Exception e){
				e.printStackTrace();
			}finally {
				is.close();
			}
			response.getWriter().flush();
		}
		return null;
	}

 2.页面如何调用，把值传回至编辑域

 

    在ckeditor config.js中配置上传路径CKEDITOR.editorConfig

   

/*自定义上传*/
	config.filebrowserUploadUrl = getRootPath()+'/attachment/doCkeditorUpload.do?type=file';  
	config.filebrowserImageUploadUrl = getRootPath()+'/attachment/doCkeditorUpload.do?type=image';  
	config.filebrowserFlashUploadUrl = getRootPath()+'/attachment/doCkeditorUpload.do?type=flash';  

 

 

 

如此则大功告成，保存在项目外硬盘内，方便项目维护。

如果您想通过ckeditor结合ckfinder上传，请参看《 CKEditor文件上传-多种方式-与ckfinder结合上传》

如有不足，欢迎指正！