如何在上传到服务器 ASP.Net Core 之前从 IFormFile 压缩图像答案

【问题标题】：How to compress an image from IFormFile before upload to the server ASP.Net Core如何在上传到服务器 ASP.Net Core 之前从 IFormFile 压缩图像
【发布时间】：2020-02-04 14:07:02
【问题描述】：

我有一个问题，我正在 net core 中创建一个应用程序来上传孩子信息，但是，主要问题是我拥有的所有图像都来自我的手机，而且你知道我们在谈论 9-15每张图片 MB，所以，我知道我可以告诉用户“有一个限制”，但是，我认为它没有用，所以，有一种方法可以减小图像的大小而降低质量吗？。

这是我的方法

类

public IFormFile ImageFile { get; set; }

方法

if (vm.ImageFile != null && vm.ImageFile.Length > 0)
{
    var guid = Guid.NewGuid().ToString();
    var file = $"{guid}.jpg";

    path = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot\\images\\Kids", file);

    using (var stream = new FileStream(path, FileMode.Create))
    {
        //var convertedImage = MagicSolutionGivenByTheAwsomeStackOverFlowCommunity
        await vm.ImageFile.CopyToAsync(stream);
    }

}

布局

<form asp-action="Create" enctype="multipart/form-data">
 <input type="hidden" asp-for="Imagen"/>
  <div class="col-sm-4">
   <label asp-for="Imagen" class="control-label"></label>
   <div>
    <input asp-for="ImageFile" class="form-control filestyle"
           type="file" data-classbutton="btn btn-secondary"
           data-classinput="form-control inline"
           data-icon="&lt;span class='fa fa-upload mr'&gt;&lt;/span&gt;" />
   </div>
  <span asp-validation-for="Imagen" class="text-danger"></span>
 </div>
</form>

【问题讨论】：

例如JPEG压缩...
emm，是的，例如 jpg
也许可以看看 ImageSharp for .Net Core (github.com/SixLabors/ImageSharp)。他们在第一页上有一个图像调整大小的示例。您用于调整大小的确切方法取决于您希望如何做到这一点（百分比、固定大小等）。
Here你可以查到资料
当您的服务器后端代码获取图像时它已经在服务器上。你应该回答的问题，至少对你自己来说，是为什么你首先会受到限制。如果要限制发送到您的服务器的数据量，您还应该检查限制客户端，并且任何压缩以减少该数量都需要在发送之前在客户端完成。如果重点是减少存储的数据量，那么您可以在服务器端进行。

标签： c# asp.net asp.net-core .net-core

【解决方案1】：

对于我的项目，我通常在后端使用这个库：ImageResizer 来自 Nuget：nuget ImageResizer

这对于压缩和调整服务器端大小很有用

相反，我在前端的 JS 中使用它：PlUpload

在此示例中，您可以在客户端 Image-Resizing-on-Client-Side 上调整图像大小或者您可以使用Chunking 加速上传到客户端并管理服务器上的文件。

【讨论】：

【解决方案2】：

您可以使用ImageSharp 调整图像大小。我们用它来制作上传的 IFormFile 的 Thumb 图像。首先打开一个读取流，然后为该流打开一个 ImageSharp 图像。

using (var stream = file.OpenReadStream())
using (var image = Image.Load(stream))
{
   await ResizeAndUploadImageAsync(image, maxWidth, fileName);
}

之后，您使用 MemoryStream 将调整大小的图像保存为 PNG，并在我们的示例中将文件上传到 S3 存储桶。

private async Task ResizeAndUploadImageAsync(Image<Rgba32> image, int maxWidth, string 
    fileName)
    {    
        using (var writeStream = new MemoryStream())
        {
            if (image.Width > maxWidth)
            {
                var thumbScaleFactor = maxWidth / image.Width;
                image.Mutate(i => i.Resize(maxWidth, image.Height * 
                    thumbScaleFactor));
            }

            image.SaveAsPng(writeStream);
            await storageService.UploadFileAsync(writeStream, fileName);
    }
}

【讨论】：

这对我不起作用，Image.Load 抛出不支持同步读取异常

【解决方案3】：

我认为您关注的是一个可以压缩图像的 JS 库，例如 Compressor JS 也许这个可以帮助你解决你的问题

【讨论】：

【解决方案4】：

您无法有意义地压缩图像，尤其是 JPEG 图像。至少不是以可逆的方式。如果来自手机相机的图片为 9-15 MB，那么您需要降低分辨率、质量或两者兼而有之。

您可以在客户端中使用 JavaScript 执行此操作，您可以在其中调整图像大小并降低质量，然后上传修改后的图像。这样做的好处是还可以节省带宽（上传较小的图像），但缺点是用户可以根据需要绕过它。

或者您可以在服务器端进行修改，那里有很多托管库可以这样做。

【讨论】：