Display image from byte array in blazor

Question

I'm using blazor webassembly and I need to display an image that stored as byte array in the client side.

I tried

in C#:

imagesrc= Convert.ToBase64String(imageBytes);
imageDataURL = string.Format("data:image/jpeg;base64,{0}", imagesrc);

in markup:

<img src="@imageDataURL" />

but no image displayed just icon that no image.

is there any other way?

Answer 1

I was curious which image format you specified instead of jpeg and like you said under @Henk answer it is svg as it starts with PHN2Z...

That doesn't mean you have to use some svg to jpeg converter, just adjust data uri type appropriately:

imageDataURL = string.Format("data:image/svg+xml;base64,{0}", imagesrc);

Heres quick blazor playground which displays data uri for various image files

Answer 2

A jpg file has a standard header. So even with different images I would expect the first few characters of the base64 to be the same.

When I convert a jpg to base64 it starts with "/9j/4AAQ"

So I think your data is not a (valid/complete) jpg file.