html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>ckeditor_upload.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> <script type="text/javascript" src="ckeditor/ckeditor.js"></script> <script type="text/javascript"> window.onload = function() { CKEDITOR.replace("content",{ width: 600, height: 400, filebrowserFileUploadUrl : 'servlet/upload?type=file', filebrowserImageUploadUrl : 'servlet/upload?type=image', filebrowserFlashUploadUrl : 'servlet/upload?type=flash' }); }; </script> </head> <body> <div id="content"></div> </body> </html>
servlet:
import java.io.File; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.io.OutputStream; import java.io.PrintWriter; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Date; import java.util.List; import javax.servlet.ServletConfig; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.commons.fileupload.FileItemFactory; import org.apache.commons.fileupload.FileItemIterator; import org.apache.commons.fileupload.FileItemStream; import org.apache.commons.fileupload.FileUploadException; import org.apache.commons.fileupload.disk.DiskFileItemFactory; import org.apache.commons.fileupload.servlet.ServletFileUpload; public class Upload extends HttpServlet { private List<String> allowedImages = new ArrayList<String>(); private String uploadPath; public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doPost(request, response); } /** * 利用firebug可以看到ckeditor给我们生成了这样一段代码 * <form lang="zh-cn" action="servlet/upload?type=image&CKEditor=content&CKEditorFuncNum=1&langCode=zh-cn" dir="ltr" method="POST" enctype="multipart/form-data"> * <input type="file" size="38" name="upload"> * </form> * 可以知道ckeditor上传图片是提交到了servlet/upload?type=image&CKEditor=content&CKEditorFuncNum=1&langCode=zh-cn * 这里面的CKEditorFuncNum是页面传过来的回调方法,在上传成功后应该回调这个方法,使生成的图片在预览窗口进行显示 */ public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String type = request.getParameter("type"); FileItemFactory itemFactory = new DiskFileItemFactory(); ServletFileUpload servletFileUpload = new ServletFileUpload(itemFactory); try { FileItemIterator itemIterator = servletFileUpload.getItemIterator(request); //因为ckeditor只是上传文件,所以这里就可以这样写了 if (itemIterator.hasNext()) { FileItemStream itemStream = itemIterator.next(); String name = itemStream.getName(); InputStream inputStream = itemStream.openStream(); String tagName = getTagName(name); if (allowedImages.contains(tagName) && "image".equals(type)) { String fileName = this.geneFileName(tagName); this.upload(inputStream, fileName); String callback = request.getParameter("CKEditorFuncNum"); response.setContentType("text/html;charset=utf-8"); PrintWriter out = response.getWriter(); out.write("<script type=\"text/javascript\">"); out.write("window.parent.CKEDITOR.tools.callFunction("+callback+",'ckeditor/upload/"+fileName+"',''"+")"); out.write("</script>"); } } } catch (FileUploadException e) { // TODO Auto-generated catch block e.printStackTrace(); } } @Override public void init(ServletConfig config) throws ServletException { // TODO Auto-generated method stub String allowedImage = config.getInitParameter("allowedImage"); String[] images = allowedImage.split(","); for (String image:images) allowedImages.add(image); uploadPath = config.getServletContext().getRealPath("/ckeditor/upload"); } private String getTagName(String fileName) { int index = fileName.lastIndexOf(".")+1; return fileName.substring(index); } private String geneFileName(String tagName) { SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMddHHmmss"); return sdf.format(new Date()) + "." + tagName; } private void upload(InputStream inputStream, String fileName) throws IOException { File file = new File(uploadPath, fileName); OutputStream os = new FileOutputStream(file); byte[] bytes = new byte[1024]; int len = 0; while ((len = inputStream.read(bytes)) != -1) { os.write(bytes, 0, len); } inputStream.close(); os.close(); } }
web.xml:
<?xml version="1.0" encoding="GB18030"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <servlet> <servlet-name>Upload</servlet-name> <servlet-class>com.tiantian.ext.servlet.Upload</servlet-class> <init-param> <param-name>allowedImage</param-name> <param-value>jpg,jpeg,gif,png</param-value> </init-param> </servlet> <servlet-mapping> <servlet-name>Upload</servlet-name> <url-pattern>/servlet/upload</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app>