jQuery 异步上传插件 Uploadify 使用 (Java平台)

Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示。而且是Ajax的,省去了自己写Ajax上传功能的麻烦。不过官方提供的实例时php版本的,本文将详细介绍Uploadify在J2EE中的使用。


1.引入头文件(注意一定要把jQuery放在前面):

注意:uploader是上传的Action路径名;formData是传递给Action的参数列表。

[html]  view plain copy
  1. <script src="lib/jquery-1.8.3.min.js"></script>  
  2. <script src="lib/uploadify/jquery.uploadify.min.js" type="text/javascript"></script>  
  3. <script type="text/javascript">  
  4.         $(function() {  
  5.             $('#projectfile').uploadify({  
  6.                 'swf'      : 'lib/uploadify/uploadify.swf',  
  7.                 'uploader' : 'ProjectfileAdd.action',  
  8.                 'formData': {'projectid': '${project.id}'},  
  9.                 'fileObjName' : 'file',  
  10.                 'fileSizeLimit' : '0',  
  11.                 'onQueueComplete' : function(queueData) {  
  12.                     alert(queueData.uploadsSuccessful + ' files were successfully uploaded.');  
  13.                     }  
  14.                   
  15.             });  
  16.         });  
  17. </script>  

2.需要上传的地方添加一个<form>,里面有一个<input>(注意其id属性):

[html]  view plain copy
  1. <form>  
  2.     <input id="projectfile" name="file" type="file" ></input>  
  3. </form>  

3.看一下<input>效果如下,还挺美观的


4.后台的Action就是一个普通的上传文件的Action,示例如下:

[java]  view plain copy
  1. package dc.action.projectfile;  
  2.   
  3. import java.io.BufferedInputStream;  
  4. import java.io.BufferedOutputStream;  
  5. import java.io.File;  
  6. import java.io.FileInputStream;  
  7. import java.io.FileOutputStream;  
  8. import java.io.IOException;  
  9. import java.io.InputStream;  
  10. import java.io.OutputStream;  
  11. import java.sql.Timestamp;  
  12. import java.util.Date;  
  13. import java.util.Map;  
  14.   
  15. import org.apache.struts2.ServletActionContext;  
  16.   
  17. import com.opensymphony.xwork2.ActionContext;  
  18. import com.opensymphony.xwork2.ActionSupport;  
  19.   
  20. import dc.bean.Project;  
  21. import dc.bean.Projectfile;  
  22. import dc.bean.User;  
  23. import dc.service.ProjectService;  
  24. import dc.service.ProjectfileService;  
  25.   
  26. public class ProjectfileAdd extends ActionSupport {  
  27.     private static final int FILE_SIZE=16*1024;  
  28.     private int projectid;  
  29.     private ProjectService projectService;  
  30.     private ProjectfileService projectfileService;  
  31.     private File file;  
  32.     private String fileFileName;  
  33.     private String fileContentType;  
  34.       
  35.     public int getProjectid() {  
  36.         return projectid;  
  37.     }  
  38.   
  39.     public void setProjectid(int projectid) {  
  40.         this.projectid = projectid;  
  41.     }  
  42.   
  43.     public ProjectService getProjectService() {  
  44.         return projectService;  
  45.     }  
  46.   
  47.     public void setProjectService(ProjectService projectService) {  
  48.         this.projectService = projectService;  
  49.     }  
  50.   
  51.     public ProjectfileService getProjectfileService() {  
  52.         return projectfileService;  
  53.     }  
  54.   
  55.     public void setProjectfileService(ProjectfileService projectfileService) {  
  56.         this.projectfileService = projectfileService;  
  57.     }  
  58.   
  59.     public File getFile() {  
  60.         return file;  
  61.     }  
  62.   
  63.     public void setFile(File file) {  
  64.         this.file = file;  
  65.     }  
  66.   
  67.     public String getFileFileName() {  
  68.         return fileFileName;  
  69.     }  
  70.   
  71.     public void setFileFileName(String fileFileName) {  
  72.         this.fileFileName = fileFileName;  
  73.     }  
  74.   
  75.     public String getFileContentType() {  
  76.         return fileContentType;  
  77.     }  
  78.   
  79.     public void setFileContentType(String fileContentType) {  
  80.         this.fileContentType = fileContentType;  
  81.     }  
  82.   
  83.     public static int getFileSize() {  
  84.         return FILE_SIZE;  
  85.     }  
  86.   
  87.     //写入文件时候用到的函数  
  88.      public void upLoadFile(File source,File target){  
  89.           InputStream in=null;  
  90.           OutputStream out=null;  
  91.           try{  
  92.            in=new BufferedInputStream(new FileInputStream(source),FILE_SIZE);  
  93.            out=new BufferedOutputStream(new FileOutputStream(target),FILE_SIZE);  
  94.            //in-->image-->out  
  95.            byte[] image=new byte[FILE_SIZE];  
  96.            while(in.read(image)>0){  
  97.             out.write(image);  
  98.            }  
  99.           }catch(IOException ex){  
  100.            ex.printStackTrace();  
  101.           }finally{  
  102.            try{  
  103.             in.close();  
  104.             out.close();  
  105.            }catch(IOException ex){  
  106.             ex.printStackTrace();  
  107.            }  
  108.           }  
  109.          }  
  110.        
  111.         public String execute() {  
  112.             try {  
  113.                 Projectfile projectfile=new Projectfile();  
  114.                 projectfile.setName(fileFileName);  
  115.                 Project project=projectService.ReadByID(projectid);  
  116.                 projectfile.setProject(project);  
  117.                 projectfile.setModifytime( new Timestamp(new Date().getTime()));  
  118.                 String filepath="file/"+project.getId()+"/"+fileFileName;  
  119.                 projectfile.setFilepath(filepath);  
  120.                 projectfile.setFilesize(file.length());  
  121.                 //不是连接到外网的文件  
  122.                 projectfile.setFilelink(0);  
  123.                 projectfile.setContenttype(fileContentType);  
  124.                 //--记录编辑人------------------  
  125.                 ActionContext context = ActionContext.getContext();  
  126.                 Map sessionMap = context.getSession();  
  127.                 User currentuser=(User)sessionMap.get("user");  
  128.                 projectfile.setUser(currentuser);  
  129.                 //------------------------------  
  130.                 //projectfile.setFilesize(1);  
  131.                 projectfileService.save(projectfile);  
  132.                 //文件上传,存至硬盘  
  133.                 //ServletActionContext.getServletContext().getRealPath获得webRoot绝对路径  
  134.                 String realfilePath=ServletActionContext.getServletContext().getRealPath("file")  
  135.                   +"/"+project.getId()+"/"+this.fileFileName;  
  136.                 File targetFile=new File(realfilePath);  
  137.                 targetFile.getParentFile().mkdirs();  
  138.                 upLoadFile(file,targetFile);  
  139.             } catch (Exception ex) {  
  140.                 ex.printStackTrace();  
  141.                 return ERROR;  
  142.             }  
  143.             return SUCCESS;  
  144.         }  
  145. }  

