Upload a txt to Amazon S3

Question

I am using the s3 sdk to upload a string (which will be change into a txt file). It is ok using the sdk. But since the sdk is only available for new browser (eg: ie10+) I need to upload my file with another way (for old browser)

For image file I use an input (type file) and a form for the upload

<form id="urlform" enctype="multipart/form-data" method="post" target="upload_target" class="inline">
    <input type="hidden" name="key" value="{{$parent.keyurl}}">
    <input type="hidden" name="acl" value="public-read">
    <input type="hidden" name="AWSAccessKeyId" value="{{$parent.awSAccessKeyIdUrl}}">
    <input type="hidden" name="success_action_redirect" value="{{$parent.redirectionUrl}}">
    <input type="hidden" name="x-amz-meta-filename" value="{{$parent.filenameurl}}">
    <input type="hidden" name="policy" value="{{$parent.policyurl}}">
    <input type="hidden" name="signature" value="{{$parent.signatureurl}}">
    <input type="hidden" name="x-amz-security-token" value="{{$parent.urlSessionToken}}">
    <div>
        <label>
        </label>
        <input type="file" name="file" id="urlfileinput">
    </div>
</form>

this solution only works with input type file .

For security reason I can't change the value of the input with jquery.

Is there another way to upload text (using the rest api perhaps) ?

This could eventually help you: http://stackoverflow.com/questions/14882713/iframe-transport-isnt-transferring-any-data — Julien, May 02 '14 at 07:37
Can you clarify exactly how you want the upload to behave, from the user's point of view? Why are you trying to change the value of the file input with jQuery? — Michal Charemza, May 03 '14 at 07:17
Why don't you try to execute an AJAX request to server code realize the upload? It will improve the security, because really will hide the key and others options. — Maykonn, May 06 '14 at 21:55

score 1 · Answer 1 · answered May 01 '14 at 06:58

I'm curious as to why you're using a URL form to submit this to Amazon... This is hugely insecure since you're giving out your AWS Access Key to everyone. First, you need to look into using the Amazon SDK for Javascript, which should work easy enough with Angular as a dependency.

Next, you need to look into doing CORS on your S3 Bucket (cross domain resource sharing) so that you can in fact 'upload' something on S3 from anywhere without the need for authentication (be careful with this since everyone will have access to it and can upload anything, and if you don't configure it properly, can give access to other things like delete).

Lastly, you simply need to use the SDK's AWS.S3().putObject() function to upload whatever you need to your public S3 bucket.

There is nothing insecure about giving out your access key. The access key is not meant to be private. The secret key is, however. Based on the code in the question, the requests are apparently being signed with the secret/private key, which is expected and correct. — Ray Nicholus, May 01 '14 at 12:07
Also CORS, has nothing to do with authentication. You can set CORS rules on your bucket and still expect requests to be authenticated so that only users you allow can upload to your bucket. — Ray Nicholus, May 01 '14 at 12:11

score 1 · Answer 2 · answered May 07 '14 at 12:33

1

You can use the formdata to send the file.

var formData = new FormData();

formData.append("key", "{{$parent.keyurl}}");
formData.append("acl", 'public-read');
formData.append("AWSAccessKeyId", '{{$parent.awSAccessKeyIdUrl}}');
formData.append("success_action_redirect", '{{$parent.redirectionUrl}}');
.........
// JavaScript file-like object...
var blob = new Blob('testSample', { type: "text/xml"});
 formData.append("file", blob);

var request = new XMLHttpRequest();
request.open("POST", "upload_target");
request.send(formData);

answered May 07 '14 at 12:33

Nisanth Sojan

1,099
8
21

What does "upload_target" mean? also I think it might be var blob = new Blob(['testSample'], { type: "text/xml"}); – dooderson May 27 '14 at 21:34
"upload_target" is the link to which you upload the file and 'testSample' is the text content for the generated document – Nisanth Sojan May 28 '14 at 11:55

score 0 · Accepted Answer · answered May 07 '14 at 15:35

I found a solution. To upload a text I had to use an inside the form with a the name "file".

<form id="disclaimerform" enctype="multipart/form-data" method="post" target="upload_target" class="inline">
    <input type="hidden" name="key" value="{{keydisclaimer}}">
    <input type="hidden" name="acl" value="public-read">
    <input type="hidden" name="AWSAccessKeyId" value="{{awSAccessKeyId}}">
    <input type="hidden" name="success_action_redirect" value="{{redirection}}">
    <input type="hidden" name="x-amz-meta-filename" value="{{disclaimerfilename}}">
    <input type="hidden" name="x-amz-security-token" value="{{session_token}}">
    <input type="hidden" name="policy" value="{{policy}}">
    <input type="hidden" name="signature" value="{{signature}}">
    <div>
        <label></label>
        <textarea style="opacity:0;" name="file" id="disclaimerinput"/>
    </div>
</form>

Upload a txt to Amazon S3

3 Answers3