在MongoDB中存储dataURL以通过本地URL(JS)访问它

时间:2017-07-10 16:43:53

标签: javascript mongodb image reactjs meteor

所以我不知道我的标题是否足够清楚,我想要做的是,在我的Meteor应用程序中,有一个工具将文件上传到我的MongoDB,并输出一个我可以使用的URL例如,它显示为一个的src 然而,我创建了我的收藏:

export const Files = new Mongo.Collection('files');

和一个addFile函数:

export const addFile = (nameArg: String, dataURL: String) => {
 Files.insert({
  _id: uuid(),
  name: nameArg,
  url: dataURL
 });
console.log("file "+nameArg+" added");
};

然后我使用react-jsonschema-form包来显示文件格式

<Form
  schema={{
    type: 'object',
    properties: {
       file: {
         type: 'string',
         title: 'Upload an image to get its URI'
         }
       }
  }}
  uiSchema={{
    file: {
       'ui:widget': 'file'
    }
  }}
  onChange={this.onChange}
  liveValidate
  >
  <div />
</Form>

我的onChange功能:

onChange = (e: { formData: { file: string } }) =>{
  const [dataType, nameBis,] = e.formData.file.split(';');
  const name = nameBis.split('=')[1];
  Promise.resolve().then(addFile(name, e.formData.file));

}

我想使用地址sush window.location.host+'/file/'+name 能够使用此图像。 我相信它是可能的,但是怎么样?

感谢所有回复:)

1 个答案:

答案 0 :(得分:0)

使用包cfs:standard-packagescfs:filesystem可以安全地进行此操作。坦率地说,我没有深入探讨你的问题。

这是一个美丽的包。您可以阅读上述here packages in depth

创建文件系统集合的代码

var imageStore = new FS.Store.FileSystem("YOUR_COLLECTION_NAME");

YOUR_COLLECTION_NAME = new FS.Collection("YOUR_COLLECTION_NAME", {
  stores: [imageStore]
});

简而言之。这些文件将保存在同级bundle/的{​​{1}}位置。有关该文件的信息将保存在集合cfs/files/YOUR_COLLECTION_NAME中,临时位置将用于集合cfs.YOUR_COLLECTION_NAME.filerecord的内部用途,如下所示。

如果使用上述包保存任何文件。元数据将保存在cfs._tempstore.chunks内,如下所示

cfs.YOUR_COLLECTION_NAME.filerecord

在客户端,您可以使用

获取指向文档文件的链接

{ "_id" : "TBmxbsL2cMCM2tEc7", "original" : { "name" : "photo.jpg", "updatedAt" : ISODate("2017-07-06T12:54:50.115Z"), "size" : 2261, "type" : "image/jpeg" }, "uploadedAt" : ISODate("2017-07-08T06:58:32.433Z"), "copies" : { "YOUR_COLLECTION_NAME" : { "name" : "photo.jpg", "type" : "image/jpeg", "size" : 2261, "key" : "YOUR_COLLECTION_NAME-TBmxbsL2cMCM2tEc7-photo.jpg", "updatedAt" : ISODate("2017-07-08T06:58:32.475Z"), "createdAt" : ISODate("2017-07-08T06:58:32.475Z") } } }

此网址是基于令牌的文件安全链接,而非直接位置到您的服务器。您可以像普通集合一样为下载和设置其他允许/拒绝设置。希望这有帮助!