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

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

目前似乎没有一种与HTTP服务器交互或执行任何与HTTP相关的操作的方法

---

你唯一能做的就是通过Meteor.methods公开的RPC方法与服务器对话，或者通过mongoDB公开的API直接与mongoDB对话。

你可以尝试直接上传到amazon S3，使用js上传器等做些小动作。 我用过。他们将上传文件，将其存储到S3中，并返回文件所在的URL。然后我就把url放到数据库中

将filepicker脚本设置到客户端文件夹中

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

插入文件选择器输入标记

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

附加事件处理程序

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

---

我刚刚提出了使用Meteor.methods和HTML5文件的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);
  }
});

---

有一个名为atmosphere的包，它允许这样做

实际上，处理文件上传的最佳方式是现在

您可以在上看到“文件上传模式”功能计划在“1.0之后”。因此，我们必须等待看到一个正式的方式

目前，最好的方法之一是使用（在编写时使用0.3.x dev preview）

或者像这里建议的那样。它很容易使用，尽管这显然需要用户端的网络连接

---

如果只是为了玩，你也可以利用html5的功能。类似于。

如果您不需要非常大的文件，或者可能只需要在短时间内存储文件，那么这个简单的解决方案非常有效

在你的html中

<input id="files" type="file" />

订阅集合并在模板中呈现链接

<a href="{{dataUrl}}" target="_blank">{{name}}</a>

---

虽然对于大型文件或文件密集型应用程序来说，这可能不是最健壮、最优雅的解决方案，但如果您想实现简单的文件上传和下载/呈现，它对所有类型的文件格式都非常有效。

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

客户：

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>

---

要在不使用filepicker.io的情况下完成与最上等答案相同的操作，请按照此软件包的说明进行操作：

然后，要获得链接，请使用与下面类似的代码。最后，将secureLink返回的url插入数据库

Template.YourTemplate.events({
  "click button.upload": function() {
    var files = $("input.file_bag")[0].files;
    S3.upload(files, "/subfolder", function(e,r) {
      console.log(r);
      Session.set('secureLink', r.secure_url);
    })
  }
});

---

下面是另一个解决方案：

这一个使用的是Blueimp的上传解决方案，该解决方案支持分块上传、进度条等。

有一个新的包：。它不会将文件上传到您的meteor服务器，但这样做更好，因为它允许meteor服务器专注于服务meteor应用程序的主要目标，而不是处理昂贵的文件传输

相反，它将文件上传到云存储服务。目前，它支持AWS S3和Google云文件，但它也将支持Rackspace云文件，将来可能还会支持Cloudinary

你的meteor服务器只是作为一个协调器

---

它也是一款功能齐全、重量轻的包装。

这是一个模糊的问题。。。您是在问如何在客户端或服务器上处理它？不管是哪种方式，我想（我从未使用过meteor）处理文件上传的方式与处理任何服务器的方式几乎相同。客户端：将POST请求发送到URL，并将该文件作为请求正文的一部分。服务器端：在该URL上侦听POST请求，当有请求进来时，读取请求正文，并对其中包含的任何文件执行任何操作。这就是我使用node/spring的基本方法。。。如果你能更具体地说明你需要什么帮助，也许我能帮上更多的忙…嗨，杰金，你应该看看流星，这就是为什么它是一个有趣的问题：谢谢雷诺斯。可能会尝试Luan的方法，并通过JS上传程序绕过S3或类似的上传。@Raynos您知道公开的Mongo API是否支持GridFS吗？我看不出有人提到它。@stevejalim我不知道，去读mongo API子集的源代码吧supports@stevejalim我查看了源代码，minimongo（他们使用的软件包）中没有任何GridFS支持。我来晚了一点，但是你也可以看看eventedmind.com的最后几集，在那里我正在为meteor构建一个文件上传程序。该软件包的流媒体上传版本将于本周发布。它被称为meteor-file。所以，这些指令出人意料地有效。这个解决方案比我预期的简单10倍，而且代码工作得非常完美。也就是说，该解决方案将图像直接上传到node.js本地文件系统。它一开始在本地开发人员的机器上运行得很好，但在平台即服务（PaaS）提供商（包括Heroku和Nodjitsu）方面存在问题。问题在于此解决方案存在文件系统权限问题。因此，此解决方案需要托管您自己的服务器，或者拥有更强大的基础设施，如Amazon Elasticbeanstalk.Yay、filepicker.io！与Heroku的合作非常有魅力。它只有10天的试用期是免费的：（Pfff..我不会只为上传文件到S3支付100美元。Echo@rijk，不知道为什么付费服务是#1投票答案..或者两者都是免费的解决方案，实现了开源libs。我使用

edgee:slingshot

，它对大文件非常有用（直接上传到S3，而不是通过应用服务器）.collectionFS非常强大，目前看来这是最好的方法。CFS插件组不适合生产-因为它们，我们的Meteor应用程序部署不断失败，尤其是在将应用程序升级到Meteor 1.0之后。我强烈建议不要使用CFS包。我使用您的所有代码。Meteor

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>

Template.YourTemplate.events({
  "click button.upload": function() {
    var files = $("input.file_bag")[0].files;
    S3.upload(files, "/subfolder", function(e,r) {
      console.log(r);
      Session.set('secureLink', r.secure_url);
    })
  }
});

Template.YourTemplate.helpers({
  "files": function() {
    return S3.collection.find();
  },

  "secureLink": function() {
    return Session.get('secureLink');
  }
});