关于node.js:readFileSync和readAsDataURL有什么区别?

what is the difference between readFileSync and readAsDataURL?

注意:这不是生产应用程序。这是我正在开发的一个小应用程序,用于探索从数据库中选择,打开,保存和读取图像的功能。

我不知道应该使用哪种方法来获取正确的Buffer数据以将图像存储在mongodb中。 (我知道mongoDB的文档限制为16mb)

在我的应用中,我希望用户能够从其PC上的文件中选择图像,为用户提供图像的预览,然后在用户单击"提交"(此处未显示)时将图像保存到mongodb中

我知道当用户单击"选择文件"按钮时,我可以得到如下文件:

1
2
3
4
5
6
7
8
    const file = event.target.files[0]

    if (!file) {
        // user has hit the cancel button
        return;
      }        

    //console.log(file);

我可以获取有关文件的信息:

1
2
    console.log(file.type);
    console.log(file.size);

这是读取图像的方式:

1
2
3
4
5
    let fr = new FileReader();
    fr.readAsDataURL(file);
    fr.onload = (e) =>{
        this.productImageAdd(e.target.result);
    }

这是在(反应)组件状态下存储图像的方式

1
2
3
4
5
6
productImageAdd = (file) => {

    let temp = this.state["filesArray"] || [];
    temp.push(file);
    this.setState({"filesArray": temp});
}

这是我组件的状态

1
2
3
this.state = {
  filesArray: [],
};

在另一个组件中,我获得了所有图像的列表,然后将它们映射到要显示的项目:

1
2
3
return filesArray.map((file, index) => (
  <FileDropZoneItem key={index} id={index} file={file} />
));

在FileDropZoneItem中,这是"预览"图像的方式:

1
2
3
4
5
6
7
    return (
        <li className="flex-item">
          <img src={file} width="200" height="200"/>
       
</li>

    );

我看到了这个stackoverflow问题,我正在朝着将图像存储在MongoDB中的方向迈进:

使用Node.js / Express和Mongoose将图像存储在MongoDB中

在那篇文章中,他们的架构是这样的:

1
2
3
var schema = new Schema({
    img: { data: Buffer, contentType: String }
});

然后他们像这样存储图像:

1
2
3
4
var A = mongoose.model('A', schema);
var a = new A;
a.img.data = fs.readFileSync(imgPath);
a.img.contentType = 'image/png';

但是我真的不知道fs.readFileSync和fr.readAsDataURL之间的区别。

将使用fr.readAsDataURL存储到mongodb工作还是我需要fs.readFileSync?

我还看到:HTML5 FileReader API中的readAsBinaryString()和readAsDataURL()之间的区别


来自MongoDB手册GridFS
GridFS使用两个集合来存储文件。一个集合存储文件块,另一个集合存储文件元数据。 GridFS集合一节详细描述了每个集合。

作为参考,您可以阅读在MongoDB中存储图像

readAsDataURL允许将图像存储在编码为base64字符的JSON文档中。考虑到产品图片的大小,200px x 200px似乎是您好世界应用程序的最佳选择。

readFileSync可能会在服务器(例如Node.js)中出现阻塞问题,以处理图像,并读取二进制文件以将其存储为二进制数据。

IMO最好的解决方案是不要在mongoDB和Nodejs上进行图像处理,并且仅将图像的URL存储在mongoDB文档中,而将图像服务进程留给像nginx这样的代理。

Gridfs选项取决于所使用的驱动程序。以下是Gridfs在使用自己的读取器的Node.js中的使用:

1
2
fs.createReadStream('./meistersinger.mp3').
pipe(bucket.openUploadStream('meistersinger.mp3')).