首页 - Ajax专区 - 实例应用

AJAX+JSF组件实现高性能的文件上载

发布时间: 2007-03-19 12:35    作者: 未知    来源: 未知    浏览:    评论

上一页 1 2 3 4 下一页
 

一、 引言

基于浏览器的文件上传,特别是对于通过<input type="file">标签包含到Web页面来实现上传的情况,还存在较严重的性能问题。我们知道,超过10MB的上传文件经常导致一种非常痛苦的用户体验。一旦用户提交了文件,在浏览器把文件上传到服务器的过程中,界面看上去似乎处于静止状态。由于这一切发生在后台,所以许多没有耐心的用户开始认为服务器"挂"了,因而再次提交文件,这当然使得情况变得更糟糕。

为了尽可能使得文件上传感觉更友好些,一旦用户提交文件,许多站点将显示一个中间过程动画(例如一旋转图标)。尽管这一技术在上传提交到服务器时起一些作用,但它还是提供了太少的有关文件上传状态的信息。解决这个问题的另外一种尝试是实现一个applet——它通过FTP把文件上传到服务器。这一方案的缺点是:限制了你的用户,必须要有一个支持Java的浏览器。

在本文中,我们将实现一个具有AJAX能力的组件——它不仅实现把文件上传到服务器,而且"实时地"监视文件上传的实际过程。这个组件工作的四个阶段显示于下面的图1,2,3和4中:

图1.阶段1:选择文件上传

图2.阶段2:上传该文件到服务器

图3.阶段3:上传完成

图4.阶段4:文件上传摘要

二、 实现该组件

首先,我们分析创建多部分过滤的过程,它将允许我们处理并且监视文件上传。然后,我们将继续实现JavaServer Faces(JSF)组件-它将提供给用户连续的回馈,以支持AJAX的进度条方式。

(一) 多部分过滤:UploadMultipartFilter

多部分过滤的任务是拦截到来的文件上传并且把该文件写到一个服务器上的临时目录中。同时,它还将监视接收的字节数并且确定已经上载该文件的程度。幸运的是,现在有一个优秀的Jakarta-Commons开源库可以利用(FileUpload),可以由它来负责分析一个HTTP多部分请求并且把文件上传到服务器。我们要做的是扩展该库并且加入我们需要的"钩子"来监视已经处理了多少字节。

public class UploadMultipartFilter implements Filter{

 public void doFilter(ServletRequest request,

ServletResponse response,FilterChain chain)

 throws IOException, ServletException {

HttpServletRequest hRequest = (HttpServletRequest)request;

//检查是否我们在处理一个多部分请求

String contentHeader = hRequest.getHeader("content-type");

boolean isMultipart = ( contentHeader !

= null && contentHeader.indexOf("multipart/form-data") != -1);

if(isMultipart == false){

 chain.doFilter(request,response);

}else{

 UploadMultipartRequestWrapper wrapper

= new UploadMultipartRequestWrapper(hRequest);

 chain.doFilter(wrapper,response);

}

...

 }

正如你所见,UploadMultipartFilter类简单地检查了当前的请求是否是一个多部分请求。如果该请求不包含文件上传,该请求将被传递到请求链中的下一个过滤,而不进行任何另外的处理。否则,该请求将被包装在一个UploadMultipartRequestWrapper中。

(二) UploadMultipartRequestWrapper类

public class UploadMultipartRequestWrapper

extends HttpServletRequestWrapper{

 private Map<String,String> formParameters;

 private Map<String,FileItem> fileParameters;

 public UploadMultipartRequestWrapper(HttpServletRequest request) {

super(request);

try{

 ServletFileUpload upload = new ServletFileUpload();

 upload.setFileItemFactory(

new ProgressMonitorFileItemFactory(request));

 List fileItems = upload.parseRequest(request);

 formParameters = new HashMap<String,String>();

 fileParameters = new HashMap<String,FileItem>();

 for(int i=0;i<fileItems.size();i++){

FileItem item = (FileItem)fileItems.get(i);

if(item.isFormField() == true){

 formParameters.put(item.getFieldName(),item.getString());

}else{

 fileParameters.put(item.getFieldName(),item);

 request.setAttribute(item.getFieldName(),item);

}

 }

 }catch(FileUploadException fe){

//请求时间超过-用户可能已经转到另一个页面。

//作一些记录

//...

 }

 ...

上一页 1 2 3 4 下一页

TAG

Smile Big Smile Surprise Stick out tongue Wink Sad Tongue Tied Indifferent Crying Embarrassed Cool Angry Angel Devil [8-|] [:#] [:-*] [:^)] [<:o)] [|-)] Yes Beer Left Hug Music Star Time Snail Pizza Automobile Umbrella Computer Storm [mo] [8o|] [^o)] [+o(] [*-)] [8-)] Coffee No Drinks [Z] Right Hug Cake Broken Heart Gift Wilted Flower Movie Dog Idea Sleep Email Travel Paradise
呢称:

加粗 斜体 下划线 链接 图片 代码 邮件地址 引用 列表

最多只能输入100个字符