JSFiddle - React, Tailwind, and code Playground

by Yuriy Bablyukh

JavaScript

const imageUrlToBase64 = async (url) => {
  const data = await fetch(url);
  const blob = await data.blob();
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(blob);
    reader.onloadend = () => {
      const base64data = reader.result;
      resolve(base64data);
    };
    reader.onerror = reject;
  });
};

/* imageUrlToBase64('https://s3-eu-west-1.amazonaws.com/enterpriseproduct-ft/image/data/10/189473/189473-img1-560x560.png?v=1713784895').then(console.log).then(()=>{ console.log('done')}) */

const pathToMyImage = "https://s3-eu-west-1.amazonaws.com/enterpriseproduct-ft/image/data/10/189473/189473-img1-560x560.png?v=1713784895";
const sharp = require('sharp');

const resizedImageBuf = sharp(pathToMyImage)
  .resize(32, 32)
  .toBuffer().then((s)=>{
  	console.log(s);
  });

console.log(`data:image/png;base64,${resizedImageBuf.toString('base64')}`);