Estoy usando con éxito node-webshot para crear una captura de pantalla de una URL en el nodo:

 const removalURL = removeItem.url[0]; const renderStream = webshot(removalURL); const file = fs.createWriteStream("screenshot.png", { encoding: "binary", }); renderStream.on("data", function (data) { file.write(data.toString('binary'), 'binary'); });

Sin embargo, en realidad no quiero almacenar o guardar la imagen de la transmisión, solo quiero mostrarla en la parte frontal del sitio para el usuario. Esperaba poder hacer esto a través de alguna combinación de node fs / blob / createObjectURL, pero no he podido obtener nada que se muestre como una imagen adecuada en la interfaz. Lo intenté:

 const removalURL = removeItem.url[0]; const renderStream = webshot(removalURL); let imgStream = `data:image/png;base64,`; renderStream.on("data", function (data) { console.log("render data", data); imgStream += Buffer.from(data).toString("base64"); });

donde imgStream terminaría como el atributo src de la imagen.

El registro de la consola se ve así:

 <Buffer aa c2 26 eb 04 35 48 2a 6c 2e b0 e2 f1 78 58 bd af c6 7b ec ea ee 51 87 bd 5f b0 51 cb a5 9d c2 bd 6b 0c fc b9 b7 86 3b 0e c9 67 68 15 85 d1 47 58 e0 ... 6094 more bytes>

y la etiqueta img resultante src se ve así:

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

pero la imagen aparece rota en el sitio web. ¿Cómo hago para que esta imagen se muestre correctamente en el sitio sin escribir primero el archivo en el disco?