Question

我正在制作一个电子应用程序，我希望用户能够将当前页面的屏幕截图保存为图像文件。为此，我使用html2canvas创建当前正文的canvas元素，然后将该画布转换为DataURL

html2canvas(document.body, {
    onrendered: function(canvas) {
        var image = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");

这样可行，但我现在想使用Node.js文件系统将其保存到图像文件

        fs.writeFile("testImg.png", image, 'binary', (err) => {
            if (err) console.log("didnt work", err);
            else console.log("write worked");
        });

这会写一个名为＆＃34; testImg.png＆＃34;的文件。到我的硬盘上，但文件只包含：＆＃34; [对象HTMLImageElement]＆＃34;，大小为25kb

        window.location.href=image;

这会打开一个对话框供我保存图像文件，并且实际上也保存了图像，所以我现在的问题是如何在没有用户对话框的情况下将我生成的图像保存到文件中。

Answer 1

您可以使用网络文件API将数据网址转换为缓冲区，例如使用https://dev.mysql.com/doc/refman/5.6/en/c-api-building-clients.html。

但更好的解决方案是使用FileReader.readAsDataURL截取屏幕截图 - 这比使用html2canvas要容易得多。

更新

糟糕，＆＃39; readAsDataURL＆＃39;对你没用，因为你已经有了数据网址，抱歉。你可以BrowserWindow#capturePage到缓冲区的URL，因为它只是base64，但是你应该真的想要使用＆＃39; capturePage＆＃39;相反，因为它可能是创建屏幕截图的更好工具。

使用来自canvas.toDataURL（）的node.js保存图像文件

1 个答案: