使用apche的fileupload实现ckeditor的上传功能
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>