【问题标题】:Is it possible to send base64 image to an amazon s3 bucket via ngFileUpload post?是否可以通过 ngFileUpload 帖子将 base64 图像发送到亚马逊 s3 存储桶?
【发布时间】:2015-07-17 12:31:36
【问题描述】:

我有一个工作脚本,当文件输入发生变化时,选择文件,在我的 django 后端签署他们的上传数据,然后将其从前端直接上传到我的 s3 存储桶。它工作得很好。我正在使用 ng-file-upload 来执行此操作。

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?

【问题讨论】:

    标签: angularjs canvas amazon-s3 upload ng-file-upload


    【解决方案1】:

    经过大量研究,我发现您可以发送一个 blob 而不是将 ngFileUpload 取消发送到 s3 的文件。

    我使用this library将我的base64转换为blob,然后在Upload.upload()文件参数中传递生成的blob而不是文件。

    【讨论】:

    • 不要忘记接受您的答案,以便下一个有问题的人知道接受的答案
    猜你喜欢
    • 2017-08-01
    • 1970-01-01
    • 2017-04-12
    • 2017-03-03
    • 1970-01-01
    • 2021-11-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多