NodeJS 是否将数据URI保存为图像?

piah890a  于 2023-10-17  发布在  Node.js
关注(0)|答案(4)|浏览(163)

在一个节点服务器上,我想保存上传的datauri数据作为图像。为了做到这一点,我试着解码这个PNG的内容-

  1. data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAACCAIAAAFlEcHbAAAAB3RJTUUH1gMWFjk7nUWcXQAAAAlwSFlzAABOIAAATiABFn2Z3gAAAARnQU1BAACxjwv8YQUAAAAeSURBVHjaY7h79y7DhAkTGIA04/Tp0xkYGJ49ewYAgYwLV/R7bDQAAAAASUVORK5CYII=

并将其保存为.png扩展名。看起来还有更多的东西。如何解码数据并将其保存为文件?

kzmpq1sx

kzmpq1sx1#

我试图使用atob解码数据并将其保存为png文件。相反,我将其保存为base64编码,但在写入缓冲区中指定编码。
fs.writeFileSync('tmp/myfile.png', new Buffer(data, 'base64'));

3lxsmp7m

3lxsmp7m2#

你可以使用下面的代码将你的数据URI转换成一个blob:

  1. function dataURItoBlob(dataURI) {
  2. var byteStr;
  3. if (dataURI.split(',')[0].indexOf('base64') >= 0)
  4. byteStr = atob(dataURI.split(',')[1]);
  5. else
  6. byteStr = unescape(dataURI.split(',')[1]);
  7. var mimeStr = dataURI.split(',')[0].split(':')[1].split(';')[0];
  8. var arr= new Uint8Array(byteStr.length);
  9. for (var i = 0; i < byteStr.length; i++) {
  10. arr[i] = byteStr.charCodeAt(i);
  11. }
  12. return new Blob([arr], {type:mimeStr});
  13. }

然后你可以将这个blob数据附加到from data中,并将其作为文件上传:

  1. var blob = dataURItoBlob(dataURI);
  2. var fd = new FormData(document.forms[0]);
  3. fd.append("image", blob);
展开查看全部
hmtdttj4

hmtdttj43#

你可以使用Node的原生fs模块来实现这一点,但是你需要像这样从URI字符串中分离出数据:

  1. import fs from 'fs';
  2. fs.writeFileSync('./filename.png', Buffer.from(dataURI.split(',')[1], 'base64'));
js4nwp54

js4nwp544#

我已经创建了一个与Node.js一起使用的库,它有助于对数据URI方案进行编码和解码。我相信它可以帮助你,检查:
https://github.com/DiegoZoracKy/image-data-uri
使用这个库,在你的例子中,代码将是:

  1. 'use strict';
  2. const ImageDataURI = require('image-data-uri');
  3. const dataURI = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAACCAIAAAFlEcHbAAAAB3RJTUUH1gMWFjk7nUWcXQAAAAlwSFlzAABOIAAATiABFn2Z3gAAAARnQU1BAACxjwv8YQUAAAAeSURBVHjaY7h79y7DhAkTGIA04/Tp0xkYGJ49ewYAgYwLV/R7bDQAAAAASUVORK5CYII=';
  4. const fileName = 'decoded-image.png';
  5. ImageDataURI.outputFile(dataURI, filePath);

相关问题