Argument 1 of FileReader.readAsDataURL does not implement interface Blob

[catin-black]

Hi I Have that problem in my console.

TypeError: Argument 1 of FileReader.readAsDataURL does not implement interface 
Blob.lepozepo_cloudinary.js:155:14Cloudinary.uploadhttp://localhost:3000/packages
/lepozepo_cloudinary.js:155:14submitAddnewsponsors/<http://localhost:3000
/app/app.js:4443:25submitAddnewsponsorshttp://localhost:3000
/app/app.js:4350:18Template.prototype.events/eventMap2[k]</</<http://localhost:3000/packages
/blaze.js:3718:18Template._withTemplateInstanceFunchttp://localhost:3000/packages
/blaze.js:3687:12Template.prototype.events/eventMap2[k]</<http://localhost:3000/packages
/blaze.js:3717:16attached_eventMaps/</</</<http://localhost:3000/packages
/blaze.js:2560:22Blaze._withCurrentViewhttp://localhost:3000/packages
/blaze.js:2214:12attached_eventMaps/</</<http://localhost:3000/packages/blaze.js:2559:20HandlerRec/this.delegatedHandler</<http://localhost:3000/packages
/blaze.js:835:14require<.node_modules.jquery.dist["jquery.js"]/</jQuery.event.dispatchhttp:
//localhost:3000/packages/modules.js:10700:16require<.node_modules.jquery.dist["jquery.js"]
/</jQuery.event.add/elemData.handlehttp://localhost:3000/packages/modules.js:10353:6

METEOR@1.4.0.1 This is strange because you package was working and I do not change anything in code. Could you please help

[catin-black]

When I back to 4.2.2 I do not have this issue.

[katima-g33k]

I have also noticed this issue, I tried upgrading to version 4.2.4 to fix the issue with Match.Maybe(), but I end up with this problem now.

[Lepozepo]

Crap, I'll definitely have a look, there might be a regression in the new stuff

[Animion]

In 4.2.4 still problem: angular_angular.js?hash=08f63d2…:13439 TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'. at TypeError (native) at Object.upload (http://localhost:3000/packages/lepozepo_cloudinary.js?hash=8ebd37ccf2060b3851635a8ecb2ec0925708f88a:150:21) at http://localhost:3000/app/app.js?hash=523ab651b4ba8beae295a136b4bf5d9230f0f0b0:196:24 at Scope.$eval (http://localhost:3000/packages/angular_angular.js?hash=08f63d24a8b0f235c02f3671f0823c0b8715d45e:17040:28) at Scope.$apply (http://localhost:3000/packages/angular_angular.js?hash=08f63d24a8b0f235c02f3671f0823c0b8715d45e:17140:25) at Scope.$scope.uploadedFile (http://localhost:3000/app/app.js?hash=523ab651b4ba8beae295a136b4bf5d9230f0f0b0:194:16) at HTMLInputElement.onchange (http://localhost:3000/ads/LXfkriEixMhijBTSx:1:31)

[danielparas]

Experiencing the same issue :/

[danielparas]

The problem seems to be with the _.isArray() check on line 149 .. Did the underscore library get updated with the latest Meteor? It's returning false when a FileList is passed, which makes sense since FileList is not an array. This is therefore causing the readAsDataURL to throw the blob error.

    if (!_.isArray(files)) {                                                                     
      file = files;                                                                              
      reader = new FileReader;                                                                   
      reader.onload = function() {                                                               
        return Cloudinary._upload_file(reader.result, ops, callback);                            
      };                                                                                         
      return reader.readAsDataURL(file);                                                        
    }  

A quick fix around this to get things moving again is to pass the files as an array to cloudinary.upload() function.

Example:

if (files.length > 0) {
  filesArray = _.toArray(files);
   Cloudinary.upload(filesArray, {
      folder: "folderName"
      type: "upload"
    }, function(error, result) {
      ...
    }
  });

Hope this helps!

[Pushplaybang]

@danielparas - this solved my issue, thanks. This seems to be a user error over a issue with cloudinary, might be worth adding to the documentation though.

[catin-black]

Working :)

[Lepozepo]

Hey guys! I patched this today. The upload function now checks for File, Blob, FileList, and an array of files. Let me know if you continue having any issues.

[Animion]

working! thanks!