Question

我在Meteor应用程序上使用Phantom.js创建了一个HTML5画布，我正在尝试将Canvas图像保存在磁盘上。

问题：保存的图像文件似乎已损坏（无法在图像查看器中将其打开）。

我从HTML5 Canvas.toDataUrl方法获得了base64编码的PNG图像。这是我从Canvas.toDataUrl（）函数保存的输出如下所示： WzMyLDMyLDU4LDQ3LDEwOSwxMTEsMTAwLDExNywxMDgsMTAxLDExNSw0NywxMTksMTAxLDk4LDExMiw5NywxMDMsMTAxLDQ2LDEwNiwxMTUsNTgsNTAsNTYsNDksMTBd

这是我的保存例程：

var buffer = new Buffer(JSON.stringify(CanvasString)).toString('base64');
var fs = Meteor.npmRequire("fs");
var fullFileName = fileName + '.png';
fs.writeFileSync(fullFileName, buffer, "binary");

我可以使用文本编辑器（如上面的输出）将保存的图像视为纯文本。

Answer 1

尝试以下步骤：

// our data URL string from canvas.toDataUrl();
var imageDataUrl = "data:image/png;base64,[...]";
// declare a regexp to match the non base64 first characters
var dataUrlRegExp = /^data:image\/\w+;base64,/;
// remove the "header" of the data URL via the regexp
var base64Data = imageDataUrl.replace(dataUrlRegExp, "");
// declare a binary buffer to hold decoded base64 data
var imageBuffer = new Buffer(base64Data, "base64");
// write the buffer to the local file system synchronously
fsWriteFileSync("/tmp/test.png", imageBuffer);

注意：您可能不希望使用fs.writeFileSync在Node.JS中的磁盘上写入，因为它会阻止整个Node事件循环。

而是使用Meteor.wrapAsync包裹来电：

var fsWriteFileSync = Meteor.wrapAsync(fs.writeFile, fs);

如何使用Node.js保存图像（以base64编码的字符串形式传入）

1 个答案: