Meteor: Cloudinary

Question

I am trying to upload a photo with Lepozepo/cloudinary

This is my server and client config

server:

Cloudinary.config({
  cloud_name: '*****',
  api_key: '******',
  api_secret: '********'
});

client:

$.cloudinary.config({
  cloud_name: "*******"
});

I tried to upload the image with a form

html form code:

<form>
   <input type="file" id="userimage" name="userimage"/>
   <button type="submit">Upload</button>
</form>

And this is my this is the event for the template

Template.signup.events({
    // Submit signup form event
    'submit form': function(e, t){
        // Prevent default actions
        e.preventDefault();

    var file = $('#userimage')[0].files[0];
    console.log(file)
    Cloudinary.upload(file, function(err, res) {
          console.log("Upload Error: " + err);
          console.log("Upload Result: " + res);
        });
    }       
});

When i click on upload button nothing happen, I just got an error

 error: uncaught TypeError: Failed to execute 'readAsDataURL' on `'FileReader': parameter 1 is not of type 'Blob'.`

What can I do to make this work ?

Answer 1

Please use "_upload_file" instead of "upload". "_upload_file" is used in "upload" actually. But somehow you can not catch err and response when you use "upload"

You can catch err and response.

Meteor Version : 1.1.0.3

lepozepo:cloudinary : 1.0.2

Cloudinary._upload_file(files[0], {}, function(err, res) {
  if (err){
    console.log(err);
    return;
  }
  console.log(res);
});

Answer 2

I find a way to solved it.

1. Lepozepo/cloudinary Cloudinary.upload method file parameter is an array, I just add this code:

   var files = []
   var file = $('#userimage')[0].files[0];
   files.push(file)
   console.log(files)
   

And it work fine