使用Express渲染Base64 PNG

Question

我的Node.js服务器有以下类似的内容：

app.get("/api/id/:w", function(req, res) {
    var data = getIcon(req.params.w);
});

在这里，data是一个包含PNG图像的Base64表示的字符串。是否有任何方式可以将其作为图像发送给访问路由的客户端（例如，使URL可用于img标签中）？

- Hydrothermal

---

它是什么类型的图片？要将其发送到客户端，您需要知道该图片的内容类型（JPEG、PNG、GIF、ICO）是什么？ - loganfsmyth

这是一个PNG格式的文件；我已经编辑了我的问题来提到它。 - Hydrothermal

Answer 1

是的，您可以将base64字符串编码并将其作为图像返回给客户端：

server.get("/api/id/:w", function(req, res) {
    var data = getIcon(req.params.w);
    var img = Buffer.from(data, 'base64');

   res.writeHead(200, {
     'Content-Type': 'image/png',
     'Content-Length': img.length
   });
   res.end(img); 
});

- Ben Diamant

---

var img = new Buffer(data, 'base64'); - lujcon

这正是我所需要的！根据@lujcon的评论，我用data替换了data.buffer，现在它完美地工作了。 - Hydrothermal

谢谢，功能很好，除了new Buffer(data, 'base64')现在已经被弃用...应该使用Buffer.from(data, 'base64')代替。 - drmrbrewer

谢谢！“内容长度”头对我非常重要，否则图片就无法加载。我在这上面浪费了两天的时间，但很高兴找到了答案！ - Adil Maqusood

在将其作为图像缓冲之前，您需要从base64字符串中删除前缀（data:image\/png;base64），正如@JayCrossler所解释的那样。 - Gkiokan

Answer 2

我必须先进行一些操作才能将我的内容格式化正确，但这很有效：

  var base64Data = data.replace(/^data:image\/png;base64,/, '');

- JayCrossler

---

这应该是被接受的答案，不需要第三方！ - Luke Brown

你也可以使用 var base64Data = data.split(',')[1]。 - preciousbetine

Answer 3

使用 "base64-img" 组件：

app.get('/image1', function(req, res) {

  var image1 = 'image1.jpg';

  var base64Img = require('base64-img');
  var imageData1 = base64Img.base64Sync(image1);
  var base64Data = imageData1.replace(/^data:image\/(png|jpeg|jpg);base64,/, '');
  var img = Buffer.from(base64Data, 'base64');

  res.writeHead(200, {
    'Content-Type': 'image/png',
    'Content-Length': img.length
  });
  res.end(img);

});

- neurona.dev