如何使用Meteor处理文件上传？

Question

使用Meteor处理文件上传的规范方法是什么？

Answer 1

我用过http://filepicker.io.他们将上传文件,将其存储到S3中,然后返回文件所在的URL.然后我只是把网址放到数据库中.

1. 将filepicker脚本输入到客户端文件夹中.

   wget https://api.filepicker.io/v0/filepicker.js
   

2. 插入filepicker输入标记

   <input type="filepicker" id="attachment">
   

3. 在启动时,初始化它:

   Meteor.startup( function() {
       filepicker.setKey("YOUR FILEPICKER API KEY");
       filepicker.constructWidget(document.getElementById('attachment'));
   });
   

4. 附加事件处理程序

   Templates.template.events({
       'change #attachment': function(evt){
           console.log(evt.files);
       }
   });
   

Answer 2

对于图像,我使用类似于Dario的方法,除了我不将文件写入磁盘.我将数据作为模型中的字段直接存储在数据库中.这对我有用,因为我只需要支持支持HTML5 File API的浏览器.我只需要简单的图像支持.

Template.myForm.events({
  'submit form': function(e, template) {
    e.preventDefault();
    var file = template.find('input type=["file"]').files[0];
    var reader = new FileReader();
    reader.onload = function(e) {
      // Add it to your model
      model.update(id, { $set: { src: e.target.result }});

      // Update an image on the page with the data
      $(template.find('img')).attr('src', e.target.result);
    }
    reader.readAsDataURL(file);
  }
});

Answer 3

我刚刚使用Meteor.methods和HTML5 File的API 提出了文件上传的实现.让我知道你的想法.

Answer 4

目前似乎没有办法与HTTP服务器交互或执行与HTTP相关的任何事情.

您可以做的唯一事情是通过Meteor.methods公开的RPC方法与服务器通信,或者直接通过暴露的mongoDB API与mongoDB交谈.

Answer 5

有一个新的包:edgee:弹弓.它不会将文件上传到您的流星服务器,但它更好的方式,因为它允许流星服务器专注于其服务流星应用程序的主要目标,而不是处理昂贵的文件传输.

相反,它将文件上传到云存储服务.目前它支持AWS S3和Google Cloud Files,但它也将支持Rackspace Cloud Files以及未来的Cloudinary.

您的流星服务器仅仅充当协调器.

它也是一种用途广泛且重量轻的包装.

Answer 6

有一个叫做路由器的气氛包就可以了.

实际上,处理文件上传的最佳方法现在是collectionFS

Answer 7

这是目前最好的解决方案.它使用collectionFS.

meteor add cfs:standard-packages
meteor add cfs:filesystem

客户:

Template.yourTemplate.events({
    'change .your-upload-class': function(event, template) {
        FS.Utility.eachFile(event, function(file) {
            var yourFile = new FS.File(file);
            yourFile.creatorId = Meteor.userId(); // add custom data
            YourFileCollection.insert(yourFile, function (err, fileObj) {
                if (!err) {
                   // do callback stuff
                }
            });
        });
    }
});

服务器:

YourFileCollection = new FS.Collection("yourFileCollection", {
    stores: [new FS.Store.FileSystem("yourFileCollection", {path: "~/meteor_uploads"})]
});
YourFileCollection.allow({
    insert: function (userId, doc) {
        return !!userId;
    },
    update: function (userId, doc) {
        return doc.creatorId == userId
    },
    download: function (userId, doc) {
        return doc.creatorId == userId
    }
});

模板:

<template name="yourTemplate">
    <input class="your-upload-class" type="file">
</template>