如何在React Js中显示base64图像

Question

我正在从服务器接收作为Base64的图像。我想解码并显示图像。如何将base64解码为图像？我不想直接将base64字符串粘贴到图像源中，因为加载图像需要很长时间，而且很少有浏览器支持。

以下是代码：

// Takes base64 string & returns Image
function decodeBase64Image(base64_string) { };
var Image = decodeBase64Image(base64_string);
<img src={Image} />

Answer 1

您可能需要确保提供前缀，但不需要解码。

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4
//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />