Convert image from url into data uri in node.js

Question

I have been looking for a JavaScript solution to converting an image from an external url to a data uri. I have installed multiple packages and tested multiple methods but have not been able to find a usable method for doing so.

What I want:

var url = 'https://static-00.iconduck.com/assets.00/npm-icon-512x512-qtfdrf37.png';
var output = convertToUri(`${url}`); // doesn't need to be a one liner just anything relatively simple that works
res.send(`${output}`);

The closest thing I have: (using data-uri package from npm)

var url = 'https://static-00.iconduck.com/assets.00/npm-icon-512x512-qtfdrf37.png';
data_uri.encode(=`${url}`, function(results){
    console.log(results); // this comes in json form that doesn't seem to want to cooperate with JSON.parse();
                          // if somebody could figure this out that would be equally as helpful
                          // https://www.npmjs.com/package/data-uri
});

Aside from this, I cannot seem to find a helpful tutorial or question on how to accomplish something similar. Like I said, this is the only package that seems to work with this sort of input so if there is one of use please let me know. Otherwise, Any help will be greatly appreciated.

Here I found something that can maybe help you doing what you want : https://levelup.gitconnected.com/how-to-convert-image-to-base64-by-javascript-d110556de37f — Maxime Baker, May 08 '23 at 00:30
@MaximeBaker thanks for the help but it still doesn't seem to work. Is there a way that this could be done all in JavaScript without an html file attatched? When running I get an error due to the fact that in my project there is no available html source. — WillDevv12, May 08 '23 at 20:07
Sorry I didn't wanted to confuse you. What i mean, is that you can use the function : itself. I am going to right an anwser with more description. — Maxime Baker, May 08 '23 at 20:40

score 1 · Accepted Answer · answered May 09 '23 at 20:42

I have found a way to do this using image-to-base64 package:

const imgtoBase64 = require('image-to-base64')

app.get('/', (req, res) => {
    const URL = 'https://www.google.de/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png';

    imgtoBase64(`${URL}`)
            .then( (response) => {
                console.log('data:image/png;base64,' + response);  // the response will be the string base64.
            }
        )
        .catch(
            (error) => {
                console.log(error);
            }
        )
});

score 0 · Answer 2 · answered May 08 '23 at 21:18

You can use this code to convert urls to base64 :

const fetch = require('node-fetch')
    , base64stream = require('base64-stream');

const URL = 'https://www.google.de/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png';

fetch(URL)
    .then((res) => {
        return new Promise((resolve, reject) => {
            let chunks = [];
            let myStream = res.body.pipe(base64stream.encode());
            myStream.on('data', (chunk) => {
                chunks = chunks.concat(chunk);
            });
            myStream.on('end', () => {
                resolve(chunks.toString('base64'));
            });
        });
    })
    .then(console.log);

Source : https://gist.github.com/muety/3ef97aad64ac733831e41ef5025133e0

Convert image from url into data uri in node.js

2 Answers2