Mongodb 如何在Meteorjs中从gridFS获取图像

我正在MeteorJS中使用gridFS包

系统所做的是上传带有图片、标题、类别和价格的产品。这将保存在产品集合中

有了模板助手，我可以从数据库中获得一个标题为{{title}和价格为{{price}的产品。但是我一直在使用产品文档中的引用获取图像

有人能帮我吗

    <template name="product">
        <div class="small-6 medium-3 columns end">
                <div class="product-container">
                    <div class="image-container">
                        {{#with image}}
                            <img src="{{this.url}}" class="product-image" alt="" />
                        {{/with}}
                    </div>
                    <div class="product-details">
                        <div class="product-title">
                            <a href="/productpage">{{title}}</a>
                        </div>
                        <div class="product-price">
                            {{price}}
                        </div>
                        <div class="product-buttons">
                            <span class="icon-heart"></span>
                            <span class="icon-repost"></span>
                            <span class="icon-plus"></span>
                        </div>
                    </div>
                </div>
            </div>
    </template>

---

您可以像这样将引用存储在productImages集合中

 var file = $('#file').get(0).files[0],
     fsFile = new FS.File(file),
     productData = {
       title:$('#title').val(),
       price:$('#price').val(),
       category:$('#category').val()
                }
    Products.insert(productData,function(err,result){
               if(!err){
                 fsFile.metadata = {
                        productId:result, //we use metadata to refer the recent object id with the product images
                    }
                 productImages.insert(fsFile,function(err,result){
                  if(!err){
                     console.log("New images inserted")
                    }
                  });
                 }
               });

这是相同的插件，但更干净一点

现在您可以像这样使用helper和

this

上下文

 var file = $('#file').get(0).files[0],
     fsFile = new FS.File(file),
     productData = {
       title:$('#title').val(),
       price:$('#price').val(),
       category:$('#category').val()
                }
    Products.insert(productData,function(err,result){
               if(!err){
                 fsFile.metadata = {
                        productId:result, //we use metadata to refer the recent object id with the product images
                    }
                 productImages.insert(fsFile,function(err,result){
                  if(!err){
                     console.log("New images inserted")
                    }
                  });
                 }
               });

HTML

{{#each products}}
   {{title}}
   {{price}}
    {{#with image}}
      IMG URL:{{this.url}}
      <img src="{{this.url}}" />
    {{/with}}
 {{/each}}

---

嘿，谢谢你。但它仍然不起作用。但是我没有发现任何错误。我已经更新了我的代码。我发现我同时安装了gridFS和cfs:filesystem，这有关系吗？你不确定图像是否被插入并保存在~/uploads/full路径上？如果运行productImages.fetch（），会得到什么？是的，我检查了文件系统，这些图像存储在正确的路径中。我在哪里运行它？（对JS&meteor来说是个新概念）我已经在控制台中运行了它，但是运行了一个错误。在控制台上运行productImages.find（）.fetch（）；如果您得到的类似“productImages”的东西不存在，您是否删除了不安全的包？如果是，您有发布/订阅功能？当我运行时，我会得到一个带有FS.File的数组

{{#each products}}
   {{title}}
   {{price}}
    {{#with image}}
      IMG URL:{{this.url}}
      <img src="{{this.url}}" />
    {{/with}}
 {{/each}}

Template.example.helpers({
  products:function(){
   return Products.find()
  },
   image:function(){
   return productImages.findOne({'metadata.productId':this._id})
   }
})