web-dev-qa-db-ja.com

サーバーにアップロードする前にIFormFileから画像を圧縮する方法ASP.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>
5
sgrysoft

あなたが見ているのは Compressor JS のような画像を圧縮できるJSライブラリだと思います

1
Fabian Kamp

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);
    }
}
1
Fabian Claasen

画像、特にJPEG画像を有意に圧縮することはできません。少なくとも可逆的な方法ではありません。携帯電話のカメラからの画像が9〜15 MBの場合、解像度、品質、またはその両方を下げる必要があります。

JavaScriptを使用してクライアントで行うことができます。JavaScriptを使用すると、画像のサイズを変更して品質を低下させ、変更した画像をアップロードできます。これには、帯域幅も節約できるという利点があります(小さい画像がアップロードされます)が、必要に応じてユーザーが回避できるという欠点があります。

または、サーバーサイドで変更を行うこともできますが、そうするためのマネージライブラリがたくさんあります。

0
CodeCaster