Flash 8 – Upload: Part IV

Schauen wir uns mal an, wie sich ein Batch-Upload umsetzen lässt. Im vorliegenden Beispiel können mehrere Dateien zum Upload ausgewählt werden. Diese werden in eine Upload-Liste eingefügt. Beim Mausklick auf den Upload Button wird die Liste nach und nach abgearbeitet und die Dateien hochgeladen.

In diesem Teil gehe ich nur auf die wichtigstens neuen Code-Abschnitte ein. Für den Batch-Upload wird ein Objekt der Klasse FileReferenceList benötigt. Die Eigenschaft fileList des Objekts ist vom Datentyp Array. Das Array beinhaltet mehrere FileReference Objekte. So lässt sich die Dateigröße des ersten FileReference Objekt der FileReferenceList bspw. so ansprechen.

[code]fileRefList.fileList[0].size[/code]
Mit einer for oder while Schleife lassen sich so alle Eigenschaften des jeweiligen FileReference Objekts auslesen. Das Objekt und ein Listener werden als lokale Eigenschaften der Klasse definiert.
[code]private var fileRefListListener:Object;
private var fileRefList:FileReferenceList;[/code]

Für die Darstellung der Upload-Liste wird eine DataGrid Komponente verwendet:
[code]private var myGrid:mx.controls.DataGrid;
public function MUploader(mc:MovieClip) {

myGrid = target_mc.myGrid;
myGrid.columnNames = [„Name“, „Größe“, „creationDate“,“modDate“];
// Size for Columns
myGrid.getColumnAt(0).width = 120;
myGrid.getColumnAt(1).width = 60;
myGrid.getColumnAt(2).width = 120;
myGrid.getColumnAt(3).width = 120;
// Activate horizontally scrolling
myGrid.hScrollPolicy = „on“;

}[/code]
Nach dem die Dateien zum Upload ausgewählt wurden, wird die DataGrid Komponente entsprechend gefüllt.
[code]private function updateFileInfo():Void {
var fileList:Array = fileRefList.fileList;
for(var i:Number = 0;i maxFileSize) {
result = false;
} else {
result = true;
}
}
if(result == false) {
status_txt.text = „Please reduce the filesize!“;
} else {
checkFileExtension();
}
}
[/code]
Man beachte die erste Zeile „myGrid.removeAll();“. Bei jedem Aufruf der Methode browse() des FileReferenceList Objekts wird das Array (fileList) neu intialisiert. Das lässt sich leider nicht verhindern – dadurch ist ein zusätzliches Hinzufügen von Dateien nicht direkt möglich.
[code]
private function checkFileExtension():Void {
var fileList:Array = fileRefList.fileList;
for(var i:Number = 0;i0) {
// Upload next file
upload();
} else {
// Batch Upload completed
aktTotalSize = 0;
uploadProgress = false;
status_txt.text = „Upload completed“;
progressDisplay_mc._visible = false;
}
}[/code]
Die neue Upload Methode sieht so aus:
[code]public function upload(firstStart:Boolean):Void {
if(fileChecked == true) {
if(firstStart == true) {
uploadProgress = true;
// Overall Filesize Calculation
var fileList:Array = fileRefList.fileList;
overAllSize = 0;
for(var i:Number = 0;iIch bin kein großer Fan der MM-Komponenten (V2 Architektur, Dateigrößen …) – dennoch werden diese Komponenten hier verwendet, da die Erläuterung der Funktionsweise des Flash-Uploads im Vordergrund steht. Als kleines Gimmick werden hier im Fortschrittbalken vertikale Linien eingezeichnet, welche durch ihre x-Position die jeweilige Dateigröße im Fortschrittsbalken symbolisieren.

Falls Ihr Fragen dazu habt, beantworte ich diese natürlich gerne. Schreibt einfach einen Kommentar in den Blog.
Anyway, Part V is coming …

[Edited: Die Online-Demo habe ich eingestellt – kostet einfach Zeit die Uploads in regelmäßigen Abständen zu überprüfen.]
Flash Upload – Version 4.1 Quelldateien herunterladen

32 thoughts on “Flash 8 – Upload: Part IV”

  1. >Das lässt sich leider nicht verhindern – dadurch ist ein zusätzliches
    >Hinzufügen von Dateien nicht direkt möglich.

    …aber vielleicht zu umgehen, wenn man alle ausgewählten Files zwischenspeichert in ein weiteres Array, oder? Müsste doch gehen. Dann fügt man immer erst die zwischengespeicherten Files hinzu und dann die durch den Browsedialog hinzugenommenen.

  2. Pedro: Du kannst dem PHP-Script einfach über GET eine Variable mitgeben:
    var myDir:String = „files/“;
    fileRef.upload(„upload.php?destDir=“+myDir);

    Und anschließend im PHP-Script:
    $myDir = $_GET[‚destDir‘];
    foreach ($_FILES as $fieldName => $file) {
    move_uploaded_file($file[‚tmp_name‘], $myDir.$file[’name‘]);
    $myTempFile = $myDir.$file[’name‘];
    chmod($myTempFile,0777);
    }

  3. Hallo,

    Ich bin schon seit längerm auf der Suche nach einen Upload applet und jetzt bin ich auf dein Flash gestossen.
    Genau was ich suche :) und vor allem ohne Applet
    Mit ist nur noch nicht ganz klar, wie das mit den Verzeichnissen funktioniert.

    Ich würde dem Flash gerne mein ausgangs = zielverzeichnis übergeben, da in meiner Gallerie ein upload in verschiedene Verzeichnisse möglich sein soll.
    So wie es hier aussieht, ist mein ausgangsverzeichnis immer das, wo mein swf drin ist. Kann man das irgendwie konfigurieren? Das von Perdo oben ist ja eher der 2. Teil, wo man das ziel verändert. Ich würde ja auch noch die quelle gerne konfigurieren.

    Meine Flashkenntnisse sind eher nicht existent, drum ist ein Satz mehr sicherlich nicht verkehrt. Wenn es sir nichts ausmacht, kannst du mich auch per email kontaktieren.

    Vielen Dank,
    Michael

  4. Es gab einen kleinen Bug in der „checkFileSize“ Methode. Wenn die Dateigröße einer der Dateien als „ok“ eingestuft wurde, wurden damit automatisch auch alle Dateien die zuvor geprüft wurden bestätigt (unabhängig davon ob die Dateigröße der Dateien dem Limit entsprachen).

    Den gleichen Fehler gab es auch in der „checkFileExtension“ Methode.

    Die Version wurde auf 4.1 aktualisiert.
    Dank an Michael! (für den Hinweis)

  5. Servus FlashLovers,
    finde den Uploader echt cool ! Aber verbessern geht immer !

    Ich fände es gut wenn man einen Eintrag aus der liste einfach so per Drag & Drop auf ein Textfeld ziehen könnte und dort erscheint dann der absolute/relative link der Bilddatei, um das ganze quasi in ein kleines CMS einzubauen. Hat da jemand ne Idee für ?!?

    Greetz Andy
    …weiter so

  6. Servus,
    hat jemand ne Ahnung warum das Script auf meinem Server bei Evanzo nicht mehr läuft???
    Es sieht alles so aus als ob es noch geht, Upload Balken geht,.. nur am Ende bekomme ich einen Http – 503 Fehler zurück !!!! Hab schon geschaut was Fehler 503 bedeutet, Rechte gecheckt, bei Evanzo nachgefragt ob sie was geändert haben, aber hilft bisher alles nichts. Wär weiß was es eventuell sein könnte ?????
    Gruss
    micha[a]woodstreet.de

  7. Wenn der Dateiname fehlerhaft ist, z.B. Tag02.Sibille.jpg läßt sich die Datei nicht hochladen… wenn ich es richtig sehe, erkennt er die Extension an dem ersten Punkt im Dateinamen richtig? Wäre es nicht sinnvoller einfach die letzten 3 Buchstaben zu checken? … Wie macht man das? Habe gerade mit Slice und negativen Zahlen probiert, aber mir will es nicht gelingen…

    Ansonsten bin ich von diesem Tutorial hellauf begeistert… so etwas ausgereiftes habe ich bisher noch nicht bewundern können…

    Lieber Gruß
    Chris

  8. Hi, bin ein absoluter noob in sachen PHP.

    Habe auch eine Upload möglichkeit in Flash gesucht un bin hierauf gestossen.

    Mein Problem ist das ganz auf meine Situation umzuschreiben, soll heissen:

    – Wo gebe ich an auf welchen Server hochgeladen werden soll
    – Ausserdem hab ich mitbekommen das der Upload zz. nur für Images ist.
    da ich jedoch eine Flash Seite für ein Music Label mache und anbieten möchte das Künstler Ihre Demo Tracks hochladen können müsste das bei mir auch mit mp3 gehen.

    Wenn mir jemand näheres beantworten könnte wär das nett =)

    Schönen Tag
    mhmmm

  9. Hallo!

    Ich finde den Uploader genial! Nur hab ich leider ein kleines Problem.

    Der Uploader befindet sich bei mir am Webserver in einem per .htaccess geschütztem Verzeichnis. Wenn ich mit IE mich mit User und PW anmelde kann ich ohne Probleme Bilder hoch laden.

    Wenn ich aber mit FireFox auf den geschützten Bereich gehe und dort Bilder hochladen möchte, kommt eine weitere Authentifizierungs-Aufforderung von IE.

    Kann sich das wer erklären? Verwendet Flash nicht den Standard Browser (in meinem Fall FF) zum Upload sondern den IE?

    Hat jemand ähnliche Erfahrungen?

    Geri

  10. Hallo super tut, das ist genau was ich haben wollte.

    Jetzt hätte ich aber noch ein paar Fragen, da ich mich mit flash überhaupt nicht auskenne.

    Ich habe die readdir.php soweit abgeändert, das er mir aus der Datenbank bestimmte werte ausliest. Er zeigt sie mir auch in dem oberen Fenster alle schön an aber wie bekomme ich es jetzt hin, das 1. der user erst einen wert aus dem oberen Fenster auswählen muss und 2. das dieser wert dann gleich mit an die upload.php übergeben wird?
    Was auch noch schön wäre, wenn mann noch eine Textbox hätte, wo man einzelne Informationen reinschreieben könnte und diese auch mit an die upload.php mit übergeben könnte.

    Tut mir leid, das ich hier so bestimmt einfache sachen frage aber ich habe leider gar keine ahnung von flash.

    liebe grüße und besten dank

    Tobi

  11. Hallo,
    ich bins schon wieder :)

    So da ich es nicht hinbekommen habe, im Flash selbst eine Abfrage an die Datenbank zu stellen und das Ergebnis an das upload.php zu schicken, möchte ich das ganze jetzt anders lösen.

    Also die Abfrage an die Datenbank hat schon funktioniert und ich sehe das Ergebnis auch im Flash aber ich habe keine Ahnung wie ich das Ergebnis an das Upload.php mit übergeben kann.

    Jetzt mein neuer lösungsansatz.

    Ich rufe zuerst eine extra php seite auf, wo ich mit der Datenbnak ordentloch arbeiten kann und bekomme meine zwei gewünschten variablen.
    Danach setze ich zwei SESSION Variablen und danach rufe ich das Uploadflash auf nun ist mein Problem, das, obwohl es SESSIONS sind, diese nur in der Upload.php ankommen, wenn ich sie im Browser direkt aufrufe.

    Kann mir jemand sagen, wie ich genau zwei variablen an den Flashfilm übergebe und der wiederum die Variablen unverändert weiter übergibt an das Upload script?

    Ich wäre euch zu Dank verpflichtet.

    Grüße Tobi

  12. Hallo ich noch mal

    So ich habe das Problem jetzt gelöst.
    Eventuell braucht es ja noch jemand anderes.

    der Aufruf des Flashfilms wird so realisiert:

    php script:

    &bezeichnung=“ qualit……….

    Action script:

    var kategorie = _root.kategorie;
    var bezeichnung = _root.bezeichnung;
    fileRef.upload(„../upload.php?kategorie=“+kategorie+“&bezeichnung=“+bezeichnung);

    hoffe das hilft weiter.

    Danke für das geniale flashfile

    Gruß Tobi

  13. Hm irgend wie hat der beim kopieren die hälfte vergessen.

    Hier das PHP script

    Hallo ich noch mal

    So ich habe das Problem jetzt gelöst.
    Eventuell braucht es ja noch jemand anderes.

    der Aufruf des Flashfilms wird so realisiert:

    php script:

    &bezeichnung=“

    Gruß Tobi

  14. Hm da fehlen jetzt noch die session variablen
    ?kategorie=\$_session[‚kategorie‘]\
    &bezeichnung=\$_session[‚bezeichnung‘]\

    so das war mein letzter versuch das zu posten, wenn jetzt gleich wieder nichts drin steht, dann weis ich auch nicht weiter.
    Wenn wer fargen hat, dann eine mail an mich.

    Gruß Tobi

  15. Im IE 7 und aktuellen Flashplayer 9 erhalte ich bei grösseren uploads folgende meldung:

    Adobe Flash Player 9 wird durch ein Skript in diesem Film verlangsamt. Wenn das Skript weiterhin ausgeführt wird, reagiert der Computer möglicherweise nicht mehr. Möchten Sie die Ausführung des Skripts abbrechen? ja/nein

    kann das behoben werden?

  16. @Markus:
    Ich hatte die Meldung in Flash 8 bisher noch nicht. Normalerweise weist die Meldung ja bspw. auf eine Endlosschleife hin.

    In Flash 9 (AS3, Flash 9 Filme) lässt sich die max. Skript-Ausführzeit in den Veröffentlichungseinstellungen einstellen, wobei ich nicht weiß, ob das in diesem Fall irgendeinen Einfluss hat und Abhilfe schafft … (soweit ich weiß nicht für AS2, bin also auch überfragt …)

  17. Hi!
    Habe ein sehr eigenartiges Problem mit dem Upload-Tool auf meinen Mac.
    Ich benutze MAMP zum testen. Der Fortschrittsbalken bleibt beim Mac Firefox 2.0 bei 100% stehen und beim Status bleibt es bei „Please wait…“.
    Aktualisiere ich die Seite, so erscheint die hochgeladene Datei auch in der Dateiliste der FlashAnwendung. Ich habe auf meinem Mac OS X zusätzlich noch Parallels mit Windows XP, IE6 und Firefox 2. Dort funktioniert die gesamte Upload-Funktion problemlos und die Statusmeldung zeigt mir den erfolgreichen Upload an und im Dateibrowser erscheint die neue Datei.

    Hat jemand schonmal das gleiche Problem gehabt und kennt eine Lösung?

    Robert

  18. Hallo,

    wie kann man das Problem lösen, dass der eingebettete flash-uploader nach abgeschlossener Dateiauswahl (myUploader.browse();) den Fokus verliert?

    So muss ich erst immer mit einem Klick auf die Flashdatei den Fokus herstellen und kann erst anschließend weiterarbeiten.

  19. tag

    hab das script umgeschrieben um mp3s zum uploaden, laeufft problemlos bei 100mb auf internetexplorer, aber leider NUR auf IE.

    hat jemand bereits die loesung wie man flash-upload auf mozilla zum lauffen bringt ohne den IO-error.

    hab mir dazu bereits einiges durchgelesen, nur komm ich damit auch nicht weiter, zB

    http://thanksmister.com/?p=59

    http://www.google.de/search?q=flash+upload+mozilla+io+error&hl=de&start=0&sa=N

  20. Das Tutorial hat mir sehr geholfen!

    Allerdings sollte man die File-Extension besser so ermitteln:

    var pos = aktFile.name.lastIndexOf(„.“);
    var ext:String = aktFile.name.substr(pos+1).toLowerCase();

    Die Variante, die hier beschrieben ist, kommt nämlich durcheinander, sobald ein Dateiname mehr als einen Punkt enthält.

    Außerdem sollte man in dem Script, das die Dateien auf dem Server verarbeitet (im Beispiel die upload.php), unbedingt penibelst checken, dass die Datei nicht eine Endung hat, die der Server als PHP ausführen würde (dazu gehören oft neben .php auch .phtml, .php3, .php4, .php5). Oder .htaccess-Dateien könnten auch ganz üble Dinge anrichten (falls man sich entscheidet, beliebige Dateiendungen zu erlauben)…

    Trotzdem vielen Dank für dieses Tutorial! Grüße, c_t

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.