Retrieve custom image metadata

[geoffdavis92]

Is there a way to retrieve custom image metadata from Cloudinary images?

This would be beneficial if users programmatically add metadata key/value pairs to media uploads.

[5un]

If you're still interested. Passing context: true option in gatsby-config.js works for me. It is also part of the Cloudinary node.js api spec.

My gatsby-config.js config block

{
      resolve:`gatsby-source-cloudinary`,
      options:{
        cloudName: process.env.CLOUDINARY_CLOUD_NAME,
        apiKey: process.env.CLOUDINARY_API_KEY,
        apiSecret: process.env.CLOUDINARY_API_SECRET,
        resourceType: `image`,
        maxResults: `200`,
        context: true,
   }
}

query MyQuery {
  allCloudinaryMedia(limit: 10) {
    edges {
      node {
        id
        url
        secure_url
        public_id
        context {
          custom {
            alt
            caption
          }
        }
      }
    }
  }
}

I get custom.alt, custom.caption from what I've set as the Title and Description of the image in Cloudinary. However, I could not get custom fields to work with this method.

[Chuloo]

Thanks for this @5un

[donaldboulton]

Try This

function ImageGallery({ image, thumb, group, ...rest }) { const data = useStaticQuery(graphql
query CloudinaryImage {
allCloudinaryMedia(sort: {fields: tags, order: ASC}) {
edges {
node {
public_id
resource_type
secure_url
tags
context {
custom {
alt
caption
}
}
}
}
}
}
) const clImages = data.allCloudinaryMedia.edges

then link to image
{image.node.secure_url}

link to alt or caption

{image.node.context.custom.caption}

props

ImageGallery.propTypes = { image: PT.string.isRequired, thumb: PT.string, group: PT.string.isRequired };