0

I'm currently learning both Angular and NodeJS at the same time for a small project at work, but I'm having issues for the last days on how to send an image (Captured from a Canvas, the image is good and tested on an img tag) to my node.js server (w/ express) from Angular.

The image seems to be well sent (Verified in the Network tab, it's in the request) but I can't seem to grab it on the server side. I'm guessing something is wrong with the way I'm sending it or how I'm supposed to get it on the server side. The server acknowledge the post request as the logs are shown in the terminal, but everything from the request (params, body, etc) is empty or undefined.

The concerned code is below, on which side something is wrong or missing ? Or even if it's something else I may have missed outside of it ?

Angular Side

//From my component, then sent to my service (imgData from sendImage)
const formData = new FormData();
formData.append('file', canvas.toDataURL(), 'capturedimage');

//Method inside my service
sendImage(imgData: FormData):any {
    this.http.post('http://localhost:3000/vision', imgData)
    .subscribe(data => {
        console.log(data);
    });
}

Node.js Side

app.post('/vision', (req, res) => {
    console.log('Received'); // Received
    console.log(req.params); // {}
    console.log(req.body); // undefined
    console.log(req.file); // undefined
    res.send('Response');
});

1 Answer 1

0

Please use npm multer in nodejs to parse multipart/form-data. Please follow this link https://github.com/expressjs/multer

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.