Uploadify官方网站: http://www.uploadify.com/

Uploadify下载:http://download.csdn.net/detail/leixiaohua1020/6376463

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Java Uploadify 是一款基于 Java 技术的文件上传插件,可以很方便地实现文件上传功能。下面是使用教程: 1. 下载 Java Uploadify 你可以在官网上下载 Java Uploadify 的压缩包:http://www.uploadify.com/download/ 2. 解压缩文件 将下载的压缩包解压缩到你的项目文件夹中。 3. 引入 jar 包 将解压缩后的文件夹中的 uploadify.jar 文件复制到你的项目中,并在项目的 build path 中添加该 jar 包。 4. 创建上传页面 在你的项目中创建一个上传页面,可以使用 JSP 或者 Servlet 技术实现。在页面中引入以下代码: ``` <script src="jquery-1.11.3.min.js"></script> <script src="jquery.uploadify.min.js"></script> <link rel="stylesheet" type="text/css" href="uploadify.css"> <input type="file" name="uploadFile" id="uploadFile" /> <script> $(function() { $('#uploadFile').uploadify({ 'swf' : 'uploadify.swf', 'uploader' : 'UploadServlet', 'buttonText': '选择文件', 'multi': true, 'fileTypeExts': '*.jpg;*.gif;*.png', 'fileSizeLimit': '1MB', 'onUploadSuccess': function(file, data, response) { alert('上传成功!'); } }); }); </script> ``` 其中,'uploader' 表示上传文件的服务端地址,需要根据你的项目实际情况进行修改。'fileTypeExts' 表示允许上传的文件类型,多个类型之间用分号隔开。'fileSizeLimit' 表示上传文件的大小限制。 5. 创建服务端代码 创建一个名为 UploadServlet 的 Servlet 类,用于接收上传的文件并保存到服务器中。代码如下: ``` import java.io.File; import java.io.IOException; import java.util.UUID; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.commons.io.FileUtils; public class UploadServlet extends HttpServlet { private static final long serialVersionUID = 1L; @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String savePath = "D:/uploads"; // 上传文件保存的路径 File file = new File(savePath); if (!file.exists()) { file.mkdirs(); } String fileName = request.getParameter("filename"); // 获取上传文件的名称 String ext = fileName.substring(fileName.lastIndexOf(".")); // 获取上传文件的扩展名 String newFileName = UUID.randomUUID().toString() + ext; // 生成新的文件名 FileUtils.copyInputStreamToFile(request.getInputStream(), new File(savePath, newFileName)); // 复制上传文件到服务器 } } ``` 其中,'savePath' 表示上传文件保存的路径,需要根据你的项目实际情况进行修改。 6. 运行项目 将上传页面和服务端代码部署到你的服务器上,并启动服务器。然后访问上传页面,即可进行文件上传操作。 以上就是 Java Uploadify使用教程。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值