JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas" width="200" height="200" style="border:solid 1px black"></canvas>

<div id="print"></div>

JavaScript

let canvas = document.querySelector("#canvas");
canvas.width = 200;
canvas.height = 200;

let ctx = canvas.getContext('2d');

function fun(){
    let img = new Image();
	  let dataUrl = "no";
    img.onload = () => {
        ctx.drawImage(img, 0, 0, img.width, img.height);
        // какая-то обработка...
        
        dataUrl = canvas.toDataURL();
    }

    img.src = "https://fastly.picsum.photos/id/1079/200/200.jpg?hmac=1ufYwVqTHDtGZw0aD-rsTU5gv74qWxm5-k7xQYkSeig";
    return dataUrl;
}

let dataUrl = fun();

document.querySelector("#print").innerText = dataUrl;