将缓冲区数据转换为图像

Question

我如何将此缓冲区数据转换为图像，以便当循环结果并将其呈现在 img src 中时，它将呈现为用户可以看到的图像

我正在使用 ejs 来渲染它

     <span>
        <img class="user-with-avatar" src=<%=item.photo%> />
     </span>

当我 console.log(result.data.photo) 时，我得到这个

{"type":"Buffer","data":[100,97,116,97,58,14,79,8,113,97,65,43,57,55,89,69,88,51,66,101,70,86,112,121,112,121,121,121,80,81,104]},
{"type":"Buffer","data":[100,97,116,97,58,14,79,8,113,97,65,43,57,55,89,69,88,51,66,101,70,86,112,121,112,121,121,121,80,81,104]},
{"type":"Buffer","data":[100,97,116,97,58,14,79,8,113,97,65,43,57,55,89,69,88,51,66,101,70,86,112,121,112,121,121,121,80,81,104]}

我该如何用这个代码安排来修复它

    app.get('/products', function (req, res) {
            if (req.session.token && req.session.user_id) {
                let data = {
                    token: req.session.token,
                    id: req.session.user_id,
                }
                let url = `https:/url/product/get_products?id=${data.id}&token=${data.token}`
                functions.callAPIGet(
                    url,
                    function (error, result) {
                        res.render('products', {
                            result: result.data
                        })
                    }
                );
            } else {
                res.redirect('/login')
            }
        });

Answer 1

您需要将缓冲区转换为 Base64 字符串。以下是 PNG 图像的示例。我不清楚你的图像存储在哪里以及它的格式。此示例将图像读取为文件。可能需要根据您的数据源进行调整。

服务器.js

const express = require('express')
const app = express()
const fs = require('fs')
app.set('view engine', 'ejs')

app.get('/', function(req, res) {
  const data = fs.readFileSync('./image.png')

  res.render('page', {
    image: data.toString('base64')
  })
})

const server = app.listen(2000)

视图/page.ejs

<img src="data:image/png;base64,<%= image %>" />