无法在Electron / Nodejs中显示Uint 8Array

zsbz8rwp 于 2023-03-27 发布在 Electron

关注(0)|答案(1)|浏览(323)

我有一个大的Uint8Array（相机的帧）编码在bgra8中，因为我收到的原因是Buffer。我添加了这些信息，以防有人指出这可能是问题的一部分：
这是发送时的数据：

这是发送时数据转换的代码：

Buffer.from(cam_message.data)

这是在Electron主进程中接收到的数据（不同的帧）：

为了显示这些数据，我进行了如下转换：How to display a JPG image from a Node.js buffer (UInt8Array)
也就是说，我将此消息发送到渲染器进程：

Buffer.from(camdata).toString('base64')

在渲染过程中，我将其作为变量value接收，并更新图像的src：

imgeg.src = `data:image/jpg;base64,${value}`

但是图像永远不会显示（只显示“图像”图标，所以这不是HTML的问题）。那么这可能是bgra8的问题吗？或者是Buffer或Uint8Array数据类型的问题，以及我缺乏如何使用它们的知识？

electron

来源：https://stackoverflow.com/questions/75818037/unable-to-display-uint8array-in-electron-nodejs

1条答案

按热度按时间

o2rvlv0m1#

正如@AndrewParks告诉我的那样，这是一个问题，我试图将此图像显示为jpg，而不是将其视为bgra8，这是正确的编码。这是我写的代码：
现在，在接收到数据并将其发送到渲染器进程之前，我再次将数据转换为Uint8Array，而不是Buffer：

Uint8Array.from(camdata.data)

在渲染过程中，我将其作为变量value接收，并使用<canvas>而不是<img>：

var canvas = document.getElementById('canv');
      var ctx = canvas.getContext('2d');
      var canvasWidth = canvas.width;
      var canvasHeight = canvas.height;
      ctx.clearRect(0, 0, canvasWidth, canvasHeight);
      var id = ctx.getImageData(0, 0, canvasWidth, canvasHeight);
      var pixels = id.data;

      for(var i=0; i<pixels.length; i=i+4){
          pixels[i] = value[i+2];
          pixels[i+1] = value[i+1];
          pixels[i+2] = value[i];
          pixels[i+3] = 255;
      }
      ctx.putImageData(id, 0, 0);

参见：What's the best way to set a single pixel in an HTML5 canvas?

赞(0）回复(0）举报 2023-03-27

我来回答

无法在Electron / Nodejs中显示Uint 8Array

1条答案

相关问题

热门标签

最新问答