We have created a Blazor Server application with .NET 5 framework, with a feature that uploads images and it crops it which part should be uploaded, what we use is croppie.js, I tried the code below when after the cropping of image then save, what approach I did use is getting the src of image using javascript, that is been called by my method inside of the Blazor Server Page, here's my code.

Javascript:

    function getImgSrc() {
debugger;
var GetValue = document.getElementById('my-img').src;
return GetValue;
}

My Blazor Server-side page codes (Index.razor.cs)

        public async Task SavePhoto()
    {
        string GetSRC = await jSRuntime.InvokeAsync<string>("getImgSrc");

        string path = _hostingEnvironment.WebRootPath + "/images/" + fileName;
        byte[] imageBytes = Convert.FromBase64String(GetSRC);
        File.WriteAllBytes(path, imageBytes);
        return;
    }

Then, when I run the application, crop the image and save it, it causes an error, the only error message show is this.

Error: Connection disconnected with error 'Error: Server returned an error on close: Connection closed with an error.'.

Has anyone tried to use croppie in Blazor Server? have you successfully gotten the image from image tag's src??

I hope someone can help me on this.

Thanks everyone