2015-05-07 30 views
0

我有一個工作腳本,當文件輸入發生變化時,選擇文件,在我的django後端簽名他們的上傳數據,並將其從前端直接上傳到我的s3存儲桶。它運作良好。我正在使用ng-file-upload來做到這一點。是否可以通過ngFileUpload發送base64圖像到亞馬遜s3桶?

var doSignUrl = function(image, success, error){ 
    $http({ 
     url: scope.signUrl, 
     params: { 
      s3_object_name: image.name, 
      s3_object_type: image.type 
     }, 
     method: 'get' 
    }).success(success).error(error); 
}; 

var getUploadConfig = function(image, data){ 
    return { 
     url: data.url, 
     method: 'POST', 
     fields : { 
      key: data.path, 
      AWSAccessKeyId: data.aws_access_key_id, 
      acl: data.acl, 
      policy: data.policy, 
      signature: data.signature, 
      "Content-Type": image.type != '' ? image.type : 'application/octet-stream', 
      filename: data.file_name 
     }, 
     file: image, 
    }; 
}; 

var doUpload = function(image){ 
    doSignUrl(image, function(signData){ 
     Upload.upload(getUploadConfig(image, signData)).progress(function(e){ 
      doProgress(image, parseInt(100.0 * e.loaded/e.total)) 
     }).success(function(data, status, header, config){ 
      doSuccess(image, signData.url+'/'+signData.path); 
     }).error(function(data, status, header, config){ 
      doError(image); 
     }); 
    }, function(data, status, header, config){ 
     console.log(status); 
     console.log(data); 
    }); 
} 

每個文件的文件選擇器選擇我打電話doUpload(file)

但我真正的目標是用帆布之前上傳到作物在前端的圖像。問題是,當您使用畫布裁剪圖像時,結果是base64編碼的圖像,而不是文件。所以我最後的問題是:是否可以直接將這個base64圖像上傳到s3?

回答

1

隨着大量的研究,我發現你可以發送一個blob而不是一個文件unsing ngFileUpload到s3。

我用this library將我的base64轉換爲blob,然後傳遞生成的blob而不是Upload.upload()文件參數中的文件。

+0

不要忘記接受你的答案,以便下一個有問題的人知道接受的答案 – Max