JSFiddle - React, Tailwind, and code Playground

by Shirly Manor

HTML

<script src="//widget.cloudinary.com/global/all.js"></script>
<button id="open_pre_widget0">Upload</button>
<button id="open_pre_widget1">Re-crop</button>

JavaScript

var cloud_name = 'shirly';
var upload_preset = 'my-preset';

cloudinary.setCloudName(cloud_name);
var preWidget = cloudinary.createUploadWidget({
    cropping: 'server',
    upload_preset: upload_preset
}, function(error, result) {
    $("#open_pre_widget1").on("click", function() { 
        preWidget.open({file: result[0].secure_url}); 
    });
});
 
$("#open_pre_widget0").on("click", function() { 
    preWidget.open(); 
});