| Register
Saturday, May 17, 2008   

Free Code - File Upload Application

Created By  Chris Bizzell, at  7/18/2005 - 50 comments.

Click to view this author's website.

I remember starting out with Flash and getting to a point on a project and saying If I could just see how so and so did that. Well for the next few weeks, I will be posting some basic solutions to some common and not-so-common problems we all encounter in working with Flash.

This article stemmed from a site we were creating that was to allow a user to upload an image and then manipulate that image inside of Flash. The site owner wanted the interface to be cross-platform compatible and be on one page and the upload and
Flash interfaces must be somewhat seamless.

As most of you are well aware, Flash does not have an equilivant to the enctype="multipart/form-data" form object that allows the browser to prepare to read and transmit a file from the user's system to a server. My first thought was to utilize the new JavaScript Integration Kit and build a page utilizing hidden forms that communicate with each other using the functionality afforded by this new kit. But, after several attempts, I could not get the solution that worked so well in Internet Explorer to work in FireFox and Safari. That was too bad because I had spent a while working on this and really liked the solution at hand. But failure brought the problem to a new light and made me think about my approach. Were all the convoluted JavaScript functions really needed or was a simple approach really a better way to go. I decided yes, simpler is better in this case and scrapped the solution I created in favor for the one shown here.


Since this code is free, I will not be documenting much of it here. It is intended to be a jumping off point for future work and thought. I will mention two techniques that are integral to the solution.

First, I decided to stop trying to re-invent the wheel and use the HTML enctype="multipart/form-data" form object by linking to a Cold Fusion form
in a pop-up window.

This can be accessed in Flash with the following code:

Second, after the file is selected and the upload is processed by a simple Cold Fusion page, I send the name of the file back to the originating Flash movie via the LocalConnection Object. Here is that code:

The name of the uploaded file is appended to the swf name as so:

sender.swf?file=#cffile.ClientFileName#.#cffile.ClientFileExt#

This makes the variable available on the sender swf main timeline.

The Local Connection object enables a hidden Flash movie, embedded in the Cold Fusion upload page, to communicate the name of the image that was uploaded. It also instructs the originating Flash movie to perform a function that loads the uploaded image into the movie.

This article is not intended to be a how-to. It is meant to give one solution to a common problem and hopefully it will spur your development as you explore the possibilities of Flash. I welcome your feedback and suggestions to other ways that this problem can be solved. As in any case, there is always more than one way to skin the proverbial cat.

You can download the source here.

Related link:

Macromedia's Support Article on the Local Connection Object


Need Professional Help For Your ActionScript Project?
ActionScript.com Consulting Services provide top quality professional ActionScript consulting to businesses around the globe. If you have a professional project in need to world-class talent, tell us about your project by requesting a quote today.

