使用 Blazor WebAssembly 调整图像大小和上传图像

Question

我正在使用以下示例通过 Blazor WebAssembly 调整上传的图像大小 https://www.prowaretech.com/Computer/Blazor/Examples/WebApi/UploadImages.

我仍然需要将原始文件也转换为base64，但我不知道如何访问它... 我试图找到文件的原始宽度和高度以将其传递给 RequestImageFileAsync 函数但没有成功...... 我需要存储两个文件：原始文件和调整大小的文件。

你能帮帮我吗？

非常感谢！

Answer 1

InputFile 控件发出一个 IBrowserFile 类型。 RequestImageFileAsync 是 IBrowserFile 上调整图像大小和转换类型的便捷方法。结果仍然是一个 IBrowserFile。

使用 SixLabors.ImageSharp 可以满足您的要求。基于 ProWareTech 示例，类似这样的内容...

async Task OnChange(InputFileChangeEventArgs e)
    {
        var files = e.GetMultipleFiles(); // get the files selected by the users
        foreach(var file in files)
        {
            //Original-sized file
            var buf1 = new byte[file.Size];
            using (var stream = file.OpenReadStream())
            {
                await stream.ReadAsync(buf1); // copy the stream to the buffer
            }
            origFilesBase64.Add(new ImageFile { base64data = Convert.ToBase64String(buf1), contentType = file.ContentType, fileName = file.Name }); // convert to a base64 string!!
            
            //Resized File
            var resizedFile = await file.RequestImageFileAsync(file.ContentType, 640, 480); // resize the image file
            var buf = new byte[resizedFile.Size]; // allocate a buffer to fill with the file's data
            using (var stream = resizedFile.OpenReadStream())
            {
                await stream.ReadAsync(buf); // copy the stream to the buffer
            }
            filesBase64.Add(new ImageFile { base64data = Convert.ToBase64String(buf), contentType = file.ContentType, fileName = file.Name }); // convert to a base64 string!!
        }
        //To get the image Sizes for first image
        ImageSharp.Image origImage = Image.Load<*imagetype*>(origFilesBase64[0])
        int origImgHeight = origImage.Height;
        int origImgWidth = origImage.Width;

        ImageSharp.Image resizedImage = Image.Load<*imagetype*>(filesBase64[0])
        int resizedImgHeight = resizedImage.Height;
        int resizedImgWidth = resizedImage.Width;
    }