Swfupload--很酷的文件上传工具
程序员文章站
2022-07-09 15:52:37
...
Swfupload官方的描述是:Swfupload是一个包含有flash上传功能的javascript类库,它给我们带来多文件选择、上传进度条和客户文件大小检查等便利。
首先,要了解Swfupload,第一反应是上谷歌查查介绍。当然也可以搜出他的官方网站,就是http://www.swfupload.org了。
要下载它的Release包和Demo可以访问http://code.google.com/p/swfupload/,两个zip包很小,不到一分钟就check下来。
我下载的Swfupload v2.2.0.1。
1.解压缩samples包,进入demos/simpledemo文件夹,这里就是swfupload最简单的入门例子了。
2.我用的是JSP,所以可以在myeclipse中新建一个web工程,将demos/simpledemo文件夹中js和images2个文件夹和demos下的css文件夹拷贝到WebRoot下面,然后打开simpledemo中的index.php,将内容拷贝到工程的index.jsp中,并去掉<?php ?>的内容部分。
3.接下来就要稍微修改Index.jsp中的内容,添改如下:
- <link href="css/default.css" mce_href="css/default.css" rel="stylesheet" type="text/css" />
- <mce:script type="text/javascript" src="js/swfupload.js" mce_src="js/swfupload.js"></mce:script>
- <mce:script type="text/javascript" src="js/swfupload.queue.js" mce_src="js/swfupload.queue.js"></mce:script>
- <mce:script type="text/javascript" src="js/fileprogress.js" mce_src="js/fileprogress.js"></mce:script>
- <mce:script type="text/javascript" src="js/handlers.js" mce_src="js/handlers.js"></mce:script>
- upload_url: "http://localhost:8080/SwfuploadDemo/upload",
- post_params: {"SESSIONID" : "<%=session.getId()%>"},
4.然后要编写一个简单的servlet来处理文件上传,要用到commons-fileupload.jar,commons-io.jar
- public void doPost(HttpServletRequest request, HttpServletResponse response)
- throws ServletException, IOException {
- HttpSession session = request.getSession();
- session.setAttribute("SESSIONID",session.getId());
- FileItemFactory factory = new DiskFileItemFactory();
- ServletFileUpload upload = new ServletFileUpload(factory);
- try {
- List<FileItem> items = upload.parseRequest(request);
- Iterator<FileItem> itr = items.iterator();
- while(itr.hasNext()){
- FileItem item=(FileItem)itr.next();
- String fileName=item.getName();
- if(fileName!=null){
- File fullFile=new File(item.getName());
- File savedFile=new File("d:/uploads",fullFile.getName());
- item.write(savedFile);
- }
- }
- } catch (FileUploadException e) {
- e.printStackTrace();
- } catch (Exception e) {
- e.printStackTrace();
- }
- }
5.最后,部署到tomcat,运行,看看酷酷的上传效果吧!