multer-sharp-s3 icon indicating copy to clipboard operation
multer-sharp-s3 copied to clipboard

Not able to upload multiple images

Open carlosEleao opened this issue 5 years ago • 22 comments

Hi,

This lib is very usefull, it would be good to have support to multiple uploads at once.

router.post('/update', isAuthorized, upload.array('images', 20), update);

const upload = multer({ storage: s3Storage({ s3, ACL: 'public-read', Bucket: config.awsBucket, multiple: true, crop: 'attention', resize: [ { suffix: 'xlg', width: 1200 }, { suffix: 'lg', width: 800, height: 600 }, { suffix: 'md', width: 500, height: 500 }, { suffix: 'sm', width: 265, height: 190 }, { suffix: 'xs', width: 100 }, ], Key(req, file, cb) { cb(null, ${Buffer.from(file.originalname).toString('base64')}_${Date.now().toString()}); }, }), });

Right now if I use this code to upload several images, the first one is uploaded successfully but the rest all are stored with 0 bites.

carlosEleao avatar Mar 14 '19 00:03 carlosEleao

Thanks for reporting this issue. Yes, actually I haven't tested yet the use of upload.array. If you don't mind and knowing the problem. you can make a pull request. PRs are welcome :smile:

ikhsanalatsary avatar Apr 22 '19 17:04 ikhsanalatsary

Even when doing multiple posts with singe upload some files end up with 0 bites

dimitrius-ion avatar Apr 27 '19 16:04 dimitrius-ion

@dimitrius1986 how to repro what you said? I didn't face any problem for single upload

ikhsanalatsary avatar May 01 '19 00:05 ikhsanalatsary

when you do multiple calls to the endpoint, something like this: files.forEach(file => { var formData = new FormData() formData.append('file', file) axios.post( '/' +appName + '/api/upload/image/', formData, { headers: { 'Content-Type': 'multipart/form-data' } } ) }) routher.post('/image/', upload('image').single('file'), (req, res) => console.log(req.file)) files that come after first file still end up with 0 bytes

dimitrius-ion avatar May 01 '19 18:05 dimitrius-ion

@susutew & @dimitrius1986 you can try again in this branch https://github.com/ikhsanalatsary/multer-sharp-s3/tree/fix/bumps-version I need feedback. thanks

ikhsanalatsary avatar May 20 '19 03:05 ikhsanalatsary

I will try this today and give you my feedback. It is a great package.

ashishchandr70 avatar May 23 '19 17:05 ashishchandr70

Hi @susutew I am using the bumps fix branch and it now creates and resizes images passed in the array. However, it is only using the very last image in the input array and only using that one. For example:

I am passing 4 images via Postman. The images created are:


"media": [
                    {
                        "id": 63,
                        "full": "http://api.eosnode.io/media/stuff/-FyyQAKtj-original",
                        "med": "http://api.eosnode.io/media/stuff/-FyyQAKtj-md",
                        "sm": "http://api.eosnode.io/media/stuff/-FyyQAKtj-sm"
                    },
                    {
                        "id": 64,
                        "full": "http://api.eosnode.io/media/stuff/iq2paSjPJb-original",
                        "med": "http://api.eosnode.io/media/stuff/iq2paSjPJb-md",
                        "sm": "http://api.eosnode.io/media/stuff/iq2paSjPJb-sm"
                    },
                    {
                        "id": 65,
                        "full": "http://api.eosnode.io/media/stuff/kTP0pe7kTq-original",
                        "med": "http://api.eosnode.io/media/stuff/kTP0pe7kTq-md",
                        "sm": "http://api.eosnode.io/media/stuff/kTP0pe7kTq-sm"
                    },
                    {
                        "id": 66,
                        "full": "http://api.eosnode.io/media/stuff/F69xLJ-159-original",
                        "med": "http://api.eosnode.io/media/stuff/F69xLJ-159-md",
                        "sm": "http://api.eosnode.io/media/stuff/F69xLJ-159-sm"
                    }
                ],

As you can see, all the images are the same.

The function is being invoked as multer.instance.array()

e.g. uploadStuff.array(...)


exports.uploadStuff = multer({
    storage : s3Storage({
        s3,
        Bucket: 'tradestuff-stuff',
        Key: function (req, file, cb) {
            var path = shortid.generate();
            cb(null, path);
        },
        multiple: true,
        ACL:'private',
        resize: [
            { suffix: 'md', width: 500 },
            { suffix: 'sm', width: 150, height: 150 },
            { suffix: 'original' }
        ]
    })
});


ashishchandr70 avatar May 23 '19 18:05 ashishchandr70

@ashishchandr70 can you try my fork https://github.com/dimitrius1986/multer-sharp-s3

dimitrius-ion avatar May 23 '19 18:05 dimitrius-ion

@dimitrius1986 sure will try that as well

ashishchandr70 avatar May 24 '19 20:05 ashishchandr70

@susutew I see, uploaded successfully but the return is wrong. Isn't it?

ikhsanalatsary avatar May 24 '19 22:05 ikhsanalatsary

@ikhsanalatsary yes exactly. I was able to modify the size of the multiple images but the images are all the same....but sizes are of course different. This is using the bumps version.

ashishchandr70 avatar May 24 '19 23:05 ashishchandr70

@ashishchandr70 can you try my fork https://github.com/dimitrius1986/multer-sharp-s3

Hi @dimitrius1986 I tried with your fork. However, all the files are not present.

Here is my code snippet for using multer-sharp-s3

image

And as you can see in the image below, not all sizes are present. Some has sm only, some has original only, some has md only, but not all. Am I doing something wrong?

image

ashishchandr70 avatar May 25 '19 18:05 ashishchandr70

Guys @ikhsanalatsary @dimitrius1986 any updates on when you plan to resolve this?

ashishchandr70 avatar May 28 '19 14:05 ashishchandr70

Hi @ikhsanalatsary what do you suggest I do? The only other option is to pull out this library and write more code for resizing the sharp generated images.

ashishchandr70 avatar Jun 03 '19 20:06 ashishchandr70

any update?

ferdigokdemir avatar Oct 13 '19 11:10 ferdigokdemir

Any Update

prashanthalpha avatar Apr 08 '20 05:04 prashanthalpha

any update?

jeanmayorga avatar Apr 18 '20 21:04 jeanmayorga

@ashishchandr70 , @jpmayorga , @prashanthalpha , @ferdigokdemir I already tried to fix this. please try on this branch https://github.com/ikhsanalatsary/multer-sharp-s3/tree/fix-not-able-to-upload-multiple-images. and don't forget to give me feedback

ikhsanalatsary avatar May 26 '20 05:05 ikhsanalatsary

@ikhsanalatsary able to upload files, but terrible result

upload.array("images", 10)

Uploading 2 files case

image

Uploading 3 files case (all image becomes last image) image

carylaw avatar Jun 10 '20 05:06 carylaw

Any update on this? if fixed, when is the release?

kimkong88 avatar Jul 07 '20 05:07 kimkong88

https://developer.aliyun.com/mirror/npm/package/multer-s3-transform

This will help you to resolve the issue . please check npm install multer-s3-transform

riyasksalim avatar Jul 08 '20 12:07 riyasksalim

https://developer.aliyun.com/mirror/npm/package/multer-s3-transform

This will help you to resolve the issue . please check npm install multer-s3-transform

yes I decided to go with multer-s3-transform. works well !

kimkong88 avatar Jul 08 '20 21:07 kimkong88