upload canvas data to s3

There is an old post method to upload data from browser to s3

http://s3.amazonaws.com/doc/s3-example-code/post/post_sample.html

then I have used this idea Convert Data URI to File then append to FormData

and instead of normal POST there can be an xhr request with the formdata to amazon and you are done


Here is a working example where you take a data URL from a canvas and upload it to S3:

var dataUrl = canvas.toDataURL("image/jpeg");
var blobData = dataURItoBlob(dataUrl);
var params = {Key: "file_name", ContentType: "image/jpeg", Body: blobData};
bucket.upload(params, function (err, data) {});

dataURItoBlob:

function dataURItoBlob(dataURI) {
    var binary = atob(dataURI.split(',')[1]);
    var array = [];
    for(var i = 0; i < binary.length; i++) {
        array.push(binary.charCodeAt(i));
    }
    return new Blob([new Uint8Array(array)], {type: 'image/jpeg'});
}