Convert image to Base64 string for textarea

by Sebastian Kay

HTML

<img src="" id="my-image" />

<textarea id="base64Image"></textarea>

JavaScript

const base64ImageTextarea = document.getElementById("base64Image");
const theImage = document.getElementById("my-image");

fetch("https://image.pollinations.ai/prompt/A%20fluffy%20cute%20bunny?width=720&height=1280&seed=680267&model=flux&nologo=true&private=true&safe=false")
  .then((res) => res.blob())
  .then((blob) => {
    // Read the Blob as DataURL using the FileReader API
    const reader = new FileReader()
    reader.onloadend = () => {
      console.log(reader.result)
      // Logs data:image/jpeg;base64,wL2dvYWwgbW9yZ...
	  base64ImageTextarea.value = reader.result;
	  theImage.src = reader.result;
      
    }
    reader.readAsDataURL(blob);
  })