How To Get The Cloudinary Widget Image Info On Upload?

I'm using the cloudinary widget to upload images on my websites. Now I'd like to get the info from an image when it's being uploaded e.g. the path of that image. I can see that thi

Solution 1:

Thanks everyone for your feedback. I've found a way that suit my needs, see updated script below where I grab the "result.info.path" value with "var imagePath", then I can call it anywhere I want on the page with "document.getElementById" for example.

var myWidget = cloudinary.createUploadWidget({
  cloudName: 'myusername', 
  uploadPreset: 'preset_unsigned'}, (error, result) => { 
    if (!error && result && result.event === "success") { 
      console.log('Done! Here is the image info: ', result.info); 

    var imagePath = result.info.path;

        document.getElementById("uploadedImage").src = "https://res.cloudinary.com/myusername/image/upload/" + imagePath;

    }
  }
)

document.getElementById("upload_widget").addEventListener("click", function(){
    myWidget.open();
  }, false);

Solution 2:

The Upload Widget configuration takes a callback function that will have the error and result objects from the upload method call. You can use those two objects to check if the upload failed, what the status was and how you want to process the information returned in the API response.

For example, if you want to print the secure_url to the uploaded image you can do something like -

var cloudinaryWidget = cloudinary.createUploadWidget({
    cloudName: "xxx",
    uploadPreset: "yyy"
  },
  function(error, result) {
    if (!error && result && result.event === "success") {
      console.log(result.info.secure_url);
    }
  }
);

Once you've uploaded an image successfully the console will log the secure_url.

In general, the result.info object will contain a standard upload API response. So you can extract the parts you need. E.g. result.info.public_id which you probably want to store on your side too so you can make other API operations on the file, such as deleting it.