0

I am receiving the Image as Base64 from the server. I want to decode and display the image. How do I decode base64 to Image ? I dont want to directly paste the base64 string into the image source as its taking alot of time to load the image and also not supported by few browsers.

Below is the code :

// Takes base64 string & returns Image
function decodeBase64Image(base64_string) { };

var Image = decodeBase64Image(base64_string);

<img src={Image} />
deepesh mhatre
  • 97
  • 1
  • 3
  • 10
  • Is your plan to decode the image and store it somewhere on your website, so it can be accessed that way by the page? – ControlAltDel Dec 22 '21 at 17:03
  • No,I may plan to download the Image latter. – deepesh mhatre Dec 22 '21 at 17:19
  • Does this answer your question? [convert base64 to image in javascript/jquery](https://stackoverflow.com/questions/21227078/convert-base64-to-image-in-javascript-jquery) – Ankit Katheriya Dec 22 '21 at 17:35
  • No,most of the solutions given follow a similar approach of giving base64 string sirectly to src. What if I want to download the image ? also it is slow. I want to convert base64 to Image object and then do some processing over it – deepesh mhatre Dec 23 '21 at 05:23

1 Answers1

3

You might need to make sure the prefix is provided, but decoding shouldn't be necessary.

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4
        //8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />
Jared Dickson
  • 538
  • 3
  • 7
  • As stated above,I dont want to paste the base64 string into src directly,for some reason Its very slow to display the image & its not supported by some browsers. – deepesh mhatre Dec 22 '21 at 17:19