Converting image-file into base64 in express nodejs

Question

I am trying to convert an image file into base64, so I can store in base64 string form in mongoDB.

This is how I am trying to do that:

router.post('/file_upload',function(req,res){

  function base64_encode(file) {
    var bitmap = fs.readFileSync(file);
    return new Buffer(bitmap).toString('base64');
}

  var ImageFileToSave =  base64_encode(req.body.file);

  console.log(ImageFileToSave);


})

On Client side:

<form action="/file_upload" method="POST" enctype="multipart/form-
 data">
<input type="file" name="file" />
<input type="submit" value="Upload File" />
</form>

This is the error that I am getting

TypeError: path must be a string or Buffer

how can I convert that image file(eg:image.jpg) into base64?

Ok. Kindly check the value of req.body.file and its data type. Thanks. — CodeLover
– CodeLover, Commented Feb 13, 2018 at 8:18

Cisco · Accepted Answer · 2019-06-11 11:12:22Z

19

You will need to use Multer middleware to handle multipart/form-data.

const express = require('express')
const multer  = require('multer')
const upload = multer({ dest: 'uploads/' })

const app = express()

app.post('/file_upload', upload.single('example'), (req, res, next) => {
  // req.file is the `example` file or whatever you have on the `name` attribute: <input type="file" name="example" />
  // I believe it is a `Buffer` object.
  const encoded = req.file.buffer.toString('base64')
  console.log(encoded)
})

2018-10-24: See David's comment below.

2019-06-11: Fixed example based on comments. It is indeed req.file.buffer: https://github.com/expressjs/multer/blob/master/storage/memory.js#L8

edited Jun 11, 2019 at 11:12

answered Feb 13, 2018 at 17:33

Cisco

23.5k6 gold badges44 silver badges67 bronze badges

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

2 Comments

David Vicente Over a year ago

It didn't work to me, but with a little change it worked const encoded = req.file.buffer.toString('base64');

Djov Over a year ago

Not sure if it was like this in older versions of Multer, but for me it worked with req.file.buffer.toString('base64') too. Thank you. :)

David Vicente · Accepted Answer · 2018-10-24 13:30:17Z

7

As the previous answer wasn't working for me, I'm sharing this other one that worked. I made with the multer library getting the file and then transforming it to base64

const multer  = require('multer')
const upload = multer({});

router.post('/uploadlogo', upload.single('logo'), (req, res, next) => {
    // encoded has the base64 of your file
    const encoded = req.file.buffer.toString('base64');
});

answered Oct 24, 2018 at 13:30

David Vicente

3,1311 gold badge20 silver badges27 bronze badges

Comments

Grant mitchell · Accepted Answer · 2022-09-21 03:19:03Z

0

you can also do it manually in a way if you want more control. here is an example but you can implement it in any way you want, as middleware or as a function to call alone.

this is assuming your image is base64 which would be "req.body.image".


var ImageMiddleware =  (req, res, next)=> {
  if (req.body.image && req.body.foldername && req.body.filename){
    const imagepath = req.body.foldername + "/" + uuidv4() + "_" + req.body.filename;

      function buff(data) {
        const base64 = data.split(',')[1];
        let buff = Buffer.from(base64, 'base64');
        return buff
      }

      fs.writeFileSync(imagepath, buff(req.body.image))

  }
}

answered Sep 21, 2022 at 3:19

Grant mitchell

5511 gold badge4 silver badges12 bronze badges

Collectives™ on Stack Overflow

Converting image-file into base64 in express nodejs

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related