Question

I’m using https://github.com/blueimp/jQuery-File-Upload to upload files to S3 on my Rails app (Installed this gem: https://github.com/tors/jquery-fileupload-rails).

This is my form. As I just need the file uploaded and create the document later, it is not a form_for.

  <%= form_tag 'Bucket URL SNIP', :multipart => true, :id => "fileupload" do %>
  <%= hidden_field_tag 'key', @token %>
  <%= hidden_field_tag 'AWSAccessKeyId', ACCESSKEYSNIP %>
  <%= hidden_field_tag 'acl', 'public-read' %>
  <%= hidden_field_tag 'success_action_status', '200' %>
  <%= hidden_field_tag 'policy', controller.s3_policy_document %>
  <%= hidden_field_tag 'signature', controller.signature %>
  <% end %>

And the jQuery uploader is initialized like this:

  $(function () {

      $('#fileupload').fileupload({

        forceIframeTransport: true

      });

  });

Everything works, I see the UI, but when the file’s progress bar finishes, it gives me an error and the file doesn’t actually get uploaded.

TypeError: iframe is undefined. (Firefox)
TypeError: TypeError: Cannot read property ‘0’ of undefined (Chrome)

What could be the problem?

EDIT:

Looking at the Javascript console, I get an error like this (replaced the real addresses):

Unsafe JavaScript attempt to access frame with URL BUCKETURL from frame with URL SERVERURL. Domains, protocols and ports must match.

Answer 1

I recently wrote a short tutorial about how to upload directly files to s3, hopefully it’ll help you :

http://pjambet.github.com/blog/direct-upload-to-s3/