`
小杨学JAVA
  • 浏览: 904144 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

jquery+swfupload+servlet 多文件上传

 
阅读更多

swfupload对做过上传文件的朋友来说,应该都了解一点,现在像126、qq邮箱等都是采用swfupload,带进度条,多文件同时上传。。。。。。优点太多了。前一段时间也做了一个月的jquery,做的就是上传,今天花了2个多小时整理了一下,做了个demo,下面把代码贴出来。打包文件就提供下载了 ,有需要的可以留下邮箱。
先上个效果吧:前台页面
QQ截图未命名.jpg 
文件夹:
QQ截图未命名.jpg 
大家可能也注意到了 名字都改了,这是自己设定的一套命名机制,以防文件文件名相同。
项目结构:
QQ截图未命名.jpg 
FileUploadServlet:用来处理上传文件的类
DeleteFileServlet:删除文件的
主角是swfupload,里面共有三个文件,一个上传用的swf,一个主js,还有一个handlers.js里面写了很多早做的方法,文件传到upload/mail下面,比如今天是4月30号,那么你上传的文件就会在:upload/mail/2011/04/30/文件名
index.jsp,用来显示的页面
index.jsp:

  1. <script type="text/javascript" src="swfupload/swfupload.js"></script>
  2. <script type="text/javascript" src="swfupload/handlers.js"></script>
  3. <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
复制代码
关键部分来了,上传:
  1. <script type="text/javascript">
  2. var swfu;
  3. window.onload = function () {
  4. swfu = new SWFUpload({
  5. upload_url: "FileUploadServlet",//上传的servlet

  6. // File Upload Settings
  7. file_size_limit : "50 MB", // 1000MB
  8. file_types : "*.*",//设置可上传的类型
  9. file_types_description : "所有文件",
  10. file_upload_limit : "10",

  11. file_queue_error_handler : fileQueueError,//选择文件后出错
  12. file_dialog_complete_handler : fileDialogComplete,//选择好文件后提交
  13. file_queued_handler : fileQueued,
  14. upload_progress_handler : uploadProgress,
  15. upload_error_handler : uploadError,
  16. upload_success_handler : uploadSuccess,
  17. upload_complete_handler : uploadComplete,

  18. // Button Settings
  19. button_image_url : "images/SmallSpyGlassWithTransperancy_17x18.png",
  20. button_placeholder_id : "spanButtonPlaceholder",
  21. button_width: 100,
  22. button_height: 18,
  23. button_text : '<span class="button">添加附件</span>',
  24. button_text_style : '.button { font-family: Helvetica, Arial, sans-serif; font-size: 12pt; } .buttonSmall { font-size: 10pt; }',
  25. button_text_top_padding: 0,
  26. button_text_left_padding: 18,
  27. button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
  28. button_cursor: SWFUpload.CURSOR.HAND,

  29. // Flash Settings
  30. flash_url : "swfupload/swfupload.swf",

  31. custom_settings : {
  32. upload_target : "divFileProgressContainer"
  33. },
  34. // Debug Settings
  35. debug: false //是否显示调试窗口
  36. });
  37. };
  38. function startUploadFile(){
  39. swfu.startUpload();
  40. }

  41. </script>
复制代码
显示上传按钮:
  1. <!-- 上边定义的ID -->
  2. <span id="spanButtonPlaceholder"></span>
  3. <div id="divFileProgressContainer" style="width:200;display:none;"></div>
  4. <div id="thumbnails">
  5. <table id="infoTable" border="0" width="50%" style="border: solid 1px #7FAAFF; background-color: #C5D9FF; padding: 2px;margin-top:8px;">
  6. </table>
  7. </div>
复制代码
这是FileUploadServlet里面上传的代码:
  1. HttpSession session = request.getSession();
  2. //文件保存位置,当前项目下的upload/mail
  3. String uploadDir = "upload" + File.separatorChar + "mail" + File.separatorChar;
  4. //每天上传的文件根据日期存放在不同的文件夹
  5. String autoCreatedDateDirByParttern = "yyyy" + File.separatorChar + "MM" + File.separatorChar + "dd"
  6. + File.separatorChar;
  7. //按照设定的日期方式格式化日期
  8. String autoCreatedDateDir = DateFormatUtils.format(new java.util.Date(), autoCreatedDateDirByParttern);
  9. String ctxDir = session.getServletContext().getRealPath(String.valueOf(File.separatorChar));
  10. if (!ctxDir.endsWith(String.valueOf(File.separatorChar))) {
  11. ctxDir = ctxDir + File.separatorChar;
  12. }
  13. //创建文件夹
  14. File savePath = new File(ctxDir + uploadDir + autoCreatedDateDir);
  15. if (!savePath.exists()) {
  16. savePath.mkdirs();
  17. }
  18. System.out.println(savePath.getName()+"======");
  19. String saveDirectory = ctxDir + uploadDir + autoCreatedDateDir;

  20. if (StringUtils.isBlank(this.fileSizeLimit.toString())) {
  21. this.fileSizeLimit = "80";// 默认100M
  22. }
  23. int maxPostSize = Integer.parseInt(this.fileSizeLimit) * 1024 * 1024;
  24. String encoding = "UTF-8";
  25. //下面这个就是重命名的类
  26. FileRenamePolicy rename = new MyFileRenamePolicy();
  27. MultipartRequest multi = null;
  28. try {
  29. multi = new MultipartRequest(request, saveDirectory, maxPostSize, encoding, rename);
  30. System.out.println(oldFile.getName()+"==================");
  31. } catch (IOException e) {
  32. e.printStackTrace();
  33. return;
  34. }
复制代码
重命名类:
  1. class MyFileRenamePolicy implements FileRenamePolicy {
  2. public File rename(File file) {
  3. oldFile = file;
  4. String fileSaveName = StringUtils.join(new String[] { java.util.UUID.randomUUID().toString(), ".",
  5. FilenameUtils.getExtension(file.getName()) });
  6. File result = new File(file.getParentFile(), fileSaveName);
  7. return result;
  8. }
  9. }
复制代码

OK,至此上传全部完成了

转载自:http://www.ityangba.com/thread-49-1-1.html

分享到:
评论

相关推荐

    jquery+swfupload+servlet_多文件上传

    **jQuery + SWFUpload + Servlet 多文件上传技术详解** 在Web开发中,用户往往需要上传多个文件,例如图片、文档等。传统的HTML表单上传方式存在诸多限制,如文件大小限制、一次只能上传一个文件等。为了克服这些...

    jquery+swfupload+servlet_多文件上传,支持ctrl和shift多选择的功能

    本文将深入探讨如何使用jQuery、SWFUpload和Servlet技术实现一个支持多文件上传,同时具备Ctrl和Shift键多选功能的高效解决方案。 首先,jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画效果...

    js多文件上传

    jquery+swfupload+servlet 多文件上传

    jquery_swfupload

    总的来说,`jQuery SwfUpload` 提供了一个高效且灵活的多文件上传解决方案,结合 jQuery 和 Servlet,能够帮助开发者在Web应用中实现强大的文件上传功能。通过合理的配置和事件处理,可以满足不同场景下的上传需求。

    SWFUpload文件上传(java版)

    总结,SWFUpload结合jQuery提供了一种优雅的多文件上传解决方案,而Java后台则负责实际的文件处理逻辑。这种前后端的协作模式可以为Web应用带来高效、友好的文件上传体验。在实际应用中,还需要注意安全问题,如防止...

    多文件上传工具swfupload完整示例

    SwfUpload是一款强大的多文件上传工具,它使用Flash技术实现,可以为Web应用程序提供便捷的文件批量上传功能。在Java环境中,SwfUpload能够与服务器端的Java代码紧密结合,为用户带来流畅的上传体验。本示例将详细...

    swfupload 的文件上传程序 java 上传方式 !

    它通过Flash技术提供了一种优雅的方式,允许用户批量上传大文件,同时还能实现多文件选择和进度条显示等功能。在Java环境下,SwfUpload 可以与服务器端进行交互,实现文件的上传处理。本文将深入探讨SwfUpload的使用...

    多文件上传

    这里我们讨论的是一种基于JQuery、SWFUpload和Java的多文件上传解决方案。 SWFUpload是一个JavaScript库,它允许在浏览器中创建一个Flash组件来实现文件上传功能。这种技术的优点在于,它能够提供进度条显示、断点...

    jsp多文件上传实例

    【描述】:`swfupload`是一款强大的文件上传组件,它允许用户通过Flash技术在浏览器端进行多文件选择和上传。此技术解决了传统HTML表单单文件上传的限制,同时提供了良好的用户体验,如进度条显示、断点续传等功能。...

    基于java的多文件上传

    在Java编程环境中,实现多文件上传是一项常见的任务,特别是在构建Web应用时,如文件管理系统、云存储服务等。本项目“基于Java的多文件上传”实现了这一功能,让用户能够通过键盘的Shift和Ctrl键选择多个文件进行...

    web开发中文件上传的各种方法

    SWFupload是一个基于Flash的前端上传组件,支持多文件同时上传,提供了丰富的CSS和JavaScript接口。在Java后端,开发者需要创建一个处理SWFupload请求的Servlet,接收并处理上传的文件。SWFupload由于依赖Flash,...

    java动态上传excle文件并导出数据.pdf

    它使用了Flash技术来实现浏览器兼容性和多文件选择功能。在提供的代码中,`SWFUpload` 初始化配置包括了`flash_url`(Flash组件路径)、`upload_url`(服务器端上传接口地址)以及文件类型限制等参数。 - **jQuery*...

    java flash头像剪切上传

    由于Flash已经不再被广泛支持,现在的解决方案更多地依赖HTML5的`&lt;input type="file"&gt;`元素的改进,例如支持多文件选择、拖放上传和进度显示等功能。然而,为了兼容旧的浏览器,我们仍可以使用如SWFUpload这样的库,...

    项目涉及到的文件收集_未整理

    9. **Swfupload**:Swfupload是一个旧版的JavaScript和Flash混合的多文件上传解决方案,它允许在不支持HTML5的浏览器上实现文件上传功能。 10. **myeclipse不能自动提示解决**:MyEclipse是Eclipse的一个商业版本,...

    上传头像裁剪合集

    5. **Swfupload**:这是一款较老的Flash基于的文件上传插件,它支持多文件上传和进度条显示。虽然现在由于浏览器对Flash的支持逐渐减少,但考虑到这个合集的历史,它可能包含用于兼容旧浏览器的上传解决方案。 6. *...

    IT技术文章示例

    SWFUpload是一个基于Flash的文件上传组件,能够提供多文件选择、文件类型验证、进度条显示等功能。Servlet则是Java平台上的服务器端技术,用于扩展应用程序服务器的能力。这三者的结合通常用于构建具有文件上传功能...

    软件开发与项目管理-1期 KC02_课程案例_基于SSH框架的教学资源库网站的设计与实现.doc

    SWFUpload是一款基于Flash的文件上传控件,它可以支持多文件上传和进度显示,改善了传统HTML文件上传的用户体验。FlashPaper则能够将文档转换为Flash格式,便于在线预览,如PDF、Word等文档,确保用户在任何设备上都...

Global site tag (gtag.js) - Google Analytics