0

I have a base64-encoded jpeg string that I'm holding in state in React. I've been trying to work out how to convert it to a png format base64 string browser-side.

I briefly looked at sharp, but I found that requires a server side node.js environment. I don't really want to have to write my own conversion script. Further searching on npm hasn't yielded anything for me.

Any help with this is very much appreciated.

  • 1
    My initial thought would be to draw the JPEG to a canvas with `drawImage()`, then call `toDataURL()` on that canvas. PNG is the default format when using toDataURL, so you shouldn't even need an argument to it. – IceMetalPunk Aug 08 '19 at 18:47
  • @IceMetalPunk That's interesting, I'll research that. Thanks. Please feel free to make an answer if you think that will solve it. –  Aug 08 '19 at 18:50

1 Answers1

1

This is untested, but you should be able to set the base64 JPEG as the source of an image, then draw that image to a canvas using context.drawImage; once it's on a canvas, you can use canvas.toDataURL() to get a base64 PNG of it.

IceMetalPunk
  • 5,476
  • 3
  • 19
  • 26