Meteor-cfs-gridfs images does not display in react when uploaded from mobile

packages
1

While uploading the image from mobile using Gridfs, image is not showing on the browser.

I use the following code to upload image :-

Meteor.call("createUser", userData, password, function(err, id){
      if(err){
       Bert.alert("Error while creating mentor user. ","danger");
      }else{
       if(file){
         Images.insert(file, function(err, fileObj) {
          if(err){
            console.log(err);
            Bert.alert("Error while uploading image. ","danger");
          }else{
            console.log("Success -> File Id: ->", fileObj._id);
          } 
          Meteor.call("saveImage", fileObj._id, id);          
          window.location.href="/";
         });
       }else{
         Meteor.call("defaultImage", id);         
         window.location.href="/";
       }
      }
    });

Save image id in the profile of user:-

saveImage: function(fileId, id){
        Meteor.users.update({_id: id},{
          $set: { "profile.image": fileId } 
        });
     }

code to display the image on page :-

this.data.images.map(function(img){
 return (
  <div key={img._id}>
    <img src={img.url()} className="img-responsive" alt="Invalid Image" />
  </div>
 )
  });

The code is working fine while uploading the image from web browser, but not on mobile browser.
Kindly help on the above issue.
Thanks.

2

Any solution/clue for this issue?

3

You have to do something with your mobile config. You have to something like

App.accessRule('blob:');

You may have to do something similar with Browser Policy.

BrowserPolicy.content.allowOriginForAll('blob:');

I had this issue before and the solution was something related to this. I don’t have any source files handy on me, so I can’t verify what the exact solution was, but this should hopefully give you a starting point.

1 Like
4

We are facing this issue in web app on mobile. It’s not a cordova app :frowning: