• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

356
Vistas
Blazor Server (.NET 5) - Get the value of croppie's image src to Blazor Server Page - Javascript

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

about 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

I have solved this by not using code behind of the blazor component page, I used a javascript, json/ajax and webapi for saving the image, then used the code behind for getting the image to show, but I have to force reload the page for this. Our team is currently want to avoid blob on the code behind of the blazor, to make our app to be light weight as possible.

Thank you everyone.

about 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda