之前有朋友給我發送email，詢問我是否有單個文件上傳的源代碼，因為當時寫這個好像是在09年，所以放哪了一時也沒找著。后來整理硬盤的時候，找到了源碼，所以決定來個匯總（之前寫過的關于flash+js上傳文件的例子）：

1、定位flash上傳出現IO Error #2038的錯誤

2、as3+php上傳圖片的三種方式

3、as3與php 上傳單個圖片demo

4、as3與php 上傳多張圖片demo

5、51JS上的“[原創] flash單個文件上傳代碼+示例”

在這里面，我決定把所有的源碼：html、js、php、fla、as3以及使用說明一并打包，并直接提供下載。

?

先還是講一下flash按鈕的控制問題：

1)、需要三張圖片，新建一個影片剪輯，也就是按鈕的三種狀態：正常、hover、disabled，如下圖所示（三種狀態的圖片，分別位于第一幀、第二幀和第三幀，每一幀上寫上腳本stop())

2)、在庫中右擊選中剛剛的btn(影片剪輯)，然后右擊選擇“屬性”，勾選“為第一幀導出”以及“為ActionScript導出“，如圖所示：

3)、編寫類UploadButtonCom類，它繼承于基類MovieClip，目的是為了方便調用者直接調用一個方法便可很方便地控制按鈕的狀態，比如：mouseover、mouseout等

UploadButtonCom類的完整代碼如下：

1: package 2: { 3: import flash.display.MovieClip; 4: import flash.events.MouseEvent; 5: 6: public class UploadButtonCom extends MovieClip 7: { 8: public function UploadButtonCom() 9: { 10: super(); 11: init(); 12: } 13: 14: private function init():void 15: { 16: enabledButton(); 17: this.addEventListener(MouseEvent.MOUSE_OVER , overHandle); 18: this.addEventListener(MouseEvent.MOUSE_OUT , outHandle) 19: } 20: 21: private function overHandle(e:MouseEvent):void 22: { 23: this.gotoAndStop(2) 24: } 25: 26: private function outHandle(e:MouseEvent):void 27: { 28: this.gotoAndStop(1) 29: } 30: 31: public function disenable():void 32: { 33: this.gotoAndStop(3); 34: this.buttonMode = false 35: this.mouseChildren = false; 36: this.mouseEnabled = false 37: } 38: 39: public function enabledButton():void 40: { 41: this.gotoAndStop(1); 42: this.buttonMode = true 43: this.mouseChildren = true; 44: this.mouseEnabled = true 45: } 46: } 47: }

提供給外部僅二個方法來控制按鈕是否可以被點擊。

4)、從庫中將“按鈕”這個MovieClip拖至舞臺中，指定一個名稱“btn_mc“，編寫一個文檔類“UploadFile.as”

1: package 2: { 3: import flash.display.MovieClip; 4: import flash.events.DataEvent; 5: import flash.events.Event; 6: import flash.events.IOErrorEvent; 7: import flash.events.MouseEvent; 8: import flash.events.ProgressEvent; 9: import flash.external.ExternalInterface; 10: import flash.net.FileFilter; 11: import flash.net.FileReference; 12: import flash.net.URLRequest; 13: import flash.text.TextField; 14: 15: public class UploadFile extends MovieClip 16: { 17: public function UploadFile() 18: { 19: super(); 20: init(); 21: } 22: 23: private var tipTxt:TextField; 24: private var uploadButton:UploadButtonCom; 25: 26: private var file:FileReference; 27: private var fileType:String = '*.*'; 28: private var fileTypeStr:String = 'All Files' 29: private var fileMaxSize:Number = 10*1024; 30: private var uploadURL:String = ''; 31: private static var CALL_FUNCTION_NAME = "SWFSingleUpload.instance."; 32: 33: private function init():void 34: { 35: tipTxt = this.txt_mc; 36: tipTxt.mouseEnabled = false; 37: tipTxt.mouseWheelEnabled = false; 38: tipTxt.selectable = false; 39: 40: uploadButton = this.btn_mc; 41: uploadButton.addEventListener(MouseEvent.CLICK , browseFile); 42: 43: addJScall(); 44: this.addEventListener(Event.ADDED_TO_STAGE , createComplete); 45: 46: file = new FileReference(); 47: file.addEventListener(Event.SELECT, selectHandler); 48: file.addEventListener(IOErrorEvent.IO_ERROR, ioErrorHandler); 49: file.addEventListener(ProgressEvent.PROGRESS, progressHandler); 50: file.addEventListener(Event.COMPLETE, completeHandler); 51: file.addEventListener(DataEvent.UPLOAD_COMPLETE_DATA,dataHandler); 52: } 53: 54: private function createComplete(e:Event):void 55: { 56: ExternalInterface.call(CALL_FUNCTION_NAME + "initComplete"); 57: } 58: 59: private function addJScall():void 60: { 61: ExternalInterface.addCallback("setValue",setValue); 62: } 63: 64: private function setValue(t:String,_fileType:String,_fileTypeStr:String,fileMax:Number,url:String):void 65: { 66: tipTxt.htmlText = t; 67: fileMaxSize = fileMax; 68: fileType = _fileType; 69: fileTypeStr = _fileTypeStr; 70: uploadURL = url; 71: } 72: 73: private function startUploadFile():void 74: { 75: if(file.size/1024 > fileMaxSize) 76: { 77: ExternalInterface.call(CALL_FUNCTION_NAME + "limitError","文件超出最大限制"); 78: return ; 79: } 80: ExternalInterface.call(CALL_FUNCTION_NAME + "startUpload"); 81: uploadButton.disenable(); 82: var uploadReq:URLRequest = new URLRequest(uploadURL) 83: file.upload(uploadReq); 84: } 85: 86: private function selectHandler(e:Event):void 87: { 88: startUploadFile(); 89: } 90: 91: private function browseFile(e:Event):void 92: { 93: var fileFilter:FileFilter = new FileFilter(fileTypeStr, fileType); 94: file.browse([fileFilter]); 95: } 96: 97: private function ioErrorHandler(e:IOErrorEvent):void 98: { 99: ExternalInterface.call(CALL_FUNCTION_NAME + "ioError",e.text); 100: uploadButton.enabledButton(); 101: } 102: 103: private function progressHandler(event:ProgressEvent):void 104: { 105: ExternalInterface.call(CALL_FUNCTION_NAME + "progress",event.bytesLoaded,event.bytesTotal); 106: } 107: 108: private function completeHandler(e:Event):void 109: { 110: ExternalInterface.call(CALL_FUNCTION_NAME + "uploadComplete"); 111: uploadButton.enabledButton(); 112: } 113: 114: private function dataHandler(data:DataEvent):void 115: { 116: ExternalInterface.call(CALL_FUNCTION_NAME + "uploadSuccess",data.data); 117: } 118: } 119: }

