angularjs - Uploading blob file to Amazon s3 -

i using ngcropimage crop image , want upload following this link:

ngcropimage directive returning me datauri of image , converting blob (after converting blob object: has size , type), converted datauri blob using following code:

/*html*/ <img-crop image="myimage" result-image="mycroppedimage" result-image-size="250"></img-crop>  $scope.myimage=''; $scope.mycroppedimage = {image: ''} var blob;  //called when user crops  var handlefileselect=function(evt) {   var file=evt.currenttarget.files[0];   var reader = new filereader();   reader.onload = function (evt) {     $scope.$apply(function($scope){       $scope.myimage=evt.target.result;     });   };   console.log($scope.mycroppedimage)   reader.readasdataurl(file);   var link = document.createelement('link');    blob = datauritoblob($scope.mycroppedimage)   console.log(blob) };  angular.element(document.queryselector('#fileinput')).on('change',handlefileselect);   function datauritoblob(datauri) {   // convert base64/urlencoded data component raw binary data held in string   var binary = atob(datauri.split(',')[1]);   var mimestring = datauri.split(',')[0].split(':')[1].split(';')[0];    var array = [];   for(var = 0; < binary.length; i++) {     array.push(binary.charcodeat(i));   }   return new blob([new uint8array(array)], {type: mimestring}); }  $scope.upload = function(file) {   //var file = new file(file, "filename");   // configure s3 object    console.log($scope.creds)   aws.config.update({ accesskeyid: $.trim($scope.creds.access_key), secretaccesskey: $.trim($scope.creds.secret_key) });   aws.config.region = 'us-east-1';   var bucket = new aws.s3({ params: { bucket: $.trim($scope.creds.bucket) } });    if(file) {     //file.name = 'abc';     var uniquefilename = $scope.uniquestring() + '-' + file.name;     var params = { key: file.name , contenttype: file.type, body: file, serversideencryption: 'aes256' };      bucket.putobject(params, function(err, data) {       if(err) {         // there error s3 config         alert(err.message);         return false;       }       else {         // success!         alert('upload done');       }     })     .on('httpuploadprogress',function(progress) {           // log progress information           console.log(math.round(progress.loaded / progress.total * 100) + '% done');         });   }   else {     // no file selected     alert('no file selected');   } }   $scope.uniquestring = function() {   var text     = "";   var possible = "abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz0123456789";    for( var i=0; < 8; i++ ) {     text += possible.charat(math.floor(math.random() * possible.length));   }   return text; }  //for uploading $scope.handlesave = function(){   $scope.upload(blob); } 

now, want upload blob on s3 using this, not able figure out how upload blob file s3 (as not getting 'name' in blob file)

any appreciated. thanks

you can create file blob. can pass file name also.

var file = new file([blob], "filename"); 

this same file object can use upload on s3.

change handlesave method following. file name abc.png now

//for uploading $scope.handlesave = function(){   blob = datauritoblob($scope.mycroppedimage)   $scope.upload(new file([blob], "abc.png")); }