img 标签不会从后端显示 src base64

Question

我有来自后端的 base64 图像格式，我希望它使用 img 标签显示在前端

这是代码

router.get('/image_front/:id', function(req, res){
Delivery.findById(req.params.id, function(err, x){
    if(err){
        res.send({'error': err})
    }else{
        let v = 'data:image/png;base64'+', '+ new Buffer.from(x.image_front.data).toString('base64')
        res.send(v)
    }
})
})

对于前端

<img id="sample" src="/image_front/<%=x._id%>" />

当图像源激活链接时，返回数据：image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAKQAAA .. 当我将图像复制并粘贴到 w3schools 以检查数据没有损坏时，它可以工作。 似乎数据有效，但不会使用图像标签显示。 我不知道出了什么问题。

Answer 1

仅当您在 html 中嵌入图像数据时，才需要 base64 字符串编码。

要直接将图像传递给客户端，请返回具有正确内容类型的数据。

router.get('/image_front/:id', function(req, res){
    Delivery.findById(req.params.id, function(err, x){
        if(err){
            res.send({'error': err})
        } else {
            res.type('png')
            res.send(x.image_front.data)
        }
    })
})

Answer 2

Base64 编码根本不是您想要的。 只需返回图像本身。

res.set('Content-Type', 'image/png');
res.end(x.image_front.data);