Upload Suite can be used with any server technology, including ColdFusion. Let's add the upload functionality to your ColdFusion site with a help of Upload Suite.
Integration of any uploader requires doing two things:
The server-side part won't be much different comparing to writing a code for a regular old good HTML Browse button. Upload Suite sends files as a standard HTTP POST request as multipart/form-data (RFC 1867).
Let's see how you integrate Upload Suite with your site step by step.
Upload Suite consists of two uploaders - a lightweight uploader based on HTML5/Flash and more advanced Java/ActiveX uploader. You can use either one of them or both.
First, let's make some preparations:
The first thing you need to do is to link HTML5/Flash uploader scripts and styles with the page where you are going to use it (the ones you copied to your server as per previous section). There are two files you generally need to link:
You can do it as follows:
$au.imageUploaderFlash. To insert the uploader, you should:
It looks like this:
Here are some comments about the uploader settings:
type— specifies whether you want to use HTML5, Flash or both. Typically, the default value is fine, but you can change if you need more control.
licenseKey— you should either use a trial license key or insert a full license key received upon the purchase. You may omit it for localhost.
converters— defines whether it is necessary to do with files before the upload. In this code, uploader is configured to upload only original files.
uploadSettings.actionUrl— specifies the URL of the script where the POST request is sent. We will write this script a bit later.
uploadSettings.redirectUrl— tells the uploader what page to open when all files are successfully uploaded. Omit this param if you don't want to leave the page.
flashControl.codeBase— specifies where the Flash uploader binary is located. If you use some unusual location for the Scripts folder, don't forget to update it!
For more detailed explanation, please refer the documentation.
Inserting ActiveX/Java uploader is very similar to the HTML5/Flash counterpart. The difference is that you should link other .js files:
To embed ActiveX/Java uploader, use
$au.uploader object instead of
As you see, it is very similar to HTML5/Flash, however there are few differences:
javaControlcodebases — specify from where to download the .cab and .jar files. Make sure that these URLs are valid.
$au.installationProgressobject — connects the installation progress with the uploader. Optional.
type— likewise to HTML5/Flash, it tells whether to use ActiveX or Java part. Note, ActiveX works only in IE. If you turn it off, Java will be loaded there.
Upload Suite sends files as a POST request. Your code should parse it, extract POST fields and process them correspondingly. In ColdFusion, you use the
#Form# collection to do it. If you ever dealt with a regular Browse button uploader, you should familiar to it.
As usual, all you need is to understand how many files are uploaded and then iterate through all files and save them to disk. The file count is sent in the PackageFileCount POST field and files are sent as File0_0, File0_1, File0_2, etc. If you use multiple converters, the first index will be increased (like File0_0 for the first file produced by the first converter and File1_0 for the same file produced with the second converter.
Here is an example of a ColdFusion script which saves all uploaded files to a server folder.
<cfprocessingdirective pageEncoding="utf-8" /> <!--- Check if it is POST request ---> <cfif NOT CGI.REQUEST_METHOD is "POST"> <cfabort /> </cfif> <cfset galleryPath="../UploadedFiles/" /> <cfset absGalleryPath="#ExpandPath(galleryPath)#" /> <!---Get total number of uploaded files and save them.---> <cfset fileCount=(#Form.PackageFileCount#-1) /> <cfloop index="i" from="0" to="#fileCount#"> <cfset name="#Form["SourceName_#i#"]#"/> <!--- Get source file and save it to disk. ---> <cffile action="UPLOAD" filefield="File0_#i#" destination="#absGalleryPath#" nameconflict="MakeUnique"> <cfset sourceFileName="#serverFile#" /> </cfloop> <cfoutput>Upload complete</cfoutput>
Upload Suite also sends a lot of other fields. Refer list of POST fields sent by Aurigma for more details.
You can find some ColdFusion sample applications in the Upload Suite package. Typically, it is available here: