Article / February 27, 2009

Updates on Rails S3 Flash upload plugin

S3 flash upload is a rails plugin which allow user uploading a file to your S3 bucket directly, so you can save the cost of forwarding file to S3 in your app side, according to users' feedback, we did some updates on it recently:

  • Simplified the API to make it easy to use.
  • Add two rake tasks to create S3 bucket and upload crossdomain.xml

Install

$ script/plugin install git://github.com/elcgit/s3-swf-upload-plugin.git

Usage

1. To use it, you should first execute the generator.

$ script/generate s3_swf_upload

2. configure amazon_s3.yml, and run below two tasks to create bucket and crossdomain.xml:

$ rake s3:make_bucket
$ rake s3:make_crossdomain

3. init s3_swf object:

<%= s3_swf_upload_tag %>

4. when you click upload, your file will be upload to http://bucket.s3.amazonasw.com/s3_swf/ by default.

5. if you want to custom its behavior, here's a more complex example:

  <%= s3_swf_upload_tag(:width => 310, 
        :height => 40, 
        :success => 'alert("success");',
        :failed => 'alert("failed");',
        :selected => 'alert("selected");',
        :canceled => 'alert("canceled");',
        :prefix => 's3') 
  %>

Your feedback will always be appreciated.

Comments

Posted by jeff durand on 10 months agoB57c325ce65bd0018bf0836f2aab676d?s=30

Hey great plugin, appreciate all the work you've done and appreciate you sharing it with the rails community. I've got everything working perfectly as expected. There is only one thing I had a question with. What would be the recommended way to set the Content-Type on the upload? I want the files uploaded to be down loadable instead of playing or showing in the browser. With S3 if you set Content-Type to application/octet-stream you will get files to download. all I need to know is where in the code I should look.

Posted by Yuanyi Zhang on 10 months ago08d1e10c2007ab46a8fc69a41dae546c?s=30

Hi, jeff, good question, the content type is determined by file select control in the flash, and it will be sent to S3UploadsController in your rails app for generating signature, so if you like to customize the content type, what you only need to do is changing Line 11 in S3UploadsController, it should looks like:

content_type = params[:content_type]

hope this helps.

Posted by jeff durand on 10 months agoB57c325ce65bd0018bf0836f2aab676d?s=30

Thanks for the speedy reply. I tried changing what you suggest, but every time it uploads a file now it just returns an error. That's why I was wondering if there was some other place where this value is being used. I'm thinking that when I do what you described perhaps there is a difference in the post request and the policy that was generated...

Posted by jeff durand on 10 months agoB57c325ce65bd0018bf0836f2aab676d?s=30

figured it out for anyone that cares. If you want to make sure the mimetype is always "application/octet-stream" you have to open up

vendor/plugins/s3-swf-upload-plugin/flex_src/src/s3_upload.mxml

and change line 51 to

options.ContentType = "application/octet-stream";

and

line 82

variables.content_type = "application/octet-stream";

then compile and move the swf into your public directory.. Hope this helps other people..

Posted by Yuanyi Zhang on 10 months ago08d1e10c2007ab46a8fc69a41dae546c?s=30

Yes, you're right, only changing controller shouldn't work because the policy difference.

Thanks for your solution, Jeff.

Posted by Kelly Sutton on 10 months agoDcf5f7670ba6fc0596dba270049830df?s=30

Has anyone had any luck using two of these on the same page? I'm running into JavaScript funkiness and I don't know the source well enough to tweak it myself.

I'm trying to do something along the lines of:

<%= s3_swf_upload_tag %>
<%= s3_swf_upload_tag %>
(Obviously this is a really dumbed down version of what I hope to accomplish, but any pointers would be greatly appreciated.)
Posted by Yuanyi Zhang on 9 months ago46f61a8a15c5e234ad416b590a2676c9?s=30

Kelly, thanks for your comment, s3_swf_upload now is capable for inserting 2 upload tag in one page.

Posted by Martin Gregory on 9 months ago9a787d43b85c276d7dc64a8cb47b7bce?s=30

Is it possible to have the name of the file that the user typed passed out as a parameter to the callbacks?

My application needs to know the name of the file that the user uploaded!

Thanks!

Posted by Martin Gregory on 9 months ago9a787d43b85c276d7dc64a8cb47b7bce?s=30

Ah - on a more minor issue: how can I change the text of the prompt (currently it is Select the Select File Button...)

I tried editing s3_upload.mxml, but this didn't affect anything... obviously I have no clue about flash :)

Thanks!

Posted by Martin Gregory on 9 months ago9a787d43b85c276d7dc64a8cb47b7bce?s=30

Is it something as simple as

ExternalInterface.call(options.onSuccessCall, options.FileName);

at line 146 of s3_upload.mxml ?

Also, I'm curious why the code in this file seems to be calling the success callback if the user did not select any file (code around line 50)

// return if user not selected any file
if (options.FileSize == null) {
trace(options.onSuccessCall);

ExternalInterface.call(options.onSuccessCall);
return;
}

Posted by Nick on 9 months agoF625094ab6b81fc89f831ce8bcdbf6a0?s=30

Is it possible to modify the look of swfupload? I tried editing the mxml file but no luck. I just want to be able to turn the background white? Do I need to recompile the swf?

Posted by Daniel Lv on 9 months ago746dc8d29c1d60532fcc948f3eafe5a9?s=30

Hey, Nick,
Yeah, you must recompile mxml file after the editing. if you are using "Flex Builder", the progress of recompile would be very easy :-)

Add a Comment