Resize Image (jpg) in Blazor WebAssembly?

Question

What is the best way to resize an image that is uploaded on a Blazor client page. These are real simple images that I just wanted to have a consistent width and was hoping to use the System.Drawing, but that is not available in web assembly. I was hoping to do it on the client, but is it best to send it to a Controller for processing?

Thanks, Mike

did you see system.drawing.common? – HannesPreishuber Jun 10 '20 at 18:38 — HannesPreishuber, Jun 10 '20 at 18:38

score 2 · Answer 1 · answered Jan 08 '21 at 08:37

2

.NET 5 has an extension method to IBrowserFile called RequestImageFileAsync. Per the documentation, it "Attempts to convert the current image file to a new one of the specified file type and maximum file dimensions."

answered Jan 08 '21 at 08:37

Dan Ott

46
4

score 0 · Answer 2 · answered Oct 27 '21 at 14:46

We use a package PhotoSauce.MagicScaler for all images uploaded from any blazor page. https://photosauce.net/ I have no affiliation with this package / author etc. Just recommend it because it works so well.

There are lots of params that you can set in the ProcessImageSettings for width, method of resizing etc.

var settings = new ProcessImageSettings { Height = 250 };
using var outStream = new FileStream(thumbNailPathAndFile, FileMode.Create);
MagicImageProcessor.ProcessImage(pathAndFile, outStream, settings);

It looks like this requires Windows so I doubt it would work in Blazor WebAssembly. — Niels Brinch, May 30 '22 at 13:46

Resize Image (jpg) in Blazor WebAssembly?

2 Answers2