Tuesday, December 15th, 2009

Downloadify – create downloads on the fly without server interaction

Category: Flash, JavaScript

Downloadify is an interesting solution to offer files as downloads without having to create temporary files and loop through a script that sets a force-download header.

As shown in the demo page offering a file for download and setting its content is as easy as this:


  1. Downloadify.create('downloadify',{
  2.   filename: function(){
  3.     return document.getElementById('filename').value;
  4.   },
  5.   data: function(){
  6.     return document.getElementById('data').value;
  7.   },
  8.   onComplete: function(){
  9.     alert('Your File Has Been Saved!');
  10.   },
  11.   onCancel: function(){
  12.     alert('You have cancelled the saving of this file.');
  13.   },
  14.   onError: function(){
  15.     alert('You must put something in the File Contents or there will be nothing to save!');
  16.   },
  17.   swf: 'media/downloadify.swf',
  18.   downloadImage: 'images/download.png',
  19.   width: 100,
  20.   height: 30,
  21.   transparent: true,
  22.   append: false
  23. });

As you can see you have callbacks for all the possibilities and several parameters to style the flash movie overlaying the real “download this” button. The only issue I can see is that it doesn’t work by sending the form via keyboard. This needs fixing.

Posted by Chris Heilmann at 8:54 am

3.5 rating from 27 votes


Comments feed TrackBack URI

Flash. Bleh.

Comment by kea — December 15, 2009

Flash. Bleh.

Comment by jx12345 — December 15, 2009

Hey guys, super excited to see Downloadify posted here on Ajaxian.

@kea Currently, generating and saving files in the client side is not available through any native cross-browser APIs. Flash is the only way something like this becomes possible. As much as I also dislike Flash, this is the only way to do client side file generation currently.

The only issue I can see is that it doesn’t work by sending the form via keyboard. This needs fixing.

@Chris, there is no way to trigger Flash to start the save process from outside the Flash document per the Flash Security Restrictions. Just as the “Full Screen Mode” must be triggered in direct response to a users’ action inside the Flash file, the download dialog (which in turn calls JavaScript for the data) must also be show in direct response to a user clicking inside the Flash document.

Comment by dcneiner — December 15, 2009

“Flash. Bleh.” ?

If it were pure Javascript, we’d still have people complaining that it doesn’t work Javascript disabled.

Anyway, I think it’s pretty handy, especially if you tie it into your analytics code to track the downloads as a custom event. Saves you the effort of writing a download-counter PHP script.

Comment by Liquidrums — December 15, 2009

Zealots, Bleh.
Blinkers, Bleh.

Comment by Chris Heilmann — December 15, 2009

@dcneiner :

You don’t need flash to generate a file to save. Use data uri’s or document.execCommand.

Comment by TNO — December 15, 2009

TNO ftw.

Comment by eyelidlessness — December 15, 2009

@TNO But you are plagued with limitations and browser differences using those methods. Additionally there is no option to pre-fill file names and file extensions, and it will require additional steps required by the user, etc. Maybe in a few years things will have evolved to where that would be really useful. Here’s hoping it happens sooner than that!

Comment by dcneiner — December 15, 2009

Nothing wrong with Flash as a supporting tool at all.

Comment by Darkimmortal — December 18, 2009

Leave a comment

You must be logged in to post a comment.