Avoiding autoupload with a cloudinary unsigned image upload?

Question

I'm trying to do a simple unsigned upload to my cloudinary directly from the browser. I used cloudinary's image_upload_tag view helper method to embed a file upload in my html from my jQuery:

$('.upload_form').append($.cloudinary.unsigned_upload_tag("unsigned_name", { 
    cloud_name: 'username',
}));

However, cloudinary automatically uploads the image file as soon as it is selected via input. I want it to upload once I submit the entire form instead.

Does anybody know how to turn off the autoupload feature? Even better, how to put the unsigned direct file upload input in the form using HTML for the actual input instead of having to embed it with JQuery?

EDIT: Also, how can I send the image url to my server so that I can store it in my db to access later?

I'd like to upload the image directly from the server to cloudinary so that I don't have to upload it first to my server and then to cloudinary, effectively doubling bandwidth usage. However, I need the image url (once it's on cloudinary) and the other information submitted in the same form as the image to end up associated and in my db. Any suggestions are welcome

Toby Weed Toby Weed · Accepted Answer · 2018-04-10T23:15:48

Comment to anybody trying this route: since I couldn't figure out how to tailor direct client-to-cloudinary uploads while also saving the uploaded photo url to my db, I decided to go a different route and use multer-storage-cloudinary. It's definitely much slower than using the direct unsigned upload option, but it's relatively neat and super easy.

Avoiding autoupload with a cloudinary unsigned image upload?

1 Answers