PHP/Actionscript 3 帶進度指示器的多文件上傳

Question

我正在嘗試使用 AS3 和 PHP 將圖像文件上傳到我的服務器，目前我已成功上傳多個文件並將其限制為僅圖像，但由於我是 Flash 和 AS3 的新手，我發現很難弄清楚了解如何在上傳文件時顯示加載器欄，以及在所有文件上傳到 go 到指定幀后執行 function。

到目前為止，這是我的代碼，

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：如何顯示百分比或上傳條來指示正在上傳的文件的進度？

2：所有文件上傳成功后如何發起回調function？

3：如何讓文件瀏覽器在點擊時出現，而不是在加載 flash 文件時出現？

如果你們可以發布一個或兩個好的教程/資源或一些建議的鏈接，甚至可能是一個或兩個代碼片段，這將是一個很大的幫助，因為我對 Actionscript 3 非常陌生。

提前謝謝！

Answer 1

要按順序回答您的問題：

1：可以使用ProgressEvent來顯示文件上傳進度。 由於 File 將成為事件的調度程序，因此您可以訪問已將進度作為事件內部的 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 偵聽器添加到 object 或某種按鈕，甚至是舞台等。 像這樣：

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用於學習 flash。 我還建議只查看 AS3 文檔，因為所有這些 nfo 都可以通過查找有問題的 class 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