Cordova / Ionic应用程序通过服务器签名的URL将base64映像上传到S3

时间:2016-02-07 11:14:51

标签: node.js cordova amazon-s3 ionic-framework

我似乎无法将照片上传到S3上。看了很多在线资源,我似乎无法找到明确的答案。这是我到目前为止所拥有的。我总是得到错误代码:3作为我失败的消息。

客户方:

$scope.uploadTopicPhoto = function(imageData) {
    var image2save = "data:image/jpeg;base64," + imageData;
    $http({
      url: 'http://api.example.io/signS3upload', 
      method: "GET"
     }).then(function (success) {
        var options = new FileUploadOptions();
        options.fileKey = "file";
        options.fileName = success.data.key
        options.mimeType = "image/jpeg";    
        options.chunkedMode = false;
        options.httpMethod = 'PUT';

        function win(r) {
            console.log("Code = " + r.responseCode);
        }

        function fail(error) {
            alert("An error has occurred: Code = " + error.code);
        }

        var uri = encodeURI(success.data.signed_request);

        var ft = new FileTransfer();
        ft.upload(image2save, uri, win, fail, options);
     });
}

服务器端:

var s3 = new aws.S3();
    var bucketName = 'testimages';
    var s3_params = {
        Bucket: bucketName,
        Key: uuid.v4() + '.jpg',
        Expires: 60,
        ContentEncoding: 'base64',
        ContentType: 'image/jpeg',
        ACL: 'public-read'
    };

    s3.getSignedUrl('putObject', s3_params, function(err, data){
        if (err) {
            console.log(err);
        } else {
        var return_data = {
            signed_request: data,
            key: s3_params.Key
        };
        res.json(return_data);
        }
});

CORS:

<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>PUT</AllowedMethod>
        <AllowedMethod>POST</AllowedMethod>
        <AllowedMethod>DELETE</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>Content-*</AllowedHeader>
        <AllowedHeader>Authorization</AllowedHeader>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

3 个答案:

答案 0 :(得分:1)

我认为您不需要在base64图像数据前添加data:image/jpeg;base64,。只需删除该部分,然后直接将base64数据上传为请求正文。

请参阅:https://stackoverflow.com/a/7548264/3427434http://docs.aws.amazon.com/AmazonS3/latest/API/RESTObjectPUT.html#RESTObjectPUT-requests

答案 1 :(得分:1)

它适用于我,我发送图像文件到REST API和API上传s3存储桶中的图像,凭据来自其他文件[保存凭证]。

master

答案 2 :(得分:1)

如果您使用canvas.toDataURL,则不需要data:image/jpeg;base64,它由函数生成。如果您使用btoa,则需要添加data:image/jpeg;base64标题。