从BASE64的NodeJS字符串创建映像 [英] Creating image from base64 string in NodeJS

问题描述

我要上传，我从我通过AJAX的画布和后提取图像，并且我有麻烦建立在我的服务器端的图像文件。

I am trying to upload an image that I extract from a my canvas and post via ajax, and I have trouble creating the image file on my server side.

我有以下这样的回答： http://stackoverflow.com/a/7347358/1358670 但我仍然似乎到这里或者那里错过的东西。

I have following this answer: http://stackoverflow.com/a/7347358/1358670 but still I seem to miss something here or there.

下面是我的JavaScript（浏览器）code：

Here is my javascript (browser) code:

var img = myCanvas.toDataURL("image/jpeg");

// ajax request to send the image

在服务器端，我做以下内容：

and in server side, I do the following:

var fd =  fs.openSync('./img.jpeg', 'w');
req.body.image = req.body.image.replace(/^data:image\/\w+;base64,/, "");
console.log( req.body.image );

var buff = new Buffer(req.body.image, 'base64');
fs.write(fd, buff, 0, buff.length, 0, function(err,written){
    console.log( ">> "+ err );
    fs.closeSync( fd );
});

正如你所看到的，我记录的图像，看它是否被正确发送，它是，但我仍然无法打开创建的 img.jpeg 文件

任何帮助或提示是非常受欢迎的。

any help or hint is very welcome.

我也试过在这里的解决方案： http://stackoverflow.com/a/6933413/1358670 但我仍然有同样的问题。

I've also tried the solution in here: http://stackoverflow.com/a/6933413/1358670 but I still have the same problem

我测试过我的前端侧，在服务器端的PHP脚本，并制作了形象非常好，所以我就断定，这个问题是在我的NodeJS code。

I've tested my front-end side, with a PHP script in the server side, and the image produced was very good, so I would conclude that the problem is in my NodeJS code.

推荐答案

的问题是在对的NodeJS治疗，我并​​不怀疑code，因为它是一样的每一个地方的人评论说，它的方法加工的对于他们来说，没有什么是不同的，所以我没有怀疑的过程，但任何事情做错了。

The problem was in the treatment on NodeJS, and I didn't doubt the code since it was the same every where with people commenting that its worked for them, nothing were different so I didn't doubt the process, but either something done wrong.

当我在PHP脚本检查它我发现的一个步骤，是不是在$的NodeJS C $ C，这里是PHP code：

When checking it in my PHP script I've found a step that is not in the NodeJS code, and here is the PHP code:

$img = $_POST[ 'image' ];

$img = str_replace('data:image/jpeg;base64,', '', $img);
$img = str_replace(' ', '+', $img);

$data = base64_decode($img);
$file = "./". uniqid() . '.png';
$success = file_put_contents($file, $data);
print $success ? $file : 'Unable to save the file.';

这里的区别是： str_replace函数（''，'+'，$ IMG）;

我不知道它是如何工作的人，但对我来说通过更换+中的base64每一个空间解决了我的问题。

I don't know how it worked for others, but for me replacing EVERY space in the base64 by + solved my problem.

新的NodeJS code

New NodeJS code

req.body.image = req.body.image.replace(/^data:image\/\w+;base64,/, "");
req.body.image = req.body.image.replace(/ /g, '+');
console.log( req.body.image );

var buff = new Buffer(req.body.image, 'base64');
fs.write(fd, buff, 0, buff.length, 0, function(err,written){
    console.log( ">> "+ err );
    fs.closeSync( fd );
});

我希望这会帮助别人

I hope this will help someone else

req.body.image = req.body.image.replace(/^data:image\/jpeg+;base64,/, "");
req.body.image = req.body.image.replace(/ /g, '+');

fs.writeFile('./records/'+model+'/out.jpeg', req.body.image, 'base64', function(err) {
    console.log(err);
});

这篇关于从BASE64的NodeJS字符串创建映像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！