Aug
12

File upload explained and expanded

128 comments Posted by: Laura

As we showed in our post File Upload with ColdFusion Flash Forms, file upload is now possible with Flash 8. I introduced it with a custom tag that nicely wraps the functionality of the file upload. It is quite flexible, -hopefully- easy to use, and I believe I’ll use it whenever I need to add a file field in my flash forms. But for those of you who are curious to know how it works, or need additional functionality (which I may add to the tag in the future), this is a walk through the main functions that make it work.

p>The swf file you will find in the zip contains the libraries that make file I/O possible. In order to have those available in our flash form, we load it in a textarea. Why not use a cfformitem type=”html”? Because at the moment, that type does not have an id attribute, so we cannot reference it later.

Just so that we don’t have to escape the quotes, make a variable with the swf code:

<cfset swf = '<p><img id="upload" hspace="0" vspace="0" src="fileUpload.swf"></p>' />

<cftextarea name="textArea" disabled="true" visible="false" width="0" bind="{(textArea.html = true) ? '#swf#' : ''}" height="0"></cftextarea>

The browse button will have the following:

//a reference to the swf
var uploadSwf = textArea.label.upload;

//make an empty object that will be the upload listener

var uploadListener = {};

//we'll add uploadListener to be a listener of the file upload events triggered by our library

uploadSwf.addListener(uploadListener);

//we are then ready to trigger the browse action. We can pass it some parameters such as the types of file we accept, and the description of these file types


uploadSwf.browse([{description: "Image Files", extension: "*.jpg;*.gif;*.png;"}]);

Our listener object can implement any of these functions, which will be called by the library after the browse has been triggered

  • onSelect(file)
  • onComplete()
  • onProgress (fileRef, bytesLoaded, bytesTotal)
  • onSecurityError(fileRef,errorString)
  • onIOError(fileRef)
  • onHTTPError(fileRef,errorNumber)
  • onCancel()

this function will be called when a file has been selected by the user.

uploadListener.onSelect = function(selectedFile){}

Inside this function, it is our opportunity to check for file size or any other property:

  • selectedFile.name
  • selectedFile.size (in bytes)
  • selectedFile.type
  • selectedFile.creationDate
  • selectedFile.modificationDate

We can also use these to show the selected file name in a text input.

onComplete will be called when the file has been uploaded

uploadListener.onComplete = function(){}

and the onProgress function is called while the file is uploaded to report progress

uploadListener.onProgress = function(fileRef, bytesLoaded, bytesTotal){}

We use that to make the progress bar and to show progress information.

Once we are set up and a file has been selected, we can call upload (most likely from an “upload” button):

uploadSwf.upload("upload.cfm");

We could append some variables to use in the action page.

uploadSwf.upload("upload.cfm?fileId=1");

We could also add a “Cancel” button with the following code to cancel the upload:

uploadSwf.cancel();

A live example
Download the source

Category: CFForm | ColdFusion |

128 Comments so far

Write yours
Michael Tyler
1. Michael Tyler wrote on August 12, 2005 at 8:42 PM
How could I reset the fileNameField value?

Whenever i upload a file, I am able to hit upload again and it will reupload the file again, and I can keep hitting the upload button over and over, and keep uploading the same file.
I managed to reset the text under the
attributes.progressInfo>uploadListener.onComplete = function()

with:

fileNameField.text= "";

but not the actual file value. I tried using a normal reset function, but it seems to not work.
Tried setting the selectedFile.name=""; as well.

any suggestions?
Seth Wilcox
2. Seth Wilcox wrote on August 12, 2005 at 9:33 PM
Is there any way to get the full file path, so the image can be previewed before it is opened?
Dyllan
3. Dyllan wrote on August 12, 2005 at 10:33 PM
Is there anyway to add aditional POST data to the url?
Laura
Michael,
You can disable the upload button if you want to force them to choose another file before they upload again. I did that in the post: http://www.asfusion.com/blog/entry/showing-an-image-after-upload

Seth,
No, Flash 8 does not expose the full path for security reasons.

Dyllan,
No, as of now, only GET data can be sent to the action page.
Anonymous
5. Anonymous wrote on August 12, 2005 at 11:10 PM
Micheal,

I had this problem when I was using static variables anywhere in the chain. Are you binding to static vars anywhere?
Dyllan
6. Dyllan wrote on August 12, 2005 at 11:46 PM
Laura,

I have been unsuccessful in reading the GET data I send along with this. Would you be kind enough to post an example or give me some direction? Thanks!
Laura
Dyllan,
The only data that we can send is by query string:
uploadSwf.upload(&quot;upload.cfm?fileId=1&quot;);

In that case, we would receive a variable called url.fileId with value 1 in the action page (upload.cfm)

You can see an example of that in the post
http://www.asfusion.com/blog/entry/showing-an-image-after-upload
where I am sending the file name I want for the image.

Hope that helps
William from Nigeria
8. William from Nigeria wrote on August 13, 2005 at 12:03 PM
Hi guys, this is kind of off this subject. I want to know how you can use Flash and ColdFusion only (without using cfform) to upload a file. I saw an example of how flash upload can be done with php. Can anyone please tell me how to a flash upload can be done using coldfusion.

Justin
9. Justin wrote on August 15, 2005 at 8:39 AM
Is there a feasible way to upload multiple files (.jpg) by allowing a user to browser to a folder and upload it, but yet all file names would be intact. Basically uploading multiple files through folders.
Giancarlo Gomez
I want to completely disable the upload form and close the window I open it in after completting the upload. I love the progress bar and once the file is uploaded completely I wan't the window to close. Or at least how to disable the browse button after completion. I disabled the upload on the onCompletion function but when I try to disable the Browse button it doesn't allow.

I did the following:

   uploadListener.onComplete = function()
   {
   <cfif attributes.uploadButton>uploadBtn.enabled = false;</cfif>
   }

What can I add to disable the browse and display a close window button or automatically close the window?

Thanks
JC
Justin Cook
12. Justin Cook wrote on September 01, 2005 at 12:03 PM
I am getting an HTTP 404 error. Would anyone by any chance have an idea why this would be the case? I am working on a tight development schedule and I want to use this tool, so anyone's help is much appreciated.
Laura
Justin,
You would get a 404 if the upload action does not exist. In the post example, the page that receives the file and handles the upload is called &quot;upload.cfm&quot; and it's located in the same directory as the cfform. You should change it according to your own page name and directory structure.
Justin Cook
14. Justin Cook wrote on September 02, 2005 at 6:55 AM
Laura,

I have done that. And after the file attempts to upload and the status bar says 100% complete, I get an error right under the status bar that says &quot;HTTP 404 Error&quot;. I have double checked my file locations and naming and everything appears to be correct. Could there by any other answers?
Justin Cook
15. Justin Cook wrote on September 02, 2005 at 7:21 AM
Laura,

I tried moving both the upload.cfm and the flashupload.swf into the folder where my index page is at rather than moving things around like I tried to do. This took care of the 404 error, but now I get an HTTP 500 Error. Any clue on why I would get the 500 now?

As for the 404 error, do you think moving the files solved that problem? Where in the code would one have to change in order to point to a different folder?

Thanks,
Justin
justin
16. justin wrote on September 02, 2005 at 7:34 AM
A http:// 500 error is a server error. Your server has encountered a unexpected condition that prevents it from fulfilling the request. This is a mapping or setting issue of your files, or on ColdFusion. This should not be client side. Usually this error is not specific, so check your flog for more detail.
Laura
Justin Cook,
404 means file not found, therefore moving your files definitely solved your problem. If you do not want to have them in the same directory, make sure you put the correct path to the upload file (I would even recommend to use absolute path, /mydir/upload.cfm)

Regarding the 500 error, it is difficult for me to know what your problem is, but as some other person suggested, make a test.cfm file with the following code (change upload.cfm in the action attribute if your upload action page is named differently):
<form action="upload.cfm" method="post" enctype="multipart/form-data">
<input type="file" name="Filedata"><input type="submit" name="Upload" value="Upload">
</form>


Run it, try to upload something and see what happens. For the most part, that is what Flash is trying to do, so you will see the same error Flash is getting and it will help you understand the problem.

