Flex FileUpload Component

What we’ve got here is a FileUpload component for Flex which utilizes the new FileReference.load method available since Flash Player 10 to support uploading of large files.
As a lot of providers choose a very small size for their PHP ini settings of upload_max_filesize and post_max_size, uploading files bigger than 2mb is often not supported. This can be very annoying if you like to upload mp3 or video files, which easily can exceed the maximum accepted file size. In this case you normally have to go with an FTP client.
Uploading large files
If supported by the client’s Flash Player this upload component utilizes the new FileReference.load method to load the file into the ram of the client computer at first. Once loaded the file data can be read via the data property of the FileReference object. It is now possible to extract chunks of the loaded file data and upload those chunks to the server separately. This way the upload-data won’t exceed the maximum accepted post data of the server as the chunks used are a lot smaller. On the server side, a php script is joining the chunks together to the original file.
Resuming Uploads
Prior to uploading the uploader also calculates an adler32 checksum of the file data. This checksum is used to check if a partially uploaded file already exists on the server and an upload operation can be resumed.
Screenshots
Since i don’t want unkown people to upload random files to my server, i can only offer some screenshots of the application here. The best thing would be, if you grab the source code which is available at the bottom of this page and test it out yourself.

selected files for upload

file already exists dialog

loading file into ram to for chunkwise upload

calculating an adler32 checksum of the file data to support the resume of uploads

uploading the file in chunks
License
Download
FlexFileUploadComponent.zip (version 0.1.4)
browse the source code and contents of FlexFileUploadComponent.zip

26 Comments
Very awesome!
Where does one define a specific folder within the default directory that uploaded files are placed?
The destination directory can be any existing directory on your server and is set inside the upload.php file:
$upload = new FileUpload(DESTINATION_DIR);or you can write:
$upload->set_target_directory(DESTINATION_DIR);Hi, i am not able to specify a new folder for the uploaded files. At my webhoster i am using this folder: ‘/var/www/html/web256/html/bht’ . The files should be uploaded into ‘/var/www/html/web256/html/bht/uploads’. How can i realize it?
This is really brilliant piece of code! It solves all the problems with uploading files on a shared hosting. Very neat and elegant code, easy to customize and it works! Thank you.
Any reason why the file uploaded to the server would continue to have the .tmp extension? I don’t see any errors in the log files.
Isn’t it possible to upload really large files ( > 100.00 mb)? If yes how could you do this?
I would love to use it but it does not work with over 30 errrors being generated in the BigFileUpload. What version of Flex is required?
Wow, this looks quite handy!
For a nice and easy Web-ftp solution, check my FileManager FX.
You have to compile the component for Flash Player 10 (with Flex SDK 3.x).
FileReference.loadis only available since FP 10.For more information see:
http://opensource.adobe.com/wiki/display/flexsdk/Targeting+Flash+Player+10
Can you use this code to load a video to the client flex app.?
Can you play the video without uploading it to the server?
This is awesome!!! I appreciate if you also post the upload.php code or server side script sample that can verify the checksum and allow resumption of the interrupted upload?
The php code is already available. The files are inside the
bin-debugdirectory of the zip file.See: http://www.zehnet.de/files/FlexFileUploadComponent/$zip_FlexFileUploadComponent/bin-debug
Cool, thanks Nik! This really helps! What would you reccomend for enabling pause/resumption on big file download? Is there any sample code similar to upload exist for managing the download?
BUG!
Thanks for the awesome component. There is a bug you may not be aware of. When you upload a file smaller than the chunk size the session variable is changed. All other actions (such as file check and split upload) send the correct session var. This casuses an issue with server side authentication of log in.
Thanks again. It got me out of a hole!
@Steve:
If you upload files smaller than the chunk size, the “ordinary” actionscript upload is used via
FileReference.upload. This method is buggy as it does not send cookie data with the request. If your session depends on a sessionId set in a cookie, the request won’t be authenticated. And you can not even change this behavior by directly digging into the request headers and adding the cookie data manually.The manual says:
“The requestHeaders property of the URLRequest object is ignored; custom HTTP request headers are not supported in uploads or downloads.”
The only solution to bypass this problem is to either send your sessionID as GET parameter via
urlVariablesor to use the customBigFileUploadclass for all of your uploads.nik
It looks great but I have no idea how it works. I keep getting “No ploadUrl specified” and I can’t figure out how to resolve it.
It looks great but I have no idea how it works. I keep getting “No ploadUrl specified” and I can’t figure out how to resolve it.
You have to pass an
uploadUrlvia flashvars to the swf object as it otherwise does not know where to upload the files.Excellent work. can you let us know how to upload more then 100MB files.
Very nice app. I was trying to integrate this with my website. The file upload folder path is dynamic in my project. But I am facing problem the app is uploading files to folder which is initially assigned even after i change folder path using session variable in PHP.
Hello,
I forgot one thing, I need to update my database with all files uploading, where should i include that code ?
Great application. It works with files greater than officialy supported 100MB. However there is a problem with files greater than the amount of RAM available. In such case there should be MemoryError thrown and caught (as I see it in BigFileUpload code). But it crashes Flash Player instead. Why is that? Am I missing something?
How to update my database with all files?
Hi Nik.
I have found a bug? I have set the max upload file size to 600MB. When I upload 3 files on FF with their sizes adding up to just over 600MB the upload fails on the last file with the % progress saying “uploading file…NaN%”. Subsequent file uploads fail – even if the page is refreshed. Closing FF is the only way to get files uploading again. I suspect it isn’t clearing the size uploading between files – but I don’t programme flex, thus cannot fix.(Sorry)
My client is willing to pay for your time to fix – just let me know the estimated cost.
Thanks for the excellent component.
Steve
Found an issue, getting urlVariables parameter not working
in file FileUploaderStandalone.mxml,
line 60
var c:XMLList=data.children(), n:int=c.length;;
need to be changed to
var c:XMLList=data.children(), n:int=c.length();