首页 > 解决方案 > 如何显示 JSON 文件对象?

问题描述

使用express-fileupload我有一个存储在数据库中的文件的 JSON 对象。

例如:

{
  name: 'bear.jpg',
  data: <Buffer ff d8 ff e0 00 10 4a 46 49 46 00 01 01 00 00 01 00 01 00 00 ff fe 00 3b 43 52 45 41 54 4f 52 3a 20 67 64 2d 6a 70 65 67 20 76 31 2e 30 20 28 75 73 69 ... 15948 more 
bytes>,
  size: 15998,
  encoding: '7bit',
  tempFilePath: '',
  truncated: false,
  mimetype: 'image/jpeg',
  md5: '7505ae720e82ac3b807b3e39483bebab',
  mv: [Function: mv]
}

我目前正在使用 EJS。

如何在 html 中显示此文件?

我希望有类似的东西:

<html>
  <body>
    <img src="<%= the-file %>" width="200" height="200">
  </body>
</html>

这不是将缓冲区数据转换为图像的副本,因为它查询通用文件和标签的技术(另一个示例可能是.glb带有<model-viewer>标签的文件),图像仅用作示例。

标签: javascripthtmlexpressejs

解决方案


<your-tag src="data:<%= file.mimetype %>;base64,<%= file.data.buffer.toString('base64') %>">

应该适用于任何文件类型。

由于your-tag可能对应于特定file.mimetype类型,因此您可以简单地对该类型进行硬编码,例如:

<img src="data:image/jpeg;base64,<%= file.data.buffer.toString('base64') %>">

有用的链接:

不知道为什么以前不能简单地回答。


推荐阅读