Hope that helps
Steven Ross
anyone tried this out with cflogin? I can't get it to work since the state isn't maintained in flash (I'm guessing).

any thoughts?

-Steven
James Spivey
19. James Spivey wrote on September 14, 2005 at 2:17 AM
Little but simple, but im lost, is there a way to pass a variable from a query to the upload script so that once its been uploaded it will rename it to something dynamiclly stored rather than from the staticly defined variable in the cfsavecontents. I dont know how to referance variables inside javascript/actionscript. I would add it to the action page, but as you said before, there would be no way to get the filename back from the server so it needs to be passed before hand. Thanks!
Steven Ross
James,

They have an example of what you are talking about on the entry where the photograph is shown after upload.

http://www.asfusion.com/blog/entry/showing-an-image-after-upload
James Spivey
21. James Spivey wrote on September 14, 2005 at 5:16 AM
I saw that but the problem is the variable i want isnt coming from the form. Should i just add a hidden form field that will define the variable so that the script can add it that way or is thier a way to define a variable from a query and refrance it. They use "uploadSwf.upload("upload-image-action.cfm?id=" + myform.id + ".jpg");" but what if i want something like "uploadSwf.upload("upload-image-action.cfm?id=" + DUID + ".jpg");" where du id is the field name from a query. It doesnt work, so i must be doing something wrong. Is it as simple as queryname.duid? Thanks
Laura
Steven,
That is a bug in the player. At least in our experience, it only happens in Firefox, not in IE.
We have logged it during the beta but it has obviously not been fixed in the final release. I've tried appending the necessary variables (cftoken/cfid or jsessionid) but it passes "some" wrong variables that overwrite the query string. The behavior is quite strange.
I think the best is that every person that experiences it reports it to Macromedia and maybe they will see a need to fix it.

James,
Yes, add the value you need into a hidden field
<cfinput type="hidden" name="duid" value="#queryname.duid#" />
what's important is that in order to access that hidden field you need to write theNameOfYourForm.duid

uploadSwf.upload("upload-image-action.cfm?id=" + theNameOfYourForm.duid + ".jpg");
James Spivey
23. James Spivey wrote on September 14, 2005 at 11:50 PM
Hey Laura, thanks for the prompt reply, as with all my other questions, that isnt working for some reason. I added it exactly as you have it and its just ignoring the id and uploading and naming the file "undefined" less i hardcode it into the script then it names it properly. No clue why, probably my server again (im moving servers since this one clearly isnt good, its owned by my school). My last question for you is simple, is there a way to display the file size in megs rather than bytes? Or is this to complicated to get it to code sizes below a meg? Thanks!

James
Ps. Sorry to bother you so much on these snippits.
Mark van Beek
Hi,
Great stuff here i keep coming back on a daily basis there is a lot to learn. My question: Is it possible to upload multiple files instead of just one?

thanks
Nahuel
Mark,
Yes is that possible but not in this example. We are planing to make an example when we get a chance.
Steven Ross
Thanks Laura, I didn't even consider it could be a bug in firefox. I have noticed that there are a few issues with flash and firefox (forms get out of synch with cursor &amp; cut and paste weirdness).

I'll give it a shot with IE. Thanks again.
Mark van Beek
Nahuel,
Thanks for your vivid response. Indeed its possible to upload multiple files. MM help reference is doing a good job here. a search for filereferenceList did the job. This is cool stuff guys.

Justin Cook
28. Justin Cook wrote on September 16, 2005 at 8:51 AM
Laura,

I finally got back to working on the Flash 8 upload. I tried your suggestion about trying the upload as a ColdFusion form upload, not using Flash, to see if I get the same HTTP 500 Error. I do not get that error, in fact, it uploads completely successfully.

Would you or someone out there give me some idea why I would get the HHTP 500 Error with the flash form upload but not with the normal CFML form upload?

Thanks,
Justin
Justin Cook
29. Justin Cook wrote on September 16, 2005 at 9:21 AM
I believe I found the cause of the HTTP 500 Error. Apparently when you specify the "accept" attribute for the MIME/Type it throws this error. Anyway to specify which file types you'll accept upon upload to make sure that someone doesn't upload a malicious file?
Justin Cook
30. Justin Cook wrote on September 16, 2005 at 3:15 PM
Do you all have a way yet to upload multiple files at once? I read someone's post where they mentioned "filereferenceList", is that an answer and where can we find that?

Also, just curious, I have up to four images that will be uploaded that will go along with a particular article. Any ideas on how I can make sure those images are related to that particular article? This is especially a problem right now for me if I have to load one image at a time.

Thanks,
Justin
bujji
31. bujji wrote on October 01, 2005 at 12:38 AM
I want a Flash File which uploads an image selected from
local HD to a server.
The kind that is in
http://www.asfusion.com/blog/examples/item/file-upload-explained

When I had downloaded the source files,they are not working for me.I don't know where the problem is.I really know nothing about Cold Fusion.
Can you help me please..?Why the "fileUpload.swf" is not showing anything to me?

Laura
bujji,
the source files should work as is. I would say that you may not have Flash Player 8. Also, does any other flash form work for you?
fileUpload.swf does not show anything because it only contains an ActionScript library to use in the flash form.
Mike Kelp
33. Mike Kelp wrote on October 05, 2005 at 12:27 PM
As an addendum, I would suggest adding a random value to the query string when refreshing the image display for replacing an image because browsers have a habit of caching.

This way, the browser believes it is a new image address every time and doesn't show the old image.
Don
34. Don wrote on November 12, 2005 at 5:19 PM
I'm still not understanding all of this. The program itself works great, ive conbined it with cfx_jpegresize, add the filenames to the dbase, everything except be able to pass another variable from the flash uploader across so at the same time I add the filenames to the dbase I also can add a comment associates with that file im uploading. Can anyone please help me on this?
Laura
Don,
You can only send variables via query string. Otherwise, submit the form for the other fields.
Michael Tyler
I have another question:
In the browse button, you have it only lookign for image files, that is edited in the <cfsavecontent variable="browseScript"> function.

How could I do the same thing outside of this example? I am trying to have that same function in a regular form, and I believe it is possible. Yet I cant find any info on how to make the browse dialog only show specified extensions, rather than all files.

Any idea?
Nathbot
37. Nathbot wrote on November 21, 2005 at 4:51 AM
Hi everyone,

as I was trying to add some actions when my upload is completed, I found a weird behavior...

I want to add a row to a datagrid when a file is uploaded. So i have something like that:

uploadListener.onComplete = function()
{
output.text = "Upload complete";
//here my code to add a row
}
The first time it works fine.
But if I upload another file, the onComplete function is run 2 times (I see that cause 2 rows are added to my grid). If I upload a third file, it is run 3 times, etc.

How weird is that :)
Have you ever seen that before?
Laura
Micheal,
You mean filtering the file types in a regular file upload?

Nathbot,
That is a known bug that we have in all the file upload examples. It happens because a new listener gets added every time the browse button is clicked. Nahuel told me that he was going to fix it, but he's been very busy... :)
Neill
39. Neill wrote on December 08, 2005 at 3:37 AM
If nameconflict is set to makeunique how do I retrieve the new file name?
Laura
Neill,
There is no way to get anything back directly. You need to know the new name in advance or do something else such as store it in a db or whatever. I think I have an example of renaming the file in the downloadable zip in this post:
http://www.asfusion.com/blog/entry/showing-an-image-after-upload

Neill
41. Neill wrote on December 09, 2005 at 4:20 AM
Hi Laura,

Thanks for your reply.

Have just changed nameconflict to skip and added a directory check and overwrite prompt to the custom tag.
Steve
42. Steve wrote on January 10, 2006 at 8:24 AM
Has anyone had any problems using this with Firefox? The supplied script works fine in IE but in firefox it does not place the file in the destination. It says all is ok and the file is uploaded but nothing is stored.

Any way around this?

Steve
Michael White
Steve, I had Firefox 1.07 and couldn't make this work either so I upgraded to Firefox 1.5 and it didn't make a difference. I looked at the mozilla help site and there are few entries about flash conflicting with ActiveX but I don't know of a good way around the problem.
John
44. John wrote on January 23, 2006 at 5:46 PM
Can I get the FLA of fileUpload.swf

Here is what I am trying to do.
May be someone can help me with it.

I want the same progress bar, but I am going to be uploading videos onto my website.
After the file gets uploaded I want to convert the video into flash. And so I would like to tell the user through the progress bar, how far it is not only form being uploaded but from being converted as well.

Let me add to this by saying if anyone know of a good way of converting AVI/MPEG/MOV into flash on the fly, right after a user uploads the video
I'd really appreciate it.

So far I am just calling cfexecute to call a cammand line version from geovid.

What would be greate if you could do this through action script.
Matt
45. Matt wrote on February 25, 2006 at 9:47 PM
Hey John, could you help me with the command line coldfusion script with the geovid software? What is the cfexecute command supposed to look like? Have you figured out a way to convert video files to FLV using actionscript? Thanks!
kevin
46. kevin wrote on February 26, 2006 at 10:49 PM
ON2.com FLix Engine To encode video to flv/swf
Richard Zhu
47. Richard Zhu wrote on March 10, 2006 at 12:36 PM
Laura,

When I try your code at my local develop machine, it works fine but, when I put code in product server, it through 'IO Error' on me. Any idea?

thanks,
David
48. David wrote on March 12, 2006 at 5:04 PM
Hi all,
this may seem like a dumb question but i want to double check as my attempts have failed. If i had an images table my database that related to the image files, wouldn't i place the insert/update code in the upload.cfm file? i've tried this using my DAO but i just get a http 500 error. The image still updates fine, and if i take the script that updates the database to another page it processes fine, so i must be missing something within the custom tag. Any suggestions would be greatly appreciated!
thanks again,
David
machu
I created an upload form for a client who needs to uplaod very larg files (~150MB) and he doesn't want to use ftp - go figure...)
Whenever I try to upload a file that is over 100MB, I get an IOerror right after progress shows 8.5MB. I tried that with many file types and the error always happens there (between 8th and 9th MB).
I have no problems uploading 'smaller' files (largest size I was able to upload was 85MB) - it looks like the problem exists only with files which are over 100MB!
Is there a way around this sproblem. I spent a lot of time on this project and at this time the client refused to pay since his main requirement is not acomplished. Any help would be appreciated.
MrBurns
50. MrBurns wrote on March 21, 2006 at 12:16 PM
Anyone having issues with the &quot;Choose File&quot; button?

I've tried the tag on two seprate installations of MX 7 on Win2003(also from to different workstations using flash 8) and still no response from clicking the &quot;Choose File&quot; button.

Flash loads up nice and the &quot;choose file&quot; button highlights but no response after that.

Any Ideas?
Christian K.
Is it possible to get this tag work on MX6.1 ? Thanks for any information on that. Personal offer for that deployment is ok. Thanks a lot.
Laura
Christian,
The tag will not work because it uses Flash Forms, which were introduced in CF 7. If you want to use the Flash 8 uploading features, you will have to go to plain Flash. Check this post: http://blog.oinam.com/archives/2005/08/flash-8-file-upload-download/
Zharzone
53. Zharzone wrote on April 08, 2006 at 2:37 PM
If you read carrefully the Flash Help you will see that Flash's FileReference class limits upload to 100mb per file. So there is no workaround, I am sorry.
Michael White
I use three different Coldfusion MX 7.01 servers on Windows 2000, IIS 5. I have an application that uses Flash forms based on all the articles here since the first flash form contact application. I have used the three articles on flash form uploading to develop a file upload function that works perfectly on 2 of my 3 servers. On the actual production server the upload form does not display. when I turn on debugging the error is &quot;string literal not properly terminated&quot; and gives me 14 line numbers in the msxml file. I have patched all three servers the same (as far as I can tell) and the application files and database are identical. What could be my problem on the production server?
machu
55. machu wrote on April 12, 2006 at 7:20 AM
This is my final comment on Flash Upload: It is completely pre-mature technology and I strongly suggest not using it in production environment.
After having it in production for couple of weeks I must pull it down. Upload works great when you upload small files, but whenever you try to upload large files (up to 100MB) there is no guarantee that upload completes. I get complaints from my customers every day! - 10 to 20% uploads throws an IOerror sometime during the upload - it's ridiculous!
When I test it, I can upload a 30MB file couple of times without a problem, but on the next try it errors out - there is no rule on when or how it happens. BTW, I tried to find any info on IOerror and how to recover from it...no luck!
bswank
56. bswank wrote on May 16, 2006 at 7:56 AM
Has anyone *ever* gotten this thing to work in any useful way? I see tons of posts describing bugs, problems, errors, and complex workarounds. I've spent 3 days trying to incorporate this into a real-world application and it's been nothing but a mess.
Michael White
The Short answer is Yes: I have it working in a coldfusion application at work using this code in combination with code in comments and examples to allow a user to upload a word or pdf document up to 800k in size to a special folder on the server's D: drive (outside the webroot) that saves the renamed filename to a database which I query later to download the file.
Joshua Scott
Laura,

