How can I convert an image to a Base64 string using JavaScript?

General Discussions
2

Hey! So, if you’re dealing with an image file, like one selected from an <input type="file">, the FileReader API makes this super simple. Here’s how you can convert it into a Base64 string:

const fileInput = document.getElementById('fileInput');
fileInput.addEventListener('change', function() {
  const file = this.files[0];
  const reader = new FileReader();
  reader.onload = function() {
    const base64String = reader.result;
    console.log(base64String); // This is your Base64 string
  };
  reader.readAsDataURL(file);
});

It’s widely supported and should fit into most upload workflows. Easy, right?