ngCordova FileTransfer direct upload to AWS S3 WebKitFormBoundary Issue

Question

I am trying to upload a file using a pre-signed url on AWS-S3 with ngCordova FileTransfer Plugin.

I am successfully able to upload files to AWS-S3 but the content of the file contain

------WebKitFormBoundarylCFgJXqqECF1rJ2m Content-Disposition: form-data; name="file"; filename="75cae09191bd92a16c3ff05baeb88b9b.jpg" Content-Type: image/jpeg

Due to which the image file can't be opened. How can i get rid of this header in my file. I have an idea that if i put a binary data instead of form data it will get rid of this as i have tested it in POSTMAN but couldn't find any way to do that in cordova file transfer.

 $cordovaFileTransfer.upload(s3SignedUrl, imagePathOnPhone, {
                                fileKey: "file",
                                fileName: localFileName,
                                httpMethod: "PUT",
                                mimeType: 'image/jpeg'
                            })
                                .then(function (result) {
                                    console.log(result);

                                }, function (error) {
                                    console.log(error);

                                }, function (progress) {
                                    console.log(progress);

                                });

My Bucket is in Frankfurt region and api v4. and i am using nodejs on server.

Answer 1

Try adding the Content-Type property to the params section.

$cordovaFileTransfer.upload(s3SignedUrl, imagePathOnPhone, {
    fileKey: "file",
    fileName: localFileName,
    httpMethod: "PUT",
    mimeType: 'image/jpeg',
    params: {
        "Content-Type": "image/jpeg"
    }
})
.then(function (result) {
    console.log(result);

}, function (error) {
    console.log(error);

}, function (progress) {
    console.log(progress);

});