I have a question. I have the example uploading... kinda.

When I choose a file I get "undefined" for the file name and in the details I get:

Name: undefined
Size: undefined bytes
Type: undefined
Creation Date: undefined
Modification Date: undefined

What am I doing wrong?

Thanks so much for the great code.

- Josh
Joshua Scott
While I am waiting for an answer, I have one other question.

If I want to run another routine after the file is uploaded like... resizing the image or something. Is there a call or something I can listen for that would let me know the upload is complete and then I could call a program like alagad image or something like that to do the image resize?

Thanks,

Josh
Laura
Joshua,
I would run that right below the file upload (after cffile). Otherwise, you can also do stuff by implementing the onComplete function (see post), but in order to communicate with the server there you either have to use remoting or submit the form.
Harold
61. Harold wrote on June 01, 2006 at 2:32 PM
Is there a way to pass a form field to the upload.cfm page while uploading the file? I need to pass a value from a CFSELECT tag.

Thanks.

Harold
Christian
You might do that by a get; it´s the only way we triggered out. The fileUpload is starting a new browser-session in the background (check your session-management for that!); because of that you might give all necessary infos into a url for the get_upload.script.
Christian
sorry for my first information. You won´t get the forms posted at the same time; because of that we realized a form in flash with the selectbox inside, which we transfered by get during the file-upload.
Sean
Hi Laura,

Just have a quick question. How would you go about uploading a file out of flash using a cfc?

I've run into errors due to the remoting content-type being application/x-amf instead of the required octet-stream. I currently have a separate script file that does the upload. The issue is that the record is being inserted into the db within the cfc script while the file name is set to makeunique when uploaded. Of course, if the file is renamed, the cfc is not aware of this and the original file name is inserted into the record. Perhaps I should have the upload script query the same table using @@Identity and comparing the server file name with what is in the table.

The web site I listed along with the post is the app I'm working on. If you check it out go to 'candidate registry' and click 'register' on the next screen.

Thanks so much for any tips!
Sean
Laura
Harold,
See my replies:
http://www.asfusion.com/blog/entry/file-upload-explained-and-expanded#comment-1378
http://www.asfusion.com/blog/entry/file-upload-explained-and-expanded#comment-1381
http://www.asfusion.com/blog/entry/file-upload-explained-and-expanded#comment-635

