86

I am making a small app in sails.js and I need to store images in database. For that, I need to convert an image to a base64-encoded data URL so that I can save it as a string in my sails models. However, I don't know how to convert it in this form. All the older questions asked about converting an image to base64-encoded data URLs, and they answer this about doing it on the client side. However, I want to do it on the server side while I will be getting the image through a post request. How can I achieve this?

rayryeng
  • 102,964
  • 22
  • 184
  • 193
Mahammad Adil Azeem
  • 9,112
  • 13
  • 57
  • 84

5 Answers5

146

As I understand you want to convert a file into base64 encoded string. Whether the file is image or not, that does not matter.

var fs = require('fs');

// function to encode file data to base64 encoded string
function base64_encode(file) {
    // read binary data
    var bitmap = fs.readFileSync(file);
    // convert binary data to base64 encoded string
    return new Buffer(bitmap).toString('base64');
}

Usage:

var base64str = base64_encode('kitten.jpg');

Source

alandarev
  • 8,349
  • 2
  • 34
  • 43
  • 4
    `fs.readFile` gives a buffer if no encoding is passed, so no need for the `new Buffer()`. [Related doc](https://nodejs.org/api/fs.html#fs_fs_readfile_file_options_callback). – tleb Feb 08 '17 at 23:57
  • 32
    Don't forget to add the data URI prefix: `data:[][;base64],` For example: `data:image/png;base64,` in case of a PNG image. More info: [Data URIs on MDN](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs) – Márton Tamás Jun 02 '17 at 14:53
  • 26
    new Buffer() is deprecated. You can use instead fs.readFileSync(file, { encoding: 'base64' }); – Idan Dagan Jan 11 '18 at 08:27
  • base64 encoded only is free, but to create a dataURI, some kind of mime-db is required. https://www.npmjs.com/package/mime-types – Polv Sep 28 '20 at 11:32
113

It can be achieved with readFileSync, passing in the image path as the first parameter and an encoding option as the second. As show below:

var fs = require('fs');

var imageAsBase64 = fs.readFileSync('./your-image.png', 'base64');

As per the node documentation:

fs.readFileSync(path[, options])

Synchronous version of fs.readFile(). Returns the contents of the path.

If the encoding option is specified then this function returns a string. Otherwise it returns a buffer.

JSON C11
  • 11,272
  • 7
  • 78
  • 65
1

//You can use the image-to-base64

const imageToBase64 = require('image-to-base64');

imageToBase64("URL") // insert image url here. 
    .then( (response) => {
          console.log(response);  // the response will be the string base64.
      }
    )
    .catch(
        (error) => {
            console.log(error);
        }
    )
chalmer jay jamero
  • 35
  • 1
-3
//instala via npm
npm install --save image-to-uri

//declara no codigo
const imageToUri = require('image-to-uri');

//implementa 
let imagem = imageToUri("caminho da sua imagem");
Vagner Kugelmeier Tondello
  • 19
-14

Here`s another simple way, use it when listing your images

@{
    if (item.ImageData != null)
    {
        string imageBase64 = Convert.ToBase64String(item.ImageData);
        string imageSrc = string.Format("data:image/gif;base64,{0}", imageBase64);
        <img src="@imageSrc" width="100" height="100" />
    }
}
MarmiK
  • 5,639
  • 6
  • 40
  • 49
Sibonelo
  • 25
  • 5