技術前沿 Flex2.0 從零開始實現文件上傳
Flex2.0有很多值得學習的地方，本文和大家重點討論一下如何實現Flex2.0 從零開始實現文件上傳，相信本文介紹一定會讓你有所收獲。
Flex2.0 從零開始實現文件上傳
以前在Flex1.5的時候也做過，不過當初使用的是oreilly的cos.jar。而且Flex1.5的時候在as里面無法直接引用FileReference類，只能寫一個上傳的as文件編譯成swf文件，然后load這個swf文件來實現上傳。
Flex2.0Release之后用oreilly的上傳包做了一下上傳，成功。于是回到apache的common-fileupload-1.1.1來研究上傳。終于有了成果。再加上一直以來游走于各個論壇，發現好多工友對Flex2.0實現文件上傳都很感興趣。于是決定花一點時間將自己的成果跟大家分享一下。
1．環境的安裝以及配置就不說了，網上很多地方可以找到。（我的是：JDK1.4.2，FlexBuilder2，Flex2SDK，Tomcat4.1，Eclips3.0.1，不過據說現在Flex2.0要使用RemoteObject的話需要安裝JDK1.5）。
2．首先在Eclips中創建一個tomcat工程，例如取名為FileUpload。
3．找到FlexSDK安裝目錄，將flex.war拷貝出來更名為flex.rar。解開這個包。將里面的META-INF以及WEB-INF文件夾拷貝到Eclips的工作目錄（我的是：d:workspaces）----即剛才創建的FileUpload目錄下。
4．FlexBuilder2下創建一個新的工程。
5．工程中引入common-fileupload-1.1.1.jar以及common-io-1.2.jar（沒有的話去http://www.apache.org下載）。#p#
6．編寫上傳servletmyUpload.java代碼如下(上傳文件存放路徑為：d:upload)：
- packagecom.fileupload;
- importjava.io.File;
- importjava.io.IOException;
- importjava.util.Iterator;
- importjava.util.List;importjavax.servlet.
- ServletException;
- importjavax.servlet.http.HttpServlet;
- importjavax.servlet.http.HttpServletRequest;
- importjavax.servlet.http.HttpServletResponse;
- importorg.apache.commons.fileupload.FileItem;
- importorg.apache.commons.fileupload.FileUploadException;
- importorg.apache.commons.fileupload.disk.
- DiskFileItemFactory;
- importorg.apache.commons.fileupload.servlet.
- ServletFileUpload;
- publicclassmyUploadextendsHttpServlet{
- privateStringuploadPath="D:\\upload\\";
- privateintmaxPostSize=100*1024*1024;
- publicvoiddoPost(HttpServletRequestreq,HttpServletResponseres)
- throwsServletException,IOException{
- res.setContentType("text/html;charset=UTF-8");
- DiskFileItemFactoryfactory=newDiskFileItemFactory();
- factory.setSizeThreshold(4096);
- ServletFileUploadupload=newServletFileUpload(factory);
- upload.setSizeMax(maxPostSize);
- try{
- ListfileItems=upload.parseRequest(req);
- Iteratoriter=fileItems.iterator();
- while(iter.hasNext()){
- FileItemitem=(FileItem)iter.next();
- if(!item.isFormField()){
- Stringname=item.getName();
- try{
- item.write(newFile(uploadPath+name));
- }catch(Exceptione){
- e.printStackTrace();
- }
- }
- }
- }catch(FileUploadExceptione){
- e.printStackTrace();
- }
- }
- }
存放在../src/com/fileupload
7．在web.xml中加入如下代碼。（用于調用servlet）
- <servlet>
- <servlet-name>myUpload</servlet-name>
- <display-name>FileUploadServlet</display-name>
- <description>FileServletExample</description>
- <servlet-class>com.fileupload.myUpload</servlet-class>
- </servlet>
- <servlet-mapping>
- <servlet-name>myUpload</servlet-name>
- <url-pattern>/myUpload</url-pattern>
- </servlet-mapping>
#p#8．前臺的FileUpload.mxml文件代碼如下：
- <?xmlversionxmlversion="1.0"encoding="utf-8"?>
- <mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"
- xmlns="*"creationComplete="init()">
- <mx:Script>
- <![CDATA[
- importflash.events.*;
- importflash.net.FileReference;
- importflash.net.URLRequest;
- privatevarcurrentAction:String;
- privatevaruploadURL:URLRequest;
- privatevarfile:FileReference;
- privatevarfileName:String;
- privatefunctioninit():void{
- file=newFileReference();
- }
- publicfunctionFileReference_browse():void{
- currentAction="upload";
- uploadURL=newURLRequest();
- file=newFileReference();
- configureListeners(file);
- file.browse();
- }
- privatefunctionconfigureListeners(dispatcher:IEventDispatcher):void{
- dispatcher.addEventListener(Event.SELECT,selectHandler);
- }
- privatefunctionselectHandler(event:Event):void{
- varfile:FileReference=FileReference(event.target);
- if(currentAction=="upload"){
- uploadURL.url="myUpload?path=work&filename="+file.name;
- file.upload(uploadURL);
- }
- }
- ]]>
- </mx:Script>
- <mx:Panelwidthmx:Panelwidth="100%"height="100%">
- <mx:VBoxwidthmx:VBoxwidth="100%"horizontalAlign="center">
- <mx:Labeltextmx:Labeltext=
- "Clickthebelowbuttontoselectafilewhichyouwanttoupload!"/>
- <mx:Buttonlabelmx:Buttonlabel="Upload"click="FileReference_browse()"/>
- </mx:VBox>
- </mx:Panel>
- </mx:Application>
9．開啟tomcat，運行。大功告成！
【編輯推薦】
