如何在 PostgreSQL 的反应中显示图像

贾德米尔

该应用程序是关于使用 HTML 从用户那里获取图像,通过 API 发送它,然后将其添加到数据库中并将其另存为bytea.

问题是我无法在需要时显示图像。

主页是我需要显示图像的地方。

axios.get('http://localhost:3333/api/getAllHairdressers').then((result)=>{
  console.log(result.data);
  this.setState({data:result.data})
})
}

记录 data.result 是

counter : 1 cutprice : null description : null id : 32 image : {type: "Buffer", data: Array(438763)} location: null password : "123" salname : null username : "ttt"

那么我怎么能显示这个图像呢?我需要使用什么?

安迪·雷

从 Postgres 中检索它时对它进行 Base64 编码:

SELECT ENCODE(byteaColumn,'base64') as base64 FROM...;

然后使用 base64 数据 URL 将其放入 img 标签中:

<img src={`data:image/jpeg;base64,${this.state.data}`} />

如果您无法修改您的数据库查询,您可以在 Javascript 中对缓冲区进行 base64 编码:

this.setState({data: result.data.toString('base64')});

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在PostgreSQL中截断日期?

来自分类Dev

如何在PostgreSQL中运行临时脚本?

来自分类Dev

如何在PostgreSQL中删除表

来自分类Dev

如何在postgreSQL pgAdmin中插入行?

来自分类Dev

如何在PostgreSQL中模拟死锁?

来自分类Dev

如何在PostgreSQL中显示用户的udt定义?

来自分类Dev

如何在PostgreSQL的函数中编写WITH(CTE)

来自分类Dev

如何在PostgreSQL中取消透视表

来自分类Dev

如何在PostgreSQL中克隆RECORD

来自分类Dev

如何在PostgreSQL中优化HAVING子句?

来自分类Dev

如何在PostgreSQL中创建日期检查

来自分类Dev

如何在Postgresql中更改表的权限?

来自分类Dev

如何在Postgresql中舍入时间?

来自分类Dev

如何在PostgreSQL列中显示前导/尾随空格?

来自分类Dev

如何在PostgreSQL中按周分组

来自分类Dev

如何在PostgreSQL中向上插入多行

来自分类Dev

如何在PostgreSQL中多次执行查询

来自分类Dev

PostgreSQL:如何在函数中捕获异常?

来自分类Dev

如何在PostgresQL中显示所有无效对象

来自分类Dev

如何在postgreSQL中添加自动增量?

来自分类Dev

如何在PostgreSQL中执行级联舍入?

来自分类Dev

如何在PostgreSQL中启用扩展?

来自分类Dev

如何在PostgreSQL中获得频率

来自分类Dev

如何在jsonb postgresql中访问键值?

来自分类Dev

如何在Postgresql中显示数据行列?

来自分类Dev

如何在PostgresQL中显示所有无效对象

来自分类Dev

如何在反应中添加图像

来自分类Dev

如何在反应中在客户端显示动态获取的图像?

来自分类Dev

如何在本机反应中显示一组图像?