Cloudinary generated hidden input value

2
votes

I'm using node.js to generate a direct upload file tag for Cloudinary

cloudinary.uploader.image_upload_tag('coverImage', {html: {'class': 'cloudinary-coverImage', format: 'jpg'}})

After uploading, a hidden input tag like this is auto generated at the end of the form:

<input type="hidden" name="coverImage" value="image/upload/v1431361091/bns8et8ksrx3km5esdpj.jpg#d36285fd9bcccd5a2034b22ebf69d867fcee0bbc">

I realize that the input value is not exactly the public id like said in the docs, so when I store it in the DB, this will not generate a proper image

cloudinary.image(abc.coverImage)

How can I get the image's exact public id in the hidden input value?

1
cloudinary
This also really baffles me... why doesn't the Cloudinary gem just save the public ID? Not doing so causes the cl_image_tag method not to work... - Mythical Fish

1 Answers

0
votes

TL;DR

The format of the hidden input tag's value is {resource_type}/{type}/v{version}/{public_id}.{format}#{signature}. You need the public_id, which in your example is bns8et8ksrx3km5esdpj.

Details

The value of the hidden field includes the resource type, version, public id and the signature of the uploaded image. The public_id is the last part of the URI before the Hash (#).

Refer to the sample code, taken from the node.js controller code, for an example of handling the upload results (to match your example above, image_id below should be replaced with the name you designated for the field, i.e. coverImage):

var Photo = schema.models.Photo;
var photo = new Photo(req.body);

var image = new cloudinary.PreloadedFile(req.body.image_id);
// check that image resolved from image_id is valid
if (image.is_valid()){
  photo.image = image.toJSON();
  console.dir(photo.image)
}
photo.save().then(function(photo){
  console.log('** photo saved')
})

Brower side

If you need to get the public_id of the image following a direct upload on the browser side, you should listen to the "cloudinarydone" event:

$("body").on( "cloudinarydone", function(e, data) {
  console.log(data.result.public_id);
});