Sean,
The upload is done via a form POST (done by the Player), so it is not via Remoting (amf). When you do the upload (say it is upload.cfm), you can do other things there, such as calling a CFC that does some processing. We've done that in the Flex version of the real estate application. In that case, we resize the image, but you could insert things in the database or do whatever you want to do. Although it is not the best solution, it is the only way of doing with the current implementation of the upload in the Flash Player.
Michael White
66. Michael White wrote on June 20, 2006 at 8:30 AM
I have all this working great on my development web server but the production webserver has a security requirement that I have to use a certificate and the protocol has to be https:// (encrypted). I have found out today that I cannot upload unless I use http:// is there an easy (or any) way to fix this?
del
67. del wrote on June 28, 2006 at 11:25 PM
Hi all,
I using filereference with PHP and asp.net. With PHP, working very fine. In asp.net, locally working fine but on deplyoment server, itz behaviour becomes bull shit. The same file gives, 500 error or io error. post data size and upload size on server is enough but....BUT....dz anyone help?
Laura
Micheal,
There were issues with https (http://www.powersdk.com/ted/2005/11/using-flash-player-under-https-with.php), but it is not impossible. Have you tried adding the port to the file upload path (https://www.example.com:443/upload.cfm)?
Michael White
69. Michael White wrote on July 06, 2006 at 7:02 AM
Thank you very much for the reply and link, Laura. I have a line that looks like this:
   uploadSwf.upload("https://jobs.lansg.com:443/HR/ResumeUploadAction.cfm?resume="; + myform.ContactID + myform.FileExtension);

I get no errors but I get no file either.
the link you supplied me was helpful but I don't know anything about implementing crossdomain.xml or the loadpolicyFile he talked about: I got a 404 error browsing to it. Can you give me pointers on how to use this info? (System.security.loadPolicyFile('https://flexdemos.cynergysystems.com/support/crossdomain.xml');)
Laura
Michael,
What I would do first is to use Fiddler or similar to see where the upload is trying to get posted and see if I get any errors there. By the way, I think you have a semicolon that shouldn't be there before the + sign.
Regarding the crossdomain.xml file, see this technote: http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=tn_14213
Laura
71. Laura wrote on July 06, 2006 at 2:58 PM
Michael,
Nevermind about the semicolon, I think it got there because of the automatic linking.
Rt
72. Rt wrote on July 13, 2006 at 12:09 PM
Hi,
I am trying to get the file upload in flash working.It works only for some types of file extensions like .txt,doc,.xml but when i select an image or a file with extesion .xls,the filesize is returned as zero and as a result the upload script never gets called.
Any help would be greatly appreciated
Thank u so much
Laura
Rt,
Can't really help you with the info you give. Are you sure it doesn't upload "any" image? Maybe the directory is not accessible, I don't know. Also check what extensions you are allowing in the code.
Ness
74. Ness wrote on July 20, 2006 at 1:24 PM
Hi, im so new in this, and i have a question, maybe will be stupid, why the files have the extension "CFM" do i have to install something on my server to make it work? the server must have that service. ThanKs, im sorry for taking ur time. really sorry
Angel
75. Angel wrote on July 21, 2006 at 7:00 PM
Hi i got it to upload pictures fine, but when it finishes uploading the file i need to <cflocation url=""> out of there to another page i did this doesnt work

<cfif attributes.progressInfo>uploadListener.onComplete = function()
{
output.text = "Upload complete";
"<CFLOCATION URL="anotherpage.cfm">";
<cfif len(onComplete)>#onComplete#();</cfif>
}   

Any ideas?
i also tried this
<SCRIPT language="JavaScript"> top.location.replace("http://www.yahoo.com";);</SCRIPT>
Angel
76. Angel wrote on July 27, 2006 at 5:02 PM
Hi still having trouble cflocationing out of there once the image is uploaded if anybody could copy paste some code i'd appreciate it.
Laura
Ness,
It's ColdFusion code (.cfm file extension), therefore, your server needs to have ColdFusion 7.01 or above to make it work.


Angel,
I think you are mixing up the code of the custom tag with this code. If you use the code in this post, create an onComplete function (you can't use CF or javascript inside ActionScript code):
uploadListener.onComplete = function(){
_root.getURL('address where you want to go');
}
Kevin Jason
Hi Laura -

Similar to others, I have come across an "IO Error" issue when using the file upload from different work stations. The odd thing is, I'm using the same browser, files, and code...but run into the "IO Error" on some work stations and not others. The file sizes are all less than 2-3KB. Is there some file or files that are needed that may not be downloading properly to certain workstations? (I'm out of other ideas)

Thanks in advance,

Kevin
Keiko
79. Keiko wrote on August 10, 2006 at 5:37 AM
Hi Laura,

I have 2 pages (page1.cfm and page2.cfm). I put your fileupload component and a submit button in my first page. But I want the uploading take place only when it hits my second page (after I click the submit button). How to do about that? In your example, you call the uploading function when user click a button with onClick event in the first page.

Looking forward for your reply.

Thanks in advance
Keiko
Zeus
80. Zeus wrote on August 17, 2006 at 7:20 PM
Hi everyone,
I apologize for bringing problems and not solutions to this thread. I am working with a flash multiple-file uploader with a PHP server-side script. I can upload one large file (over 80 MB) or multiple small files ( less than 2.5 MB) with no problems. The problem comes when I upload two or more large files (over 8 MB). When I invoke the upload function, the computer freezes (actually freezes even the mouse) for about 10 min, then it would resume its operation and the upload process fails with this message “flash script running slow, computer might become unresponsive”. I have tried other flash uploaders found on the web, even the example in the Flash 8 help files, but I run into the same problem with multiple large files. Anybody ran into this problem before? Can anyone shed some light on this issue? Help is very much appreciated.

Z
chris
81. chris wrote on September 06, 2006 at 5:15 PM
Hi Laura,

I am having a problem using this with security on my site... It seems that if the upload.cfm page contains the below code the application makes it look like it is moving the file (the progress bar goes) but the file does not move... Any thoughts? THANKS! GREAT AP

<cfif NOT isdefined ("form.emp_usn") OR NOT isdefined ("form.emp_pwd") OR NOT structkeyexists(form,"Filedata")>
<cfif not IsDefined ("Session.authenticated")>         <cfinclude template="/loginform.cfm">
<cfabort>
</cfif>
</cfif>
myname
82. myname wrote on September 12, 2006 at 12:09 AM
Does anyone know how to do this with PHP?
Having Trouble.
Someone mentioned they had an example of how to do it.
George
I have the upload working fine. I have a grid and some fields to go with it. So an item in the grid gets selected and the fields get filled in with data. How can I have the cf-flashupload show the data like the other fields?
Laura
chris,
Unfortunately, in the upload action file, you only receive "Filedata" and no other field (see my comments on passing url variables as a workaround), so you cannot check for form.emp_usn for example. Neither you will achieve anything by cfincluding the login form since the upload happens "in the background". You will see the file uploading, but CF will not do anything with that data, since you have that <cfif>.


myname,
See my comment above: http://www.asfusion.com/blog/entry/file-upload-explained-and-expanded#comment-889


George,
If I understand your question correctly, you want to bind the grid data to the field? If so, the field that shows the file name is just an input field, you can use your regular binding. (Now that doesn't mean you will be able to upload anything that gets shown there, it's just a string in a text input at that point)
George
Laura,
You are correct in what I am asking.
I did try and bind like:
<cf_flashUpload name=ImageBottle actionfile="Upload" fileTypes="*.jpg" bind="{ProdList.selectedItem.ImageBottle}">
Im thinking this should show the name of the image that is being used. Its perfect that it wouldnt upload that then. I just want the user to see what image is attached to the rest of the data. Then make the decision to select a new image or just edit some of the text and update that. leaving the old image or changed to a new one. But I cant get the bind to show the file name in the input of the upload. Is my statement wrong?
Thanks
George Smith
Laura,
Your the best! I have all working perfect.
20 form fields 8 browse fields (bound to my grid), Add, Edit, Delete. So Great!
Laurent
87. Laurent wrote on November 11, 2006 at 2:29 PM
Laura, Michael,
It seems I experience a problem about uploads over SSL on Firefox. I've tried many combinations of the cross-domain file and still have I/O error. On IE everything is OK... Have you found something that could help me ?
Thanks for your answers
js
I had a problem with uploads working in IE but not Firefox. It turned out that I had to do this:
actionFile="yourUploadFile.cfm?urltoken=#SESSION.urltoken#"

In Firefox it creates a new session when it goes to yourUploadFile.cfm, but in IE it preserves your current session. Hope this helps.
Laura
js,
I posted a similar solution at: http://www.asfusion.com/blog/entry/file-upload-with-coldfusion-flash-forms#comment-253

I would use the hidden field as described there, otherwise, your form will recompile for each session created, as in your version, it would create different ActionScript code whenever session.urltoken changes.
Todd
90. Todd wrote on December 01, 2006 at 7:49 AM
This form work great on my development server which uses the standalone cold fusion web server, but on my production box which uses IIS 6.0, cold fusion 7.02, and active directory for authentication I am having some problems. When I try to upload a file on the production box I am able to select a file and begin the upload. The status works and shows the file being uploaded up to 100%. Once it reaches 100% I am asked to login again to active directory. The file is never uploaded and if I try to close the browser (IE7 and Firefox) both freeze.

I can get a file upload to work using (this one works):
<cfif isdefined("form.upload_now")>

<cffile action="upload" filefield="ul_path" destination= "uploadspot" nameconflict="makeunique" variable="FileName">
<cfdump var="form">
</cfoutput>
</cfif>



<cfform method="post" name="upload_form" enctype="multipart/form-data" id="upload_form">
<br>
File Name: <cfinput type="text" name="FileName" id="FileName" size="150" width="100" required="yes">
<br>
<cfinput type="file" name="ul_path" id="ul_path">
<br>
<cfinput type="submit" name="upload_now" value="submit">
</cfform>


I am guessing this is a security issue but I am not sure where to look (IIS or Cold fusion)

Thanks in advance
Bacardi
91. Bacardi wrote on December 02, 2006 at 7:17 PM
For those asking about post data. Here is my crazy work around. The page refreshes, but it is still a fluid form layout with practical use. The URL string max's out at 255 characters and i am capturing comments that can be 400 char's.

I needed a form that captured user info along with photo.

In the upload script, check for the value of fileNameField, if it is empty, make a custom function call

var fileNameField = fileNameField;

if (fileNameField.text == '') {

_root.getURL("uploadNoPic.cfm?postData=" + myForm.postData,"_parent","POST" );
}

else {
   var uploadSwf = textArea.label.upload;
   uploadSwf.upload("upload.cfm?userid=" + myForm.userid);
   uploadBtn.enabled = false;
   browseBtn.enabled = false;
   }


At the bottom of the uploadListner.onComplete function add another getURL call such as:

uploadListener.onComplete = function()
{
var userid = myForm.userid;
output.text = "Profile Saved.";
uploadBtn.enabled = false;
browseBtn.enabled = true;
_root.getURL("completeUpload.cfm?photo_name=" + myForm.fileNameField + "&userid=" + myForm.userid + "&postData=" + myForm.postData,"_parent","POST")
      
}


I did need to reference the file uploaded with the data posted later and that was done using a temp table in the db and a hidden field on the form.

The initial upload saves the picture and writes file name and user identifier that is stored in the session as a record in the temp table.

The getURL call in the complete function calls an action page that queries the temp table for the filename and user id match.
Then inserts into actual table the complete record with post data, photo name, and userid. It then deletes the temp record and cflocation redirects.

Pretty off the wall hack, but it works for the time being.

Bacardi
Bacardi
92. Bacardi wrote on December 02, 2006 at 7:47 PM
Hi all,

Has anyone figured out the rhyme or reason behing the IOError?
Sometimes I get them and sometimes I don't and I haven't been able to identify any one thing that I'm doing differently from one upload to the next.

TIA,

Bacardi
Rod
93. Rod wrote on December 15, 2006 at 8:30 AM
Ok Getting the 404 error issue... here's the scenario.

I have a fuse box application. Multiple tab navigation flash form. the code i am using is strait forward.

<cfformitem type="text" style="fontWeight:bold">upload</cfformitem>
<cf_flashUpload name="defaultFile" actionFile="user/upload.cfm" swf="user/fileUpload.swf">
<cf_flashUploadInput />
</cf_flashUpload>

The uploader brings up the dialog box and locates the file fine, but when submitted I get the 404 error. I have read every post on this issue and tried every option I can think of.

1. Placing the upload.cfm file in the root directory of the fuseapp next to the index file.
2. placing the upload file in the parsed directory (just thought i would try.
3. using /user/upload.cfm
4. using user/upload.cfm
5. upload.cfm

I even took the full example folder that i downloaded from you and tried it as it was (that worked fine) so i know it is not your issue, but i am not getting it to find the upload file.

Any help would be greatly appreciated!
stuart
Here's an example of one of our websites in which file upload is used successfully so users can each have their own image library's www.myheadspace.org/flash : I carry additional data into the session by first pre-flighting the image, i.e. doing a POST that tells the back-end to expect an image and places a row in the database for it with any extra data i send, this returns the DB row id back to flash that then appends this onto the end of the 'upload' GET string, thus linking the image to that user/session. Any messages during upload or image verification after upload are stored in a db table under the same id, so after the upload is complete flash checks the table for its message of either 'upload commplete' or whatever error there was i.e. 'wrong filetype' 'file too big' etc. You'll have to register with the site to try it and then try uploading files in your profile where you can re-size them, move them etc.
sandro
95. sandro wrote on March 02, 2007 at 7:31 PM
Hi.
I upload correctly a file but i want store also kb dimension in a database table.
How i can do it ?
thanks
Dave
96. Dave wrote on April 01, 2007 at 11:20 AM
I'm new to just about everything - coldfusion, flash and actionscript. I done a little bit of coldfusion programming and have some background in Perl. I need to be able to post the filename (and file size) of the file that's selected to a database. How can one get the value of the selected filename from the actionscript/flash code out to a coldfusion variable? A sample of how this is done would be greatly appreciated. I know this was asked before but I didn't see any code that illustrated how this was done.

TIA
Don
97. Don wrote on April 09, 2007 at 1:32 PM
Any intranet security issues with using this fileupload? The progress bar instantly goes to 100%, then I get prompted for a network login. The file does not upload at all.

Upload.cfm works fine with a ColdFusion/html form, but not this flash form. There is no login prompt.

What would cause it to go immediately to 100% progress bar and require login?

Thanks,
Don
kalai
98. kalai wrote on April 12, 2007 at 2:34 AM
Hi,

I've an issue. I've a flash uploader to upload multiple files(pdf, doc) to a folder in the server.The upload is working fine. I want to download the files to my desktop using the core ftp. But, I see the permission of the folder as 600 and I cannot download them to my pc either. So what's wrong and how to fix it??
Lance
99. Lance wrote on April 18, 2007 at 3:09 PM
I am having the same problem as MrBurns. The Choose File button works fine by itself in the example code, but when I try to implement that same code into an existing application, it does not work.

The app is a Fusebox application, but that really shouldn't matter. I have spent a lot of time on this and still nothing. Other events on the button work, such as GetURL(), etc.--just not the browseScript. Someone please help if you have an answer!

Thanks in advance.
Manuel Roque de Jesus
Hallo, very ood work,
i try to use your source, but my browser brings always the error "lc_id" is undefined on line 26 ???
any idea what this mean?

Thanks in advance.
Laura
Sandro, Dave,
See documentation on cffile action="upload". You will get the uploaded file name, size, etc, such as cffile.fileSize You'll get that information in the upload.cfm file right after using cffile for uploading.

Don,
Authentication does not work with flash upload. If you use browser prompting authentication, flash upload does not support it. I don't think you use some kind of redirection to a login form, but that doesn't work either, since flash calls this file in the background.

Lance,
Make sure the path to the upload swf file can be loaded. Use absolute paths when in doubt (ie: /myassets/fileUpload.swf)

Manuel,
See this:
http://www.asfusion.com/blog/entry/file-upload-with-coldfusion-flash-forms#comment-1795
Don Kerr
102. Don Kerr wrote on April 26, 2007 at 9:53 AM
Laura, Thanks for your reply on the authentication issue. Let me back up a step and ask How should security be setup to get file upload to work? Is it a Windows folder permissions issue?
If I know what it takes to make it work, then I can change my security setup accordingly. I'd appreciate any further assistance.

Don