Amazon s3 file upload to bucket not redirecting after success

Question

I've been working on uploading files directly from an html form to an Amazon S3 bucket and have gotten it working, but it is not redirecting after a successful upload. I'm sending the 'success_action_redirect' field, and am getting the 204 status code back (yay). My thought was that it was not recognizing the redirect to localhost ( where I'm testing ), but even when I put www.google.com in as the redirect, it doesn't redirect.

This is the json that I am encoding into my signature (the date is temporary):

{
      "expiration": "2014-01-01T00:00:00Z", 
      "conditions": 
      [ 
           {"bucket": "mybucket"}, 
           ["starts-with", $key, "tests/" ], 
           {"success_action_redirect": "www.google.com"}, 
           {"acl": "public-read" } 
      ] 
}

This is what my html:

<form id="fileform" action="https://mybucket.s3.amazonaws.com/" method="post" enctype="multipart/form-data" >
    <input type="hidden" name="key" value="@key" />
    <div class="editor-area">
        <label for="file">File</label>
        <input type="file" name="file" />
    </div>

    <input type="hidden" name="success_action_redirect" value="www.google.com" />
    <input type="hidden" name="acl" value="public-read" />
    <input type="hidden" name="AWSAccessKeyId" value="@awsAccessKeyId" />
    <input type="hidden" name="policy" value="@b64Policy" />
    <input type="hidden" name="signature" value="@signature" />

    <button id="file-button">Save File</button>
</form>

This is working, it is just not doing the redirect (my CORS setting are all set up to accept posts ). Is there a CORS setting that you have to set to allow redirection?

If anyone can see what I might be doing wrong, please enlighten me!

Answer 1

I ran into the same problem and found your question, unfortunately, unanswered. However, after rereading the documentation, I resolved my issue of the redirect not occurring after a successful upload to your S3 bucket. It turns out there is a small snippet on the S3 documentation that I missed that looks like it could be causing your issue as well...

http://docs.aws.amazon.com/AmazonS3/latest/dev/HTTPPOSTForms.html#HTTPPOSTFormFields

The file or content must be the last field in the form. Any fields below it are ignored.

In my form, I had the hidden redirect input field after the file input field, so S3 was ignoring it. Moving the hidden redirect input field before my file field fixed the issue. Now my post redirects to the redirect specified.

My Incorrect Form:

<form action="http://<bucketName>.s3.amazonaws.com/" method="post"
    enctype="multipart/form-data">
    <input type="hidden" name="key" value="${filename}" />
    <input type="file" name="file" />

    <!-- the following fields are ignored as they are after the file field -->
    <input type="hidden" name="success_action_redirect" 
        value="http://www.google.com/" />
    <input type="submit" value="send to aws" />
</form>

My corrected and working form:

<form action="http://<bucketName>.s3.amazonaws.com/" method="post"
    enctype="multipart/form-data">
    <input type="hidden" name="key" value="${filename}" />
    <input type="hidden" name="success_action_redirect" 
        value="http://www.google.com/" />
    <input type="file" name="file" />
    <input type="submit" value="send to aws" />
</form>

So for your example, I would give the following a try:

<form id="fileform" action="https://mybucket.s3.amazonaws.com/" method="post" enctype="multipart/form-data" >
    <input type="hidden" name="key" value="@key" />
    <input type="hidden" name="success_action_redirect" value="http://www.google.com/" />
    <input type="hidden" name="acl" value="public-read" />
    <input type="hidden" name="AWSAccessKeyId" value="@awsAccessKeyId" />
    <input type="hidden" name="policy" value="@b64Policy" />
    <input type="hidden" name="signature" value="@signature" />

    <div class="editor-area">
        <label for="file">File</label>
        <input type="file" name="file" />
    </div>

    <button id="file-button">Save File</button>
</form>

Note: I did update the URL to include the protocol as well

Answer 2

I got this with Django because it needs to be a full url that reverse by default doesn't generate. Need to add request.build_absolute_uri

urlredirect = request.build_absolute_uri(reverse('gui:page'))
s3data = s3client.generate_presigned_post(
    Bucket=settings.AWS_S3BUCKET,
    Key='file.name',
    Conditions=[{'success_action_redirect': urlredirect}]
)
s3data['fields'] = dict((k.replace('-', ''), v) for k, v in s3data['fields'].items())

return render(request, self.template_name, {'s3':s3data, 'urlredirect':urlredirect})