How to easily integrate cloudinary with meteor?

I have used cosio55, but I think this package is not maintained anymore and uses an old version of autoform. So it broke within my app. I have to admit that I was really happy that this package made the image uploads to cloudinary so simple, that I got it work.

Unfortunately, I am a bit depressed right now, because I could not find another solution that worked for me. I think my problem is that I do not really understand how the other solutions work (especially how to save the respone from cloudinary in my db?) and which of them fits best in terms of implementation and maintenance.

Does anybody know which package I could use to integrate a simple image upload in meteor and how to get the response link from cloudinary to save it? I would appreciate any help! Thanks.

we upload to Amazon S3 with slingshot, then use Cloudinary for retrieval.

Cloudinary gives you the code, we just make a package out of it to share across our meteor apps

1 Like

I wrote this for my students, perhaps it will help:

Philip

3 Likes

I think this is the latest cloudinary-meteor integration and the dev is very active in meteor forums so you can reach him directly

https://atmospherejs.com/socialize/cloudinary

@copleykj is the author

3 Likes

Just a quick note though… In the interest of front end agnosticism the socialize:cloudinary package lacks any kind of autoform integration like many of the other cloudinary packages, so if you’re looking for something that has this, then you’ll want to find another solution.

As far as saving them to the database the main thing you want to worry about is storing the pubic_id, that way you can pass it to the Cloudinary.url() method. This could be just as a field on the user, or it could be in an images collection that is linked to a particular user.

In the coming months the plan is to have a couple more socialize packages (Photos, and Albums) for dealing with saving and displaying the information returned from cloudinary. Right now though I’m working on porting the other packages in the set to be used with React Native so it may be some time yet before I get to them.

as @kaiyes said, I’m pretty active here, so if you have any questions or need help, just let me know.

2 Likes

Sorry that I´m answering so late, but I wasn´t able to reply last week. Many thanks for this reply. The package seems to be amazing. However, I am really not into React right now. My app is pretty “old school” in Blaze and I think that I will migrate to vue.js in the future. I found a pretty clear instruction for implementing cloudinary by using native JS, although I think that this isn´t best practice due to the requirement of allowing unsigned uploads see here). I don´t know what “signed” and “unsigned” uploads actually mean, but I think there is a more “appropriate” way.

However, for now I think that I have to stick with that solution, because I have no experience in React right now or is there maybe a way to use it with Blaze or native JS? Nevertheless, the package seems to be great work!

Actually the whole point of the package is to be front end agnostic. Most of the other packages depend on Blaze, jQuery, or both and I wanted the package to not have outside dependencies that added extra unintended code weight to a project. The examples are in React, but truly it’s just JavaScript and should be a rather simple translation to Blaze or Vue.

1 Like

@maxhodges What are the benefits of doing it this way? I’m a fairly new to Meteor and am wondering if Cloudinary is worth it. Also, why not upload with Cloudinary as well?

New project using cloudinary is very easy: https://DoerSocial.com

socialize:cloudinary has now also been ported to NPM as @socialize/cloudinary so you can use the same API on both your Meteor and React Native apps.

1 Like

because of our volume AWS/Google Cloud Storage is cheaper than Cloudinary storage. So we use Cloudinary for transforms only

Gotcha. Are you using their API for the transforms or are you fetching from a remote_media bucket as they describe in their docs?

I use Cloudinary, here you can se code for upload, see image, save to mongodb and delete image Howto delete image from Cloudinary? SOLVED

I believe we are fetching using the query string params

1 Like