2011-05-29 71 views
2

我想上傳圖像文件到我的服務器使用AS3和PHP,並且此刻我成功上傳多個文件並將其限制爲圖像只,但因爲我新的Flash和AS3,我發現很難弄清楚如何在上傳文件時顯示加載條顯示,以及在所有文件上傳到指定幀後執行一個函數。PHP/Actionscript 3多個文件上傳與進度指示器

這裏是我的代碼迄今,

AS3:

import flash.net.FileReferenceList; 
import flash.events.Event; 
import flash.net.URLRequest; 
import flash.net.FileReference; 

var fileRef:FileReferenceList = new FileReferenceList(); 
fileRef = new FileReferenceList(); 
fileRef.browse(new Array(new FileFilter("Images (*.jpg, *.jpeg, *.gif, *.png)", "*.jpg;*.jpeg;*.gif;*.png"))); 
fileRef.addEventListener(Event.SELECT, fileSelectHandler); 

var uploadURL:URLRequest = new URLRequest(); 
var uploadPhotoScript:String = "http://127.0.0.1/upload.php"; 
uploadURL.url = uploadPhotoScript; 

function fileSelectHandler(event:Event):void { 
    for each(var fileToUpload:FileReference in fileRef.fileList){ 
      uploadSingleFile(fileToUpload); 
     } 
} 

function uploadSingleFile(file:FileReference):void { 
    file.upload(uploadURL); 
    file.addEventListener(Event.COMPLETE, completeHandler); 
} 

function completeHandler(event:Event):void { 
    trace("upload complete"); 
} 

PHP:

if(!empty($_FILES)){ 
    $tmpfile = $_FILES['Filedata']['tmp_name']; 
    $targetfile = dirname(__FILE__) . '/' . $_FILES['Filedata']['name']; 
    move_uploaded_file($tmpfile, $targetfile); 
} 

我的問題是,

1:我怎麼能顯示百分比或一個表示文件進度的上傳欄es正在上傳?

2:如何在所有文件上傳成功後啓動回撥功能?

3:如何讓文件瀏覽器在點擊時出現,而不是在加載Flash文件時出現?

如果你們可以發佈一個鏈接或兩個好的教程/資源或一些建議,甚至是一個代碼片段或兩個,這將是一個很大的幫助,因爲我是很新的ActionScript 3的

在感謝名單提前!

回答

4

回答您的問題順序:

1:您可以使用ProgressEvent顯示文件上傳進度。由於文件將成爲事件的調度程序,因此您可以訪問已經在事件內部調度進度爲e.currentTarget的FileReference,並從此處可以訪問該文件引用的唯一屬性,以便準確更新可視上傳該特定文件的進度。例如:

function uploadSingleFile(file:FileReference):void { 
    file.addEventListener(ProgressEvent.PROGRESS, onUploadProgress); 
    file.upload(uploadURL); 
    file.addEventListener(Event.COMPLETE, completeHandler); 
} 

function onUploadProgress(e:ProgressEvent):void 
{ 
    var f:FileReference = e.currentTarget as FileReference; 
    var fileName:String = f.name; //Now I know which file it is, I can update accordingly 
    var progress:Number = (e.bytesLoaded/e.bytesTotal) * 100; //shows percent, you might want to round this off using Math.round(number); 
} 

2:爲了所有文件都加載之後推出的回調,你會通過存儲文件的最初選擇的號碼,然後添加一個回調明確每個項目,併爲他們完成這樣做,遞減總數,直到它爲0,此時你就會知道所有的文件已被上傳:

var totalFiles:int = 0; 

function fileSelectHandler(event:Event):void { 
    for each(var fileToUpload:FileReference in fileRef.fileList){ 
      ++totalFiles; 
      uploadSingleFile(fileToUpload);    
     } 
} 

function uploadSingleFile(file:FileReference):void { 
    file.addEventListener(ProgressEvent.PROGRESS, onUploadProgress); 
    file.addEventListener(Event.COMPLETE, onFileUploadComplete); 
    file.upload(uploadURL); 
    file.addEventListener(Event.COMPLETE, completeHandler); 
} 

function onFileUploadComplete(e:Event):void 
{ 
    --totalFiles; 
    if(totalFiles == 0){ 
     //All files have been uploaded 
    } 
} 

3:爲了讓瀏覽器出現的onClick,只需一個監聽器的MouseEvent.MOUSE_DOWN添加到對象或某種類型的按鈕,甚至舞臺,無論如何。像這樣:

var uploadButton:Button = new Button(); // Note this will require the Button component to be included in your library in flash CS 

uploadButton.label = "Upload Files"; 
uploadButton.width = 150; //Or whatever; 
uploadButton.x = (stage.stageWidth * .5) - (uploadButton.width * .5); 
uploadButton.y = (stage.stageHeight * .5) - (uploadButton.height * .5); 
stage.addChild(uploadButton); 

uploadButton.addEventListener(MouseEvent.MOUSE_DOWN, onUploadClicked); 

function onUploadClicked(e:MouseEvent):void 
{ 
    var fileRef:FileReferenceList = new FileReferenceList(); 
    fileRef = new FileReferenceList(); 
    fileRef.browse(new Array(new FileFilter("Images (*.jpg, *.jpeg, *.gif, *.png)", "*.jpg;*.jpeg;*.gif;*.png"))); 
    fileRef.addEventListener(Event.SELECT, fileSelectHandler); 
} 

最後關於教程等,我建議http://gotoandlearn.com學習閃光。我還建議僅查看AS3文檔,因爲所有這些nfo都可以從查找有問題的類FileReferenceList中收集。請注意,我在這裏完成了我的頭頂代碼,所以我沒有任何IDE檢查。然而,它應該工作得很好。希望這可以幫助。:)

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/net/FileReferenceList.html
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/net/FileReference.html#upload()

http://adobe.com/go/as3lr

+0

還要注意在此代碼示例我沒有做的事情像你這個對象後刪除事件偵聽器。理想情況下,在上傳完成回調的地方,您需要獲取對FileReference進行回調的引用,然後從中刪除onProgress和onComplete監聽器。事件偵聽器強烈地綁定到它們所連接的對象,這可以防止垃圾收集中的對象。 – 2011-05-29 20:53:40

+1

謝謝如此多的詳細回覆,我現在正在實施一切,將回饋我的進展! :) – Odyss3us 2011-05-30 07:25:44

+1

一切按預期工作,再次thanx!欣賞它! – Odyss3us 2011-06-06 09:50:02