CODEWITHSUNDEEP
file-uploadmeteor
Scott
Scott

Reputation: 3344

Meteor File Uploads

I see that this has been asked here before, but nothing since Meteor.http has been available. I'm still grasping the concepts of Meteor and file uploads are totally eluding me.

Here's my question:
So, in what I believe to be the right method,
Meteor.http.call("POST", url, [options], [asyncCallback])
what do you put for the url? With the client/server javascript relationship in meteor, it doesn't seem like it really uses urls that much.

If anyone has a basic example of a file upload in meteor, that would just be extra awesome.

Upvotes: 13

Views: 7707

Answers (5)

myrocode
myrocode

Reputation: 305

Checkout how to accomplish this using Meteor.Method on the server and the FileReader's api on the client

https://gist.github.com/dariocravero/3922137

After several searches, this looks to me the easiest (and for the moment the meteor's style way) to handle a file upload with no extra dependencies.

Upvotes: 2

csikosjanos
csikosjanos

Reputation: 513

Alternatively (if you wouldn't like to use a 3rd party solution like filepicker) you could use the meteor router package.

This handles the HTTP requests on server-side.

Upvotes: -1

jlg_foil
jlg_foil

Reputation: 668

Take a look at filepicker.io. They handle the upload, store it into your S3, and return to you the url that you can dump into your db.

  1. Wget the filepicker script into your client folder.

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

  2. Insert a filepicker input tag

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

  3. In the startup, initialize it:

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

  4. Attach a event handler

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

(I had posted on How would one handle a file upload with Meteor? Sorry. I'm new here. Is it kosher to copy the same answer twice? Anyone who knows better can feel free to edit this.)

Upvotes: 4

user1534659
user1534659

Reputation:

well been playing a bit with meteor. Made a collectionFS a mix of meteor and gridFS (could be compatible). Test it here: http://collectionfs.meteor.com/ It support quit large files, multiple files, users etc. I've tested a 50Mb seems ok, if connection is lost or browser dies the user can resume upload. It should even be possible to have multiple users upload to exact same file - haven't quit found a usecase for it, but it's possible. Accounts, publishing etc. is as with collections - the test is in autopublish mode, though only meta data is avaliable - chunks of data is served in background via blobs.

I'll try getting it on github,

Upvotes: 6

Alexander Meesters
Alexander Meesters

Reputation: 380

Since meteor includes JQuery by default, you can utilize a Jquery plugin for that, i presume, something like: https://github.com/blueimp/jQuery-File-Upload/wiki/Options can do the trick for you, and supports both GET and PUT.

Otherwise it would be a pain in the ass to get it to work, but not impossible, since you can access PUT in meteor.

If you would prefer a more pure JS sollution maybe you can look at: http://igstan.ro/posts/2009-01-11-ajax-file-upload-with-pure-javascript.html

And adapt it.

There is no ready made support for file uploads so share what you come up with, i would be very interested!

Upvotes: -1

Related Questions