在node中怎么解析自己的html转化成base64的图片

在node中怎么解析自己的html转化成base64的图片。这是我代码:

 res.render(path.join(__dirname + '/public/index.html'), { time: time, list: data }, async function (err, result) {
        if (err) {
            console.log(err);
        } else {
            console.log(result)
                        }
                        })

别人请求我接口,我得到time和data渲染好页面得到了result,reult是一个html模版,类似于这样:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
   </head>

<body>
    <div id="root">
       213123
    </div>
</body>

</html>

现在我想把模版解析生产base64的图片返回出去,前端好分享我这个图片

在 Node.js 中,可以使用 html-to-image 和 node-canvas 库将 HTML 转化为图片,并将图片转换为 base64 编码。具体实现步骤如下:

1、安装依赖库
在 Node.js 项目目录下,使用以下命令安装依赖库:

npm install html-to-image node-canvas

2、编写代码
在 Node.js 项目中,使用以下代码将 HTML 转化为图片并将图片转换为 base64 编码:

const { createCanvas } = require('canvas');
const { toPng } = require('html-to-image');
// HTML 标记
const htmlString = '<div>Hello World!</div>';
// 创建 Canvas 对象
const canvas = createCanvas(200, 100);
const ctx = canvas.getContext('2d');
// 将 HTML 转化为图片,并绘制到 Canvas 上
toPng(htmlString, { quality: 0.95 })
  .then((img) => {
    const image = new Image();
    image.src = img;
    ctx.drawImage(image, 0, 0);
    
    // 将 Canvas 转化为 base64 编码
    const base64Data = canvas.toDataURL().replace(/^data:image\/\w+;base64,/, '');
    
    console.log(base64Data);
  })
  .catch((error) => {
    console.error('An error occurred:', error);
  });

在上面的代码中,首先通过 html-to-image 库的 toPng 方法将 HTML 标记转化为 PNG 格式的图片,并将其绘制到 Canvas 对象上,然后通过 canvas.toDataURL() 方法将 Canvas 转化为 base64 编码并输出到控制台上。
需要注意的是,在使用 node-canvas 库时,需要安装一些系统依赖库,具体可以参考该库的文档进行安装。