Flex中的文件上传与下载[转贴]

http://www.blogjava.net/rainwindboys/archive/2008/09/18/229219.html 

   和传统的JSP一样，在flex中，有的时候也需要实现文件上传和下载的功能，但是在flex里文件的上传和下载的实现相对来说比较复杂，如何实现，请看下面。

    由于flex是一个比较新的技术，在研究的时候，还是按着JSP的方式去尝试，在开始之初，主要有以下几种思路：

    A、利用ftp的方式进行文件的上传和下载，需要利用flex的socket接口。

    B、利用webService的方式来进行文件的上传和下载

    C、利用flex+sevlet+fileupload组件实现文件的上传和下载

    在通过比较后，最后选择了第三种，用Flex+sevlet的方式来完成文件上传和下载的功能，理由如下（与上面的思路相对应）：

    A、涉及到了流的操作，实现起来比较复杂，出现错误的几率比较高

    B、关于flex端的可参考的资料比较少，并且还需要启动webservice服务

    C、这个技术比较成熟，从flex2.0开始，在flex端已经可以引用FileReference类了，并且在java端有成熟的组件可以使用，所以最后考虑使用该种方法来处理。

一、文件的上传
    1、Flex端
        A、使用到的类介绍：
            FileReference 类提供了在用户计算机和服务器之间上载和下载文件的方法。 操作系统对话框会提示用户选择要上载的文件或用于下载的位置。它主要能实现一个文件的上传。
            FileReferenceList 类提供了让用户选择一个或多个要上载的文件的方法。 FileReferenceList 对象将用户磁盘上的一组本地文件（一个或多个文件）表示为 FileReference 对象的数组。
        B、使用 FileReferenceList 类 实现多文件上传：
            1) 将该类实例化：var myFileRef = new FileReferenceList(); 
            2) 调用 FileReferenceList.browse() 方法，该方法将打开一个对话框，让用户选择一个或多个要上载的文件：myFileRef.browse(); 
            3) 在成功调用 browse() 方法之后，使用 FileReference 对象数组来填充 FileReferenceList 对象的 fileList 属性。 
                对 fileList 数组中的每个元素调用 FileReference.upload()

        代码如下：

     /**
     * 执行上传操作
     * */     
     private  function upLoadFiles(): void
     {
        try
        {
            selectFileList.browse(new Array(imageFilter, textFilter));
            selectFileList.addEventListener(Event.SELECT, selectHandler1);
        }
        catch (error:Error) 
        {
            Alert.show("文件选择出现错误，请选择正确的文件");
        }
    }
     /**
     * 如果文件被选中,则执行该方法
     * */
    function selectHandler1(event:Event): void
     {
        var request:URLRequest = new URLRequest("FileUploadServlet");
        var upLoadFile:FileReference; 
        var upLoadFileList:FileReferenceList = FileReferenceList(event.target);
        var selectedFileArray:Array = upLoadFileList.fileList;
        login =(testPress)(PopUpManager.createPopUp( this, testPress , true));
        for (var i:uint = 0; i < selectedFileArray.length; i++)
        { 
            upLoadFile = FileReference(selectedFileArray[i]);
            upLoadFile.addEventListener(Event.COMPLETE, UpLoadcompleteHandler);
            upLoadFile.addEventListener(ProgressEvent.PROGRESS, progressHandler); 
            try
            {
                upLoadFile.upload(request);
            }
            catch (error:Error)
            {
                Alert.show(error.message.toString());
            }
        }
    }
    function UpLoadcompleteHandler(event:Event): void
     {
         var upLoadFiles:FileReference = FileReference(event.target);
         var fileNames = upLoadFiles.name;
         //Alert.show('文件'+fileNames+'上传成功')
         login.myLabels.text = '文件'+fileNames+'上传成功';
    }
      private  function progressHandler(e:ProgressEvent): void
   { 
    var proc: uint = e.bytesLoaded / e.bytesTotal * 100;  
    login.bar.setProgress(proc, 100);  
    login.bar.label= "当前进度: " + " " + proc + "%";  
 }  

testPress.mxml

<? xml version="1.0" encoding="utf-8" ?>
< mx:TitleWindow  xmlns:mx ="http://www.adobe.com/2006/mxml"  layout ="absolute"  width ="528"  height ="236" >
< mx:Script >
     <![CDATA[
        import mx.managers.PopUpManager;
        public function clickMe():void {
            PopUpManager.removePopUp(this);
        }
     ]]>
</ mx:Script >
     < mx:ProgressBar  id ="bar"  labelPlacement ="bottom"  themeColor ="#F20D7A"   
minimum ="0"  visible ="true"  maximum ="100"  label ="当前进度: 0%"   
direction ="right"  mode ="manual"  width ="200"  x ="154"  y ="84" />   
     < mx:Button  x ="221"  y ="135"  label ="关闭"  click  = "clickMe();" />
     < mx:Label  x ="173"  y ="27"  id ="myLabels"  width ="157" />

</ mx:TitleWindow >

    2、JAVA端
     接受Flex端的请求，在JAVA端利用apache的fileupload类库实现上传功能。代码如下：

import  java.io.File;
import  java.io.FileInputStream;
import  java.io.IOException;
import  java.io.InputStream;
import  java.util.Iterator;
import  java.util.List;
import  java.util.Properties;

import  javax.servlet.ServletContext;
import  javax.servlet.ServletException;
import  javax.servlet.http.HttpServlet;
import  javax.servlet.http.HttpServletRequest;
import  javax.servlet.http.HttpServletResponse;

