0

I am creating an angular application where I initiate a POST call from the client-side. In server-side, I have the route set up with multer-sharp-s3 where I generate a new name (key) and upload it to aws s3 every time when there is a call.

Angular html code:

<form>
<input type="file" name='avatar' id="imageUploadInput" accept="image/*" #profilePicInput (change)="imageUpload(profilePicInput.files)" >
</form>

Angular ts file:

imageUpload(fileList:FileList){
    this.fileToUpload= fileList.item(0);
    let formData = new FormData();
    formData.append('avatar', this.fileToUpload, this.fileToUpload.name );
    this.userService.uploadDpImage(formData, this.currentUser).subscribe(
      (data:{Message:string, location:string})=>{
        this.userProfile.dpLocation=data.location;
      }
    )
  }

Nodejs Route with multer middleware:

router.post('/api/dpUpload/:displayName', middleWare.uploadToS3, (req,res)=>{
     User.findOneAndUpdate(
         {displayName: req.params.displayName},
         {$set:{dpLocation: req.file.Location}},
         (err,obj)=>{
             if(!err){
                return res.json({Message: "Image uploaded successfully", location:req.file.Location});
             }else{
                return res.json(err);
            }
         }
     )
})

Multer middleware:

//S3 storage options
var multer = require('multer');
var s3Storage = require('multer-sharp-s3');
var aws = require('aws-sdk');
var fs = require('fs');
var nodeuuid = require('node-uuid');

aws.config.update({Bucket:'yaavarum-kelir-dev', region: 'us-east-2', accessKeyId: 'XXXXXXXXXXXX', secretAccessKey: 'XXXXXXXXXXXXX'});

s3 = new aws.S3();

var storage = s3Storage({
    s3,
    Bucket: 'yaavarum-kelir-dev',
    Key: `${'yaavarum-kelir-dev'}/DevContainer/${nodeuuid.v4()}`,
    ACL: 'public-read',
  });


middleWareObj.uploadToS3=multer({
    storage: storage,
}).single('avatar');

The problem that I am facing is that every time a post-call comes, the image is uploaded to aws s3 with the same name and so replaces the image instead of creating a new file. I am not sure what I am doing incorrectly.

I am generating a new name by doing 'nodeuuid.v4()' in the 'storage' variable every time. But still, this issue is happening.

Can someone please help?

Mehul Kabaria
  • 6,404
  • 4
  • 25
  • 50
Sudharsan Prabu
  • 105
  • 1
  • 11
  • The only thing I could imagine is that you are not calling correctly to the node-uuid method. Which library are you using? Can you provide more information about that? If the library is the kelektiv/node-uuid, the correct way of using it is `const uuidv4 = require('uuid/v4');` – ZetaPR Sep 09 '19 at 08:01
  • Library used from: http://adilapapaya.com/docs/node-uuid/. I'll try to use the given library and see.. But I am not sure if that is the issue though.. because, I tried replacing the 'nodeuuid.v4()' with Date.now() and separated the requests by few seconds.. even then the files were getting replaced. – Sudharsan Prabu Sep 09 '19 at 15:12

1 Answers1

1

I fixed this issue, Thanks to this answer:

https://stackoverflow.com/a/40950313/7999756

Correct implementation of the middleware:

middleWareObj.uploadToS3=multer({
    storage: s3Storage({
        s3,
        Bucket: 'yaavarum-kelir-dev',
        Key: function(req,file,cb){
            console.log(file);
            cb(null,nodeuuid.v4());
        },
        ACL: 'public-read',
      }),
}).single('avatar');
Sudharsan Prabu
  • 105
  • 1
  • 11