0

What I am trying to do is delete the images with same id before I upload a new image, if the user has inputed image. Multer does not provide a way to detect if there is an input only, it has to upload the file first.

So I figured out to use another form-data libarary to do just that. But when I do that multer doesn't recieve the form-data to upload. So it doesn't upload anything. The image only get delete, but no new images are added.

The problem is I can't parse for data twice. How can i fix it? Or is there a workaround?

Code explination

I am using multyparty to detect if the user has included an image in a form.

form.parse(req, async (err, fields, files) => {
    if (err) console.log(err);
    else if (files.image) removeImagesWithSameId(req.params.id)
});

If there an image in the form then delete the previous uploaded image

const removeImagesWithSameId = (id) => {
    fs.unlink(__dirname + id + ".jpg", (err) => {
        if (err) console.log(err)

        console.log("image Delete")
    })
}

Then upload the new image, using multer.

upload(req, res, (err) => {
    if (err) console.log(err)
    else if (req.file) console.log("Image uploaded")
});

Execpt the new image not getting uploaded, because multer not receiving the data and req.file is undefined.

My questions is why multer is not receiving the data when ever I add multiparty, and how to fix it?

Whole the code

const express = require('express');
const app = express();
const multiparty = require('multiparty');
const form = new multiparty.Form();
var upload = multer({ dest: __dirname }).single('image');

const removeImagesWithSameId = (id) => {
    fs.unlink(__dirname + id + ".jpg", (err) => {
        if (err) console.log(err)

        console.log("image Delete");
    })
}

app.post('/upload/:id', (req, res) => {
    form.parse(req, async (err, fields, files) => {
        if (err) console.log(err);
        else if (files.image) removeImagesWithSameId(req.params.id)
    });

    upload(req, res, (err) => {
        if (err) console.log(err)
        else if (req.file) console.log("Image uploaded")
    });
})

Note this is only demonstration of the probelm. My actaul code is bit longer then that.

For people who is asking about the requst, I am using nodemon, but this equivalent curl requst.

curl --location --request PUT 'localhost/upload/1593735936343' \
     --form 'image=@/C:/Users/Hamza/images/test.jpg'
  • Take a look at [this](https://stackoverflow.com/questions/62672111/how-do-you-use-express-fileupload-correctly/62674380). – Carlo Corradini Jul 03 '20 at 09:48
  • And is better if you choose *multiparty* or *multer*, not both, since they do the same thing. I suggest *Multer*. – Carlo Corradini Jul 03 '20 at 09:52
  • No if use multer alone I can delete the previous image(s) with the same id, because I can't not execute any code before the file upload. –  Jul 03 '20 at 10:10
  • Explain better this, please. I can't understand what is the real problem here :( – Carlo Corradini Jul 03 '20 at 10:11
  • @CarloCorradini I have edited the question (added more explination at the bottom). Hope it make sense now. –  Jul 03 '20 at 10:18
  • The id is related to?? explain this – Carlo Corradini Jul 03 '20 at 10:33
  • PS: IS better to do the check with a middleware before the last handler – Carlo Corradini Jul 03 '20 at 10:33
  • The id is the name of the file, but in real application i have it storried in a database. I don't undetstand what you mean by last handler. I think I use middleware it will resaut to the same problem. –  Jul 03 '20 at 10:45
  • Multer generate an unique id if you want so no collision will be created. – Carlo Corradini Jul 03 '20 at 10:57
  • I feel like I did the poor job explaining, the problem is that I can't parse the data twice. And I need to parse it twice. –  Jul 03 '20 at 10:59
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/217144/discussion-between-carlo-corradini-and-hamza-khuswan). – Carlo Corradini Jul 03 '20 at 11:02
  • @HamzaKhuswan Did you get a solution to this problem? I am trying to parse the form data twice too, once using formidable.js to extract just the non-file fields to run validation against, and then again to upload the user provided files using multer's upload to a specified cloud storage service. As you found, the subsequent multer upload (where the multipart form-data would be parsed a second time) does nothing. – Jools Apr 30 '21 at 11:03

0 Answers0