Images returning blank

[eybarta]

Hi.

Thanks for a great package.

I'm trying to use it with GridFS to save images to mongodb, It seems everything is working fine, no errors, but using your example to show the files back to the client from collection, I get empty images.. Browsing directly to the url -> http://localhost:3000/ufs/images/HGNHi8RKfrd6y3a4t/IMG_2761.JPG Also gives blank screen (see screenshot)

I'm probably missing something trivial, can you please help? thank you!

[jalik]

@eybarta as you said it should be something trivial you missed.

You should first check that you've installed all dependecies (gm if your are using it). Please also check the UFS demo source code to see how it should be implemented in your app : https://github.com/jalik/ufs-example

[eybarta]

@jalik thanks for your response

It seems to work fine now when I don't use transform but when I do the image comes back distorted (mostly gray with only the edges showing the actual image)

Here's my transform method (similar to your example):

transformWrite(from, to, fileId, file) {
        if (gm) {
            gm(from)
                .resize(400, 400)
                .gravity('Center')
                .extent(400, 400)
                .quality(75)
                .stream().pipe(to);
        } else {
            console.error("gm is not available", file);
        }
        from.pipe(to); // this returns the raw data
},

[jalik]

@eybarta could you provide a screenshot of the actual distorded image ? I am not sure if this could be out of UFS's scope.

[eybarta]

sure, this is what I'm getting.. as you can see the right edge of the document is visible, the rest is grayed out.

thanks for your help

[macman31]

The issue is probably with gm. The command may fail while converting the image, returning only part of the image to the stream, that part only being saved/displayed after that.

Can you try running the command from your command line, on the same machine Meteor is running on, and on the same file that causes the issue? It should go something like that: gm convert originalFile.jpg -resize 400x400 -gravity Center -extent 400x400 -quality 75 modifiedFile.jpg

And try to open modifiedFile.jpg?