grails - Can't upload files to Amazon S3 using Angularjs with pre signed URL -


i'm having problems uploading file amazon s3. i've developed grails restful service uses aws java sdk generate pre signed urls. when client uploads file, first retrieves pre-signed url , uses upload file directly s3 bucket. have grails service creates pre signed url so...

def generatefileuploadurl(amazons3client client, string bucketname, string key, int expirymins) {     generatepresignedurlrequest req = new generatepresignedurlrequest(bucketname, key);     req.setmethod(httpmethod.post);     req.setexpiration(getexpiration(expirymins));      return client.generatepresignedurl(req); } 

and client retrieves url following format...

https://{bucketname}.amazonaws.com/{key}?awsaccesskeyid={accesskey}&expires={expiry}&signature={signature} 

then client creates post request using danial farid's angular file upload module so...

upload.upload({     url: desturl, // url shown above     file: file }).progress(function (evt) {   var progresspercentage = parseint(100.0 * evt.loaded / evt.total);   console.log('progress: ' + progresspercentage + '% ' + evt.config.file.name); }).success(function (data, status, headers, config) {   console.log('file ' + config.file.name + 'uploaded. response: ' + data); }).error(function (data, status, headers, config) {   console.log('error status: ' + status); }); 

at first received errors cors settings after editing cors origin configuration in bucket's permissions, started getting 403 forbidden response instead. message in 403 response 'the request signature calculated not match signature provided. check key , signing method.'. aws access key , signature provided match i'm not sure exact error is.

is request missing information? looked @ few other posts, this, manually creates policy document send url doesn't use aws java sdk.

as happens, approach works fine requests, , can retrieve documents. can't upload.

i know old question still seems relevant , still seems quite tricky working. s3 signed url upload quite particular fields used in request , response , error messages not helpful seeing - assume intent security reasons make hard debug.

there have been changes aws signature process - version @ time (march 2016) aws signature version 4 (http://docs.aws.amazon.com/general/latest/gr/signature-version-4.html). need careful when looking @ examples , stackoverflow etc information relates same signature version using don't mix well.

i started using aws sdk angular/node file upload found easier generate policy on server (node.js) side without sdk. there example (albeit node, not grails based) here: https://github.com/danialfarid/ng-file-upload/wiki/direct-s3-upload-and-node-signing-example (but note issue s3 bucket name here: angularjs image upload s3 ).

one key thing watch correctly include file content type in policy generation , content type matches content type of file uploading.

for reference code on angular side, works me:

$scope.upload = function (file) {     console.log("webuploadctrl upload");     console.log("webuploadctrl sending s3sign request");     var query = {         filename: file.name,         type: file.type     };     $http.post('/api/s3sign', query).success(function(response) {         console.log("webuploadctrl s3sign response received");         var s3responseparams = response;         console.log("webuploadctrl upload  awsaccesskeyid: " + response.awsaccesskeyid);         console.log("webuploadctrl upload  signature: " + response.signature);         $scope.upload = upload.upload({                 url: s3responseparams.url, //s3url                 transformrequest: function(data, headersgetter) {                     var headers = headersgetter();                     delete headers.authorization;                     return data;                 },                 fields: s3responseparams.fields, //credentials                 method: 'post',                 file: file             }).progress(function(evt) {                 $scope.progresspercent = parseint(100.0 * evt.loaded / evt.total);                 console.log('progress: ' + $scope.progresspercent);             }).success(function(data, status, headers, config) {                 // file uploaded                 console.log('file ' + config.file.name + 'is uploaded successfully. response: ' + data);                              }).error(function() {                 // error has occured                 console.log('error uploading s3');           });     }); }; 

Comments

Popular posts from this blog

javascript - Karma not able to start PhantomJS on Windows - Error: spawn UNKNOWN -

c# - Display ASPX Popup control in RowDeleteing Event (ASPX Gridview) -

Nuget pack csproj using nuspec -