I am trying to upload an image file from my Trigger.io mobile app directly to Amazon S3 (see here: http://aws.amazon.com/articles/1434). I'm able to do this on the web without any problems using jQuery and the FormData
API as follows:
var fd = new FormData();
key = 'test.jpg'
fd.append('key', key);
fd.append('acl', 'public-read');
fd.append('Content-Type', file.type);
fd.append('AWSAccessKeyId', key_id);
fd.append('policy', policy_base64);
fd.append('signature', signature);
fd.append('file', file);
$.ajax({
type: 'POST',
url: 'https://' + bucket + '.s3.amazonaws.com/',
processData: false, // Not supported with Trigger
contentType: false, // Not supported with Trigger
data: fd,
success: function(response) {
// It worked...
}
});
However, I'm unable to get this working with the Forge request API. This is what I have tried:
forge.request.ajax({
type: 'POST',
url: 'https://' + bucket + '.s3.amazonaws.com/',
fileUploadMethod: 'raw',
files: [file],
data: fd,
headers: { 'Content-Type': 'multipart/form-data', 'x-amz-acl': 'public-read' },
success: function(response) {
// It worked...
}
});
But, I receive the following error from Amazon:
<Code>PreconditionFailed</Code>
<Message>At least one of the pre-conditions you specified did not hold</Message>
<Condition>Bucket POST must be of the enclosure-type multipart/form-data</Condition>
I would circumvent this forge.request
entirely in favor of $.ajax
, but my file
was retrieved using the Forge File API and just shows up on S3 as [object Object]
(I assume because it's a Forge file, not a true file object from an HTML <input />
).
So, how can I upload a file in Trigger.io to Amazon S3 using FormData
and the Forge API? Any help is greatly appreciated! Thanks!
You are able to use the jQuery ajax
$.ajax
function and theFormData
JavaScript API to upload an image file from your Trigger.io mobile app directly to Amazon S3 as you have done on the web.You will need to perform the following steps:
forge.file
API.forge.file.base64
to return the base64 value for your file's content.Blob
object from the returned base64 valueBlob
object to yourFormData
object$.ajax
function toPOST
the file to Amazon S3As an example, once you have retrieved your image file (Step 1), you could use the following
uploadImage
function to upload your image to Amazon S3: