how to use callback function to use returned value because when I log console with croppedBase64Img it gives me undefined I need to got croppedBase64Img value

croppedBase64Img = await base64SquareCrop(base64Image, 
function(result){
        return result;
    });

async function base64SquareCrop(imgbase64, size = 224, callback) {
const img = document.createElement("img");
await img.setAttribute("src", imgbase64);

let width = 1240;
let height = 698;
const min = Math.min(width, height);
const scale = size / min;
const scaledW = Math.ceil(width * scale);
const scaledH = Math.ceil(height * scale);
const dx = scaledW - size;
const dy = scaledH - size;
canvasImage.width = canvasImage.height = size;
const ctx_img = canvasImage.getContext("2d");
img.onload = function() { ctx_img.drawImage(
    img,
    ~~(dx / 2) * -1,
    ~~(dy / 2) * -1,
    scaledW,
    scaledH
);
callback(canvasImage.toDataURL("image/png"));
}