import  org.apache.commons.fileupload.FileItem;
import  org.apache.commons.fileupload.FileUploadException;
import  org.apache.commons.fileupload.disk.DiskFileItemFactory;
import  org.apache.commons.fileupload.servlet.ServletFileUpload;

public   class  FileUploadServlet  extends  HttpServlet
{

    // private String uploadPath = "D://upload//";
    private String path = "file_path.properties";
    private String skStr = "";
    private String uploadPath = "";
    private int maxPostSize = 1000 * 1024 * 1024;

    public void doPost(HttpServletRequest req, HttpServletResponse res) throws ServletException,
            IOException
    {
        String filePathaa = this.getServletConfig().getServletContext().getRealPath("/");

        Properties p = loadProperties(path);

        uploadPath = p.getProperty("filepath");

        res.setContentType("text/html;charset=UTF-8");
        req.setCharacterEncoding("UTF-8");

        DiskFileItemFactory factory = new DiskFileItemFactory();
        factory.setSizeThreshold(1024*20);

        ServletFileUpload upload = new ServletFileUpload(factory);
        upload.setSizeMax(maxPostSize);
        try
        {
            List fileItems = upload.parseRequest(req);
            Iterator iter = fileItems.iterator();
            while (iter.hasNext())
            {
                FileItem item = (FileItem) iter.next();
                if (!item.isFormField())
                {
                    String name = item.getName();

                    try
                    {
                        File skFile = new File(uploadPath + name);
                        if (skFile.exists())
                        {
                            skFile.delete();
                            item.write(new File(uploadPath + name));

                        }
                        else
                        {
                            item.write(new File(uploadPath + name));
                        }

                    } catch (Exception e)
                    {
                        e.printStackTrace();
                    }
                }
            }
        } catch (FileUploadException e)
        {
            e.printStackTrace();
        }

    }

    public Properties loadProperties(String path) throws IOException
    {

        InputStream in = this.getClass().getResourceAsStream(path);
        //

        Properties p = new Properties();

        p.load(in);
        in.close();
        return p;
    }

}

还要修正web.xml，添加如下内容

<!--  For file uploaded  -->
    < servlet >
         < servlet-name > FileUploadServlet </ servlet-name >
         < servlet-class > FileUploadServlet </ servlet-class >
     </ servlet >

     < servlet-mapping >
         < servlet-name > FileUploadServlet </ servlet-name >
         < url-pattern > /FileUploadServlet </ url-pattern >
     </ servlet-mapping >

二、文件的下载
    

    调用的方法：private function downLoadFiles(urlAdd:String):void
    参数urlAdd就是用户的ip地址，如果使用本地的localhost就会产生安全沙箱问题，因此让用户自己输入自己的ip地址。这样就避免了安全沙箱的问题。如果是本机启动服务，访问地址，需要输入IP，不能用localhost来代替本机的IP地址，否则，还是会出现安全沙箱问题。

     FileReference.download() 方法提示用户提供文件的保存位置并开始从远程 URL 进行下载。直接加载请求路径下载，不需要后台的支持。代码如下：

import  com.systex.flex.util.testPress;

import  flash.net.FileReferenceList;

import  mx.controls.Alert;
import  mx.managers.PopUpManager;
    var imageFilter:FileFilter  =   new  FileFilter( " Image Files (*.jpg, *.jpeg, *.gif, *.png) " ,  " *.jpg; *.jpeg; *.gif; *.png " );
    var textFilter:FileFilter  =   new  FileFilter( " Text Files (*.txt, *.rtf, *.zip) " ,  " *.txt; *.rtf; *.zip " );
    var selectFileList:FileReferenceList  =   new  FileReferenceList();
    var selectedFileArray:Array  =   new  Array();
    var login:testPress  =   new  testPress();
    var downloadURL:URLRequest;
    var DownLoadfile:FileReference;  // 这是要主要的地方
     // http:// XX.XX.XX.XX:8080/upload/main.zip
     private  function downLoadFiles(urlAdd:String): void
     {
        downloadURL = new URLRequest(urlAdd);
        DownLoadfile = new FileReference();
        configureListeners(DownLoadfile);
        DownLoadfile.download(downloadURL);
    }
      private  function configureListeners(dispatcher:IEventDispatcher): void   {
        dispatcher.addEventListener(Event.COMPLETE, completeHandler);

    }
    
     private  function completeHandler(event:Event): void   {
    mx.controls.Alert.show("文件下载成功");
    }

这里的是上面上传代码的上部分

附上测试的MXML

<? xml version="1.0" encoding="utf-8" ?>
< mx:Application  xmlns:mx ="http://www.adobe.com/2006/mxml"  layout ="absolute"
     >
< mx:Script  source ="UpDownLoadFiles.as" />

     < mx:Canvas  width ="100%"  height ="100%"  x ="10"  y ="170"  fontSize ="15" >
     < mx:VBox  width ="100%"  horizontalAlign ="center" >
     < mx:TextInput  id ="mytextInput" />
     < mx:Button  label ="文件下载"  click ="downLoadFiles('http://'+mytextInput.text+':8080/downLoading/2MSN.rar');" />
     < mx:Button  label ="上传文件"  click ="upLoadFiles();" />
     </ mx:VBox >
     </ mx:Canvas >
</ mx:Application >

fileupload下载地址就不提供了，请到网上搜寻一下