Javascript 在meteor CollectionFS中上载小文件的进度条

使用meteor cfs ui-软件包，您可以显示上传文件的进度条。但这只适用于大于2MB的für文件。如果文件较小，则条从0%跳到100%

我找到了一个解决方案，它使用以下代码：

if(fsFile.original.size < (2097152)*10) {
  var chunkSize = fsFile.original.size / 10;
  FS.config.uploadChunkSize = chunkSize;
}
uploadFile(fsFile, fullFileName, projectId);

上传过程如下所示：

Images = new FS.Collection("images", {
    stores: [
        new FS.Store.FileSystem("something", {
            transformWrite: function (fileObj, readStream, writeStream) {
                // do transformations
            }           
        })]
    });

FS.Utility.eachFile(event, function (file) {
    var newFile = new FS.File(file);
    newFile.uploadedFrom = Meteor.userId();

    data = Images.insert(newFile, function (error, fileObject) {});
});

---

所以我想这是一个愚蠢的问题，但我真的不知道该将代码放在哪里…

上传发生在集合插入时，因此您应该能够在这之前设置

chunkSize

：

FS.Utility.eachFile(event, function (file) {
    var newFile = new FS.File(file);
    newFile.uploadedFrom = Meteor.userId();

    var maxChunk = 2097152;
    FS.config.uploadChunkSize =
      ( newFile.original.size < 10*maxChunk ) ? newFile.original.size/10 : maxChunk;

    data = Images.insert(newFile, function (error, fileObject) {});
});

FS.Utility.eachFile（事件、函数（文件）{
var newFile=newfs.File（文件）；
newFile.uploadedFrom=Meteor.userId（）；
var-maxChunk=2097152；
FS.config.uploadChunkSize=
（newFile.original.size<10*maxChunk）？newFile.original.size/10:maxChunk；
data=Images.insert（newFile，函数（error，fileObject）{}）；
});

此外，如果您使用的是

FS.EventHandlers.insertFiles

，并且看不到加载栏，请在客户端代码中创建此函数：

/**
 * Replace for original FS.EventHandlers.insertFiles function.
 */
function cfsInsertFiles(collection, options) {
  options = options || {};
  var afterCallback = options.after;
  var metadataCallback = options.metadata;

  function insertFilesHandler(event) {
    FS.Utility.eachFile(event, function (file) {
      var f = new FS.File(file);
      var maxChunk = 2097152;
      FS.config.uploadChunkSize =
        (f.original.size < 10 * maxChunk) ? f.original.size / 10 : maxChunk;
      if (metadataCallback) {
        FS.Utility.extend(f, metadataCallback(f));
      }
      collection.insert(f, afterCallback);
    });
  }

  return insertFilesHandler;
}

---

代码看起来像是在强制分块上传，而不管大小。当你只想更改进度条的某些内容时，为什么要放慢用户上传如此小的文件的速度？因为在慢速连接上2MB可能需要一段时间，如果没有进度条，用户可能会认为应用程序已被楔入。此外，我建议你设置最小大小，例如：10KB，以避免出现退化情况。

Template.files.events({
    'dropped .imageArea': cfsInsertFiles(Images, {
      metadata: function (fileObj) {
        return {
          owner: Meteor.userId(),
          foo: "bar"
        };
      },
      after: function (error, fileObj) {
        console.log("Inserted", fileObj.name);
      }
    })
});