?

之后，我在此基本上封裝了一層，寫了一個名為“swf_single_upload.js”的JS文件，主要目的是為了方便調用者使用它。

主要包含如下內容：

函數定義：(僅提供給網頁調用的接口，與flash無關)
new SWFSingleUpload({
??? flash_url : "",//上傳文件的URL地址
??? upload_url : "",//文件上傳的目標地址
??? post_params : "",//傳遞的參數
??? file_size_limit : "",//文件上限，默認為；10*1024(以字節為單位)
??? file_types : "",//文件類型，以;進行分隔，例如：*.jpg;*.png
??? file_types_description : "",//文件上傳的描述文字，例如：圖片
??? debug : true,//是否顯示調試信息
??? upload_panel_id : "",//上傳按鈕放置的文件
??? upload_btn_text : "",//上傳按鈕的文字
??? upload_loaded_handler : "",//上傳組件初始化完成
??? upload_start_handler : "",//開始上傳的處理方法
??? upload_progress_handler : "",//正在上傳時的方法
??? upload_complete_handler : "",//上傳完成的方法
??? upload_success_handler : "",//上傳成功的方法
??? upload_error_handler : ""//上傳發生錯誤調用的方法
);
總共有15個參數
??? 獲取組件的版本號：SWFSingleUpload.version
??? 獲取組件實例對象：SWFSingleUpload.instance指向實例本身
??? 組件當前swf對象：this.swfObject
??? 其它全部采用回調的機制進行操作，其中錯誤信息有：???
??????? １、超過指定的大小
??????? ２、其它的IO錯誤，例如404或是其它

Flash與JS調用的方法說明：
Flash調用JS以SWFSingleUpload.instance.方法名開頭
默認限制上傳文件類型為：*.* 說明為All Files 最大上傳的文件大小為10*1024字節

Flash提供setValue方法給JS調用，以便傳入上述參數。
this.addEventListener(Event.ADDED_TO_STAGE,createComplete);//flash初始化完成

flash調用JS的四個方法：
//文件超出最大上限
ExternalInterface.call(CALL_FUNCTION_NAME + "limitError","文件超出最大限制");
//上傳進度
ExternalInterface.call(CALL_FUNCTION_NAME,"progress",event.bytesLoaded,event.bytesTotal);
//上傳完成
ExternalInterface.call(CALL_FUNCTION_NAME + "uploadComplete");
//上傳成功
ExternalInterface.call(CALL_FUNCTION_NAME,"uploadSuccess",data.data);
//上傳出現IO錯誤
ExternalInterface.call(CALL_FUNCTION_NAME + "ioError",e.text);

?

頁面正常運行，選擇文件（以圖片為例），示意圖如下：

?

本想在新浪的SAE上部署測試一下，可是上傳那一塊失敗了，也就沒再繼續折騰下去了。還是放一個地址，在線查看示例>>

?

本示例中所有完整的源代碼下載>>

?

未經本人授權，本文謝絕轉載。

總結

以上是生活随笔為你收集整理的【汇总】flash单个文件上传的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。