cloudinary / cloudinary_js

Cloudinary JavaScript library
MIT License
328 stars 224 forks source link

[ Access Image metadata ]  #263

Closed LukyVj closed 3 years ago

LukyVj commented 3 years ago

Feature request for Cloudinary JS SDK

Hello! I'm using your SDKs on a react project, and I would need to be able to display the images custom metadata.

Unfortunately, I haven't found any resources about it. Only for nodeJS which isn't what I'm looking for.

Is there any way to access image metadata with CloudinaryJS? Like by doing

cloudinary.url('url/path').metadata // => [{key: value}, {key: value}, ...]
tpiros commented 3 years ago

Just a side question - what's the reason behind using the JS SDK vs the React SDK? (This functionality won't be there either as far as I know, but in general I'd be interested in knowing what made you pick one over the other.)

jayakhtar commented 3 years ago

@tpiros

I looked up internally, didn't see a JS specific example, except the one below that still is based in NodeJS SDK:

var cloudinary = require('cloudinary').v2;

cloudinary.config({
cloud_name: '<cloud>'
,api_key: '<api_key>'
,api_secret: '<api_secret>
});

cloudinary.uploader.explicit(name, 
{ 
type: 'upload', 
  image_metadata: 'true' 
}, function(err, data) { 
   console.log(err);    
   console.log(data); 
});

Can you please see if this is something you are looking for?

Best regards, Jay

LukyVj commented 3 years ago

@tpiros Hey, I have no use of the react implementation. We have our very own Image component that is using cloudinary urls for images.

For what I'm looking for, the react implementation would not be useful :)

@jayakhtar Hey, so yeah with the NodeSDK it's 100% possible but sadly not what I'm looking for. It would mean that I would need to run a node server just to display my images metadata. That seem a bit overkill to me.

It would be so nice to be able to access these metadata through a client side SDK.

jayakhtar commented 3 years ago

@LukyVj One option to get metadata from the clientside is to use the 'list' response type which will return a JSON list of images matching a given tag, including the context parameter if it's set. This can be called from client-side code there's documentation here for this method: https://cloudinary.com/documentation/advanced_url_delivery_options#client_side_resources

Using URL: https://res.cloudinary.com///list/\<tag>.json

Using only JS: cloudinary.url('logo.json', {type: "list"});

Response:

{"resources":
   [{"public_id":"cloudinary_fashion_logo","version":1588962712,"format":"png",
     "width":240,"height":307,"type":"upload","created_at":"2020-05-08T18:31:52Z",
     "metadata":[{"external_id":"color_id","label":"Colors","type":"set","value":
     [{"external_id":"color1","value":"red"},{"external_id":"color2","value":"green"}]}]},
   {"public_id":"amazon_logo","version":1315740184,"format":"png",
     "width":162,"height":38,"type":"upload","created_at":"2011-09-11T11:23:04Z"}]

Best regards, Jay

roeeba commented 3 years ago

Closing this issue due to the time elapsed. Please feel free to either re-open the issue, contact our support at http://support.cloudinary.com, or create a new ticket if you have any additional issues.