Dropzone hangs on files larger than 1mb

Question

I'm using Dropzone.js in Meteor along with CollectionFS. I used it both as a package and standalone. Each time I did, everything works great except when I try to upload files over 1mb (It seems like that is the size limit at least) the progress bar just hangs and the "complete" callback never gets called. I've tried a lot of the Dropzone options and nothing seems to resolve it. This is what I have:

Javascript:

Template.projectsNew.rendered = ->
   Meteor.dropzone = new Dropzone '#dropzone',
      url: '/'
      maxFilesize: 5
      maxFiles: 50
      maxThumbnailSize: 5
      init: ->
         @on 'complete', (file) ->
            Files.insert file, (error, fileObject) ->
               if error
                  console.log "Error: #{error}"
               else
                  uploadedFileIds = Session.get 'uploadedFileIds'
                  uploadedFileIds.push fileObject._id
                  Session.set 'uploadedFileIds', uploadedFileIds

HTML:

 fieldset
    legend Documents

    #dropzone.dropzone

Any help would be greatly appreciated.

Answer 1

in case anyone else got stuck with this... I had the same problem, and got just absolutely stuck... finally worked it out after like 4+ hours of hitting walls.

so turns out dropzone loads and complete a post request, and i guess that's not how collectionFS or meteor handles it ... anyhoo I'm too beginner to understand all that.

Long story short, the complete will never fire within dropzone , but you can catch the file upon 'accept', which is an option specification of dropzone, instead of an event.

So I worked around it and make the collectionFS image store happens in the accept options, and just remove the icon afterward, which looks perfectly fine and works perfect as well!

<form action="#" class="dropzone" id="dropzone"></form>

var myDropzone = new Dropzone("#dropzone", {
  accept(file) {
    if (file.status == 'added') {

      var newFile = new FS.File(file);

      Images.insert(newFile, function (error, fileObj) {
        if (error) {
          ...
        }
          else {
            ...
          }

            // clear out dropzone
            myDropzone.removeFile(file);
          }
        });
      }
    }
});

If anyone need some extra help with this particular issue, please leave a comment or get in touch, I'll be happy to help further.

Answer 2

You should consider the CollectionFS package . One of its features is that it breaks files into pieces when uploading them to any number of storage options (gridFS, S3, etc...)