Flex中使用RemoteObject实现图片上传功能

最近看到一个通过BlazeDS中的RemoteOjbect通讯方式来进行上传图片功能，感觉不错，网上大部分都是用flex + java servlet 来实现的。如：http://www.riameeting.com/node/210

而这个感觉更简单，所以就贴了出来，希望能方便大家：

 

客户端:

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

               xmlns:s="library://ns.adobe.com/flex/spark"

               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"

               currentState="pre_upload">

    <fx:Script>

         <![CDATA[

           

             import flash.events.Event;

             import flash.net.FileFilter;

             import flash.net.FileReference;

             import mx.controls.Alert;

             import mx.events.CloseEvent;

             import mx.managers.PopUpManager;

             import mx.rpc.events.FaultEvent;

             import mx.rpc.events.ResultEvent;

             

             private var fileRef:FileReference = new FileReference();

             

             private function pickFile(evt:MouseEvent):void

             {

                 var imageTypes:FileFilter = new FileFilter("图片 (*.jpg, *.jpeg, *.gif,*.png)", "*.jpg; *.jpeg; *.gif; *.png");

                 var allTypes:Array = new Array(imageTypes);

                 fileRef.addEventListener(Event.SELECT, selectHandler);

                 fileRef.addEventListener(ProgressEvent.PROGRESS, progressHandler);

                 fileRef.addEventListener(Event.COMPLETE, completeHandler);

                 try{

                     fileRef.browse(allTypes);

                     }catch (error:Error){

                         trace("Unable to browse for files."+error.toString());

                    }

             }

             

             private function progressHandler(evt:ProgressEvent):void

             {

                 lb_progress.text = " 已上传 " + (evt.bytesLoaded/1024).toFixed(2)+ " K，共 " + (evt.bytesTotal/1024).toFixed(2) + " K";

                 var proc: uint = evt.bytesLoaded / evt.bytesTotal * 100;

                 progress.setProgress(proc, 100);

                 progress.label= "当前进度: " + " " + proc + "%";

             }

           

             private function selectHandler(evt:Event):void

             {

                 currentState = "uploading";

                 fileRef.load();

             }

             

             private function completeHandler(evt:Event):void{

                 currentState = "post_upload";

                 upload.uploadFile(fileRef.data,fileRef.name);

                 image_post_upload.source = fileRef.data;

             }

             

             private function returnUpLoadHandler():void

             {

                currentState = "pre_upload";

             }

           

             ]]>

         </fx:Script>

     <fx:Declarations>

            <s:RemoteObject id="upload" destination="uploadFile" endpoint="../messagebroker/amf"/>

            </fx:Declarations>

     <s:states>

            <s:State name = "pre_upload"/>

            <s:State name = "uploading"/>

            <s:State name = "post_upload"/>

            </s:states>

     <s:Button includeIn="pre_upload" label="从电脑上上传图片" width="119" click="pickFile(event)" horizontalCenter="0" y="64"/>

     <mx:ProgressBar id="progress" includeIn="uploading" x="43" y="43" width="153"/>

     <s:Label id="lb_progress" includeIn="uploading" x="45" y="10" width="149" height="25"/>

     <s:Label id="lb_post_upload" includeIn="post_upload" x="108" y="21" width="124" height="32" fontSize="16" text="upload success!" fontFamily="Arial" color="#3374DE"/>

     <s:Button includeIn="post_upload" x="159" y="60" label="返回" click="returnUpLoadHandler()"/>

     <mx:Image id="image_post_upload" includeIn="post_upload" x="10" y="10" width="67" height="67"/>

 

</s:Application>

 

服务器：

package com.service;

 

import java.io.File;

import java.io.FileOutputStream;

 

public class UploadFile {

    public void uploadFile(byte[] content, String fileName) throws Exception {

       File file = new File("d:" + fileName);

       FileOutputStream stream = new FileOutputStream(file);

       if (content != null)

           stream.write(content);

       stream.close();

    }

}

 

 

RemoteObject-config.xml配置文件：

<destination id="uploadFile">

        <properties>

            <source>com.service.UploadFile</source>

        </properties>

    </destination>