在react native中显示用base64编码的图像

Question

我对react native还不熟悉，我正在尝试显示用base 64编码的图像。

 <Image source={{uri: `data:image/png;base64,${element.img}`}}
                           style={{height: 200, width: null, flex: 1}}/>

这是猫鼬方案，我在这里存储我的图像

 img: {
    data: Buffer,
    contentType: String,
},

这就是我将它们保存到数据库的方式（photoData包含img）：

this.setState({img:data.base64})
axios.post('uri', photoData, config)

这是我的img数据：img数据

数据作为缓冲区返回，因此使用

数据：图像/png；base64，${element.img}

它不起作用。我试着使用Buffer.from（“”，'base64'）。toString（'ascii'），但仍然没有显示图像。

Answer 1

您的响应是一个缓冲区对象，您必须使用下面的代码来转换为base64映像。

const data = Buffer.from(response, 'binary').toString('base64');

const base64Image = `data:image/png;base64,${data}`;

and then you can use the image normally
<Image source={{uri: base64Image}}/>