Fusionality

Diese Woche sollte ich für ein Projekt einen Datei-Upload realisieren. Eine Anforderung war, dass während dem Upload ein Statusbalken erscheint, möglichst mit Dateigröße und dem Fortschritt in Prozent.

Da man ja nicht immer das Rad neu erfinden muss, suchte ich nach einer bestehenden Lösung und fand jQuery Uploadify. Das mitgelieferte Beispiel von PHP auf ColdFusion zu portieren war kein großes Problem. Einfache Uploads funktionierten auf anhieb.

Allerdings sollten nach dem Upload einige Dateiinformationen in der Session gespeichert werden. Also habe ich innerhalb der Session ein neues Struct angelegt und wollte dieses befüllen. Auf der Folgeseite habe ich also mit <cfdump> die Session ausgegeben. Doch was ist das? Das Struct war leer! Es existeierte aber eine Session, cftoken und cfid waren vorhanden. Da ich eine in der Session gespeicherte UUID als Ordnername verwende, sah ich, das dort zwar ein Ordner angelegt wurde, aber unter einer anderen UUID.

Was war also nun passiert. Mein Aufruf der Seite hatte eine Session gestartet. Aber der Upload via Flash hatte eine separate Session gestartet, da Flash die Session nicht übergeben hatte.

Also musste ich Uploadify irgendwie dazu bringen, die Session zu übergeben. Dazu habe ich die Initialisierung des Uploadify Scripts angepasst:

<script type="text/javascript"><!--
$(document).ready(function() {
                  

   $("##uploadify").uploadify({
      'uploader' : 'uploadify/scripts/uploadify.swf',
      'script' : 'uploadify/scripts/uploadify.cfm&cfid=#session.CFID#&cftoken=#session.cftoken#',
      'cancelImg' : 'uploadify/cancel.png',
      'folder' : 'uploads',
      'queueID' : 'fileQueue',
      'buttonText'   :   'Dateien hochladen',
      'fileDesc'   :   'Nur Bilder und PDF',
      'fileExt'   :'*.jpg;*.pdf;*.jpeg;*.jpe;*.tiff;*.tif;*.png',
      'auto' : true,
      'wmode':'transparent',
      'multi' : true

   });
});
// --></script>

Die Dokumentation bietet keine Option, zusätzliche Parameter zu übergeben. Aber wenn wann an einen Parameter weiter mit & anhängt werden diese trotzdem übernommen.

So, nun hatte ich im Quellcode also folgendes Object:

<object id="uploadifyUploader" style="visibility: visible;" width="110" height="30" type="application/x-shockwave-flash" data="uploadify/scripts/uploadify.swf">
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="flashvars" value="uploadifyID=uploadify&pagepath=/&buttonText=Dateien%20hochladen&script=uploadify/scripts/uploadify.cfm&cfid=10759524&cftoken=19289335&folder=uploads&width=110&height=30&wmode=transparent&method=POST&queueSizeLimit=999&simUploadLimit=1&fileDesc=Nur Bilder und PDF&fileExt=*.jpg;*.pdf;*.jpeg;*.jpe;*.tiff;*.tif;*.png&multi=true&auto=true&fileDataName=Filedata&queueID=fileQueue" />
</object>

Jetzt musste ich also Flash nur noch mitteilen, was mit den zusätzlichen Parametern anzustellen ist. Da die FLA-Datei mitgeliefert wird ist das auch kein Problem:

Zeile 338 in der uploadify.fla:

if (param.script.substr(0,1) != '/' && param.script.substr(0,4) != 'http') param.script = param.pagepath + param.script+'?cfid='+param.cfid+'&cftoken='+param.cftoken;

Somit bekommt die uploadify.cfm, welche den eigentlichen Upload regelt, alle benötigten Parameter übergeben.