将dropzone.js与meteor.js结合使用 [英] Using dropzone.js with meteor.js

问题描述

我对某些事情感到困惑。
我正在尝试使用dropzone.js流星包（ http://atmospherejs.com/dbarrett/dropzonejs ），但找不到任何示例。在文档中说：
使用这样的模板

I am confused about something. I am trying to use the dropzone.js meteor package (http://atmospherejs.com/dbarrett/dropzonejs) with my meteor application but I could not find any example about it. In the documentation it says: Use the template like this

{{> dropzone url='http://somewebsite.com/upload' id='dropzoneDiv'}}

，它将把所有上传的文件发布到您选择的网址。

it will post any uploaded files to the url of your choice.

所以，如果我写的话，

{{> dropzone url='http://localhost:3000/home' id='dropzoneDiv'}}

放下图片后，它将上传到/ public / home文件夹吗？我的意思是，包处理服务器端保存映像也是吗？
如果没有，您能给我一些有关如何处理服务器端保存的提示吗？

as soon as I drop the image, is it going to upload it to /public/home folder? I mean is the package handling server-side saving image too? If not, can you please give me some tips about how I can handle the server side saving?

谢谢

推荐答案

Dropzone可能会造成一些混乱：

Dropzone can be a bit confusing:

首先，您应该获得Meteor的文件管理系统。现在的标准是CollectionFS：

First you should get a file management system for Meteor. The standard right now is CollectionFS:

https://github.com/ CollectionFS / Meteor-CollectionFS

然后，您需要添加文件系统。我使用GridFS，它将大文件分解成块并将其存储在Mongo中：

Then you need to add a file system. I use GridFS, which breaks up large files into chunks and stores them for you into Mongo:

https://github.com/CollectionFS/Meteor-cfs-gridfs/

按照创建，发布，并订阅新的特殊FS集合：

Follow the instructions for creating, publishing, and subscribing to your new, special, FS Collection:

example for creating the collection: 

MyImages = new FS.Collection('myImages', {
    stores: [new FS.Store.GridFS("myImages")]
});

安装完这两个后，创建您的放置区：

After those two are installed, create your dropzone:

<template name="imageUpload">
  <form action="/file-upload" class="dropzone" id="dropzone"></form>
</template>

然后在您的JavaScript中：

Then in your javascript:

Template.imageUpload.rendered = function(){

  if (Meteor.isClient){

    var arrayOfImageIds = [];

    Dropzone.autoDiscover = false;

    // Adds file uploading and adds the imageID of the file uploaded
    // to the arrayOfImageIds object.

    var dropzone = new Dropzone("form#dropzone", {
        accept: function(file, done){
            MyImages.insert(file, function(err, fileObj){
                if(err){
                  alert("Error");
                } else {
                  // gets the ID of the image that was uploaded
                  var imageId = fileObj._id;
                  // do something with this image ID, like save it somewhere
                  arrayOfImageIds.push(imageId);
                };
            });
        }
    });
  };

};

这篇关于将dropzone.js与meteor.js结合使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！