Reader Comments

  1. g  Replied:
    ( 7/19/2005 At 5:40 PM)

    i am not much of a backend programmer, i just wanna know if the code would differ much if it were ASP or PHP .. ?

  2. Christopher Wigginton  Replied:
    ( 7/19/2005 At 6:16 PM)

    Bravo! Thanks for thinking out of the box on this one.

  3. cvb  Replied:
    ( 7/19/2005 At 8:40 PM)

    The php/asp solution would be essetially the same. The key is to append the name of the uploaded file to the name of the swf that sends this name back to the originating swf. PHP/ASP both have a request.querystring object that you can use for this purpose.
    I.E. myswf?fileName=request.querystring("uploadedFile")

  4. valters boze  Replied:
    ( 7/19/2005 At 9:07 PM)

    Flash 8 will support file uploading, so not much need of this. And its pretty easy to do this with php :/

  5. Satori Canton  Replied:
    ( 7/19/2005 At 10:11 PM)

    So, Flash 8 may support file uploading? How does that provide us with a solution today (or even anything this year)?
    Good stuff Chris!

  6. cvb  Replied:
    ( 7/19/2005 At 10:46 PM)

    Our firm rarely builds projects tailored for new Flash releases until the adoption rate goes over 50%.
    With the release still pending, this may be over a year.
    Anyway - as I state in the article - there are myriad ways to skin the cat.

  7. freddy  Replied:
    ( 7/20/2005 At 3:41 AM)

    hehe, exactly the same solution you can find on
    www.sephiroth.it/tutorials/flashPHP/imagebrowser/
    php based, and like 2 years old... google comes to mind :)

  8. cvb  Replied:
    ( 7/20/2005 At 5:59 PM)

    I checked the php solution link - that is an image gallery - no upload. Your comment is not really relevant.

  9. cvb  Replied:
    ( 7/22/2005 At 4:25 PM)

    For those interested in Flash 8 file uploading, try this link
    http://www.pixelficker.com/flash-8-file-upload-beta/

  10. g  Replied:
    ( 7/22/2005 At 5:48 PM)

    any php egs... ?

  11. cvb  Replied:
    ( 7/22/2005 At 6:09 PM)

    Here is a link to a PHP upload article:
    http://www.netspade.com/articles/php/uploading.xml
    The only change you need to make is to capture the uploaded file name via the following code:
    $_FILES['userfile']['name']

  12. Michael Cronin  Replied:
    ( 7/26/2005 At 10:19 PM)

    Why not just make the whole thing in html/PHP?
    Is there any advantage to a Flash frontend when it needs a pop-up html window?

  13. hichkas  Replied:
    ( 7/27/2005 At 12:37 PM)

    very good

  14. cvb  Replied:
    ( 7/27/2005 At 4:30 PM)

    Having the user upload a local file and have it availbale in the flash movie is very powerful. The image can be scaled, rotated, overlayed with text, etc. Things not possible in HTML. The whole point is to have the ability to bring local image files into the Flash movie that the user is interacting with.
    From there, the possibilities Flash affords are far greater than that offered with HTML.

  15. Michael Cronin  Replied:
    ( 7/27/2005 At 5:58 PM)

    Sorry I guess I was not clear about the Flash vs PHP/ASP and HTML thing :)
    Yes of course having a Flash front end is very useful (although many of these things can also be done via php) and I create a lot of dynamic, updateable sites in Flash.
    What I meant was - what is the advantage of having the "back-end" or the CMS function in Flash?
    Why not keep the whole thing in PHP/ASP html?
    The upload function is carried out via a pop-up anyway.
    Is it just to justify having Cold Fusion instead of open source? ;D

  16. Michael Cronin  Replied:
    ( 7/27/2005 At 6:02 PM)

    Just want to add that by the way I think its cool you figured it out ;)
    but i really am curious about the jusification behind using this method ;D

  17. cvb  Replied:
    ( 7/28/2005 At 4:28 PM)

    The short answer as to why I used Cold Fusion is that it is easy to implement a file upload with it, it only required this line of code:
    destination="c:\\data\\inetpub\\bizwerk\\upload_test\\uploaded_files\\"
    nameConflict="overwrite"
    fileField="Form.fileToUpload">
    The overall reason for coming up with this solution was to have a fairly seamless Flash app that was powerful yet easy to put together.

  18. Nguyen Quoc Viet  Replied:
    ( 8/2/2005 At 8:16 AM)

    Is there asp code available for this? Thanks.

  19. Alex .A  Replied:
    ( 8/8/2005 At 10:03 PM)

    I am more of a programming/command line interface kind of guy and I would rather manually write out code to create my flash presentation, than use the flash software. I have heard of some one who can do this, so I know it is possible. How can I get access to viewing flash code, and how can I learn to create my flash presentations by acutally typing code in a text document, rather than using the flash software.
    -------------------------------------------------
    Mr N0n-uSeR fr/endly iS My > name

  20. Ronnie  Replied:
    ( 8/11/2005 At 4:03 PM)

    very good.it's great

  21. Ronnie  Replied:
    ( 8/12/2005 At 9:30 AM)

    i want free game codes. thanks

  22. Alex .A  Replied:
    ( 8/12/2005 At 6:07 PM)

    I don't understand!, I was electronic-mailed that I had recieved a reply for my above question, yet I can't seem to find it on this page. Where is my reply?
    -------------------------------------------------
    Mr N0n-uSeR fr/endly iS My > name

  23. Jerry Jasuta  Replied:
    ( 8/19/2005 At 4:40 AM)

    Alex .A - You can use PHP's Ming module to create SWF file from code, it's all I've used since about 6 months before FMX came out. For a someone who prefers code to a GUI/IDE, it is terrific! http://ming.sourceforge.net
    It is also a great way to implement the solution in this article without the expense of Cold Fusion, just let Ming generate the SWF file with the upload file name, and then use the LocalConnection as previously stated!

  24. tarun  Replied:
    ( 8/25/2005 At 9:06 AM)

    plz give me a sef text code.

  25. Martin  Replied:
    ( 8/25/2005 At 8:57 PM)

    Chris is senior web developer for The Pinnacle Consulting Group!!!
    Is this guy just showing how complicated he thinks or is he just confused??? I'm impressed..
    Why not take the ease way!
    Use window.document.theflashmovie.SetVariable("Loaded", confirm)in HTML(JScript) to tell the flash movie the file is uploaded ... 1 HTML with embedded Flashmovie and a PHP uploadscript or something like that.....
    Greetinx

  26. Alex .A  Replied:
    ( 8/27/2005 At 10:53 AM)

    Thank you Jerry Jasuta, for replying to my question;
    and I would also like to add, that this is the only flash forum that I have visited where some one has actually ansered any of my questions.

  27. Pete  Replied:
    ( 9/22/2005 At 8:35 PM)

    Is there a way to have the flash upload a file if i DRAG a file onto flash in a web page? Actually, the broader question is, how can i capture a drag into a browser window (through Javascript? or something else?) for file uploading to commence?

  28. tiancai  Replied:
    ( 9/23/2005 At 7:59 AM)

    I wish 2 noe how 2 make a flash game that reacts to keyboard pressing...how is it done???

  29. navin  Replied:
    ( 9/23/2005 At 7:11 PM)

    i am looking for site uploader for my site.

  30. lily white  Replied:
    ( 10/5/2005 At 4:35 PM)

    Hello,
    I'm new to web design and I have no idea how to create flash intro without micro, can you help me pls?..

  31. ramyar  Replied:
    ( 10/7/2005 At 10:27 AM)

    salam

  32. jerry  Replied:
    ( 10/8/2005 At 5:25 AM)

    im just a beginner, ive got macromedia flash mx 2004 and i want to create a website for my band similar to seether.com i know im not going to learn this in a quick lesson, so where do i start? thanks.

  33. cvb  Replied:
    ( 10/11/2005 At 4:11 AM)

    get one of the visual quickstart books -- they are easy to follow

  34. hemant belekar  Replied:
    ( 10/11/2005 At 3:56 PM)

    send an file uploading text code.

  35. mugafuga  Replied:
    ( 10/17/2005 At 1:28 AM)

    sheesh this thread just went into total crap mode. I think it happened right after someone said "all my questions got answered" Whoever you are that did that please stop doing that forever in all forums you may possibly post to or "actually get an answer from".. Who knows someone else might learn something from it too.

  36. shashikant tripathi  Replied:
    ( 10/21/2005 At 10:31 AM)

    I am Shashikant Tripathi i want to know that how to upload a file in the program

  37. Pip Jones  Replied:
    ( 10/27/2005 At 7:33 AM)

    You could also target the original window which holds the swf page, in the action of the form. Then the server-side script which uploads the file reproduces the original page with an additional parameter (FlashVars or thing.swf?filename=something) added containing the name (or id) of the file uploaded.
    The downside is the user has to reload the page, but using FlashVars will mean the browser cache is respected (as swf url params often defeat browser caching). It depends how complex your application is as to whether re-initilising would, say lose state in a workflow, but you could always pass this back too.

  38. Web Design Delhi  Replied:
    ( 10/28/2005 At 4:47 PM)

    File Upload application in Flash, it's really mind-blowing approach. Thanks a lot for developing and sharing this very useful script with us.

  39. Sam  Replied:
    ( 11/2/2005 At 6:17 AM)

    G-E-N-I-U-S.
    Good job.

  40. asemone-shab  Replied:
    ( 11/13/2005 At 3:28 AM)

    music

  41. «­code»bandit®  Replied:
    ( 11/17/2005 At 11:50 PM)

    Thanx Chris, BUT i still like to mess up php and the like. Flash fileupload? Maybe later! Spoils the fun in coding.

  42. SAAD ANSARI  Replied:
    ( 11/21/2005 At 9:59 PM)

    how can i upload my flash web site

  43. Manoj Aswal  Replied:
    ( 11/22/2005 At 4:54 PM)

    Pls send this code.

  44. anan  Replied:
    ( 12/16/2005 At 11:11 PM)

    thank you

  45. Troels Gregersen  Replied:
    ( 1/21/2006 At 10:26 PM)

    Hej !

  46. luis diaz  Replied:
    ( 3/17/2006 At 8:46 PM)

    Hi, the code to upload files is so great.

    I need to add it to an email form can help me to send an email with the file attached, is it posible?

    somebody can help me?

    Thanks.

    Luis

  47. cloud strike  Replied:
    ( 5/5/2006 At 2:54 AM)

    hey guys...
    can i ask a question?

    do have any source code in flash databasing?

    can i have some...

    thanks...

  48. Adel Bandari  Replied:
    ( 5/20/2006 At 9:49 AM)

    ineed to know how to ipload my flashe file ineed help

  49. Edwin Toh  Replied:
    ( 10/5/2007 At 9:14 AM)

    I'm new to AMFPHP and this tutorial you have here, really got me raring to go, except that, I no longer have Flash 8!

    Is AMFPHP only compatible with Flash 8 for now? Adobe Remoting components for Action Script 2 only supports up to Flash 8. Or am I missing a page to download a Flash CS3 one?

  50. siva guru  Replied:
    ( 10/23/2007 At 8:24 AM)

    hi i need basic flash actionscript

Login to post your comments. If you do not have an account with us please Register.
Copyright 2005 by ActionScript, Inc.   |  Privacy Statement  |  Terms Of Use  |  ActionScript Client Extranet