在浏览器中的 React 中将 base64 编码的 jpeg 转换为 png答案

【问题标题】：Converting a base64-encoded jpeg to a png in React in browser在浏览器中的 React 中将 base64 编码的 jpeg 转换为 png
【发布时间】：2019-12-16 12:53:43
【问题描述】：

我有一个 base64 编码的 jpeg 字符串，我在 React 中保持状态。我一直在尝试如何将其转换为 png 格式的 base64 字符串浏览器端。

我简要查看了sharp，但发现需要服务器端node.js 环境。我真的不想编写自己的转换脚本。在 npm 上进一步搜索对我来说没有任何结果。

非常感谢任何帮助。

【问题讨论】：

我最初的想法是使用drawImage() 将JPEG 绘制到画布上，然后在该画布上调用toDataURL()。 PNG 是使用 toDataURL 时的默认格式，因此您甚至不需要为其提供参数。
@IceMetalPunk 这很有趣，我会研究一下。谢谢。如果您认为可以解决问题，请随时回答。

标签： javascript reactjs base64 png image-conversion

【解决方案1】：

这是未经测试的，但您应该能够将 base64 JPEG 设置为图像的来源，然后使用 context.drawImage 将该图像绘制到画布上；一旦它在画布上，您可以使用 canvas.toDataURL() 获取它的 base64 PNG。

【讨论】：

谢谢，我已经测试过了，效果很好。很好的解决方案！