在 asp.net mvc 中保存用户上传的图像答案

【问题标题】：Saving user-uploaded images in asp.net mvc在 asp.net mvc 中保存用户上传的图像
【发布时间】：2019-07-17 23:08:00
【问题描述】：

我正在尝试使用 aurelia 从前端将上传的图像发布到 asp.net mvc。有没有办法可以将接收到的图像以 png 格式保存在服务器上的文件夹中？

我发布图像数据的 Javascript 方法（files 是上传的图像，id 是我需要用于文件名的唯一图像 ID）

saveImage(files,id) {
        var form = new FormData()
        form.append('file', files)
        form.append('ID', id)

        this.http.fetch('/api/Employees', {
            method: 'post',
            body: form
        })

        return true;
    }

ImagesController(Asp.net MVC)

using Microsoft.AspNetCore.Mvc;
using System;
using System.IO;
using System.Linq;
using System.Threading.Tasks;

namespace SPAproject.Controllers
{
    public class ImagesController : Controller
    {
        [HttpPost, Route("api/[controller]")]
        public async Task<IActionResult> SaveImage()
        {
            try
            {
                var form = await Request.ReadFormAsync();
                var file = form.Files.First();

                var id = form.ElementAt(1);
                var path = "/images/" + id + ".png";
                Stream stream = file.OpenReadStream();

                return Ok(true);
            }
            catch (Exception ex)
            {
                var originalMessage = ex.Message;

                while (ex.InnerException != null)
                    ex = ex.InnerException;
                return BadRequest($"{originalMessage} | {ex.Message}");
            }
        }
    }
}
}

【问题讨论】：

标签： c# asp.net-mvc image aurelia

【解决方案1】：

string fileName = string.Format("{0}{1}", id, ".png");
var serverPath = Server.MapPath("~/images");
var path = Path.Combine(serverPath, fileName);

using (Stream inputStream = file.OpenReadStream())
using (var outputStream = new FileStream(path, FileMode.Create))
{
    // dump a stream to a file
    inputStream.CopyTo(outputStream);
}

【讨论】：

【解决方案2】：

我假设您使用的是 ASP.NET Core，而不是 ASP.NET（使用 Microsoft.AspNetCore.Mvc；）

您可以在 asp.net 核心中使用新类 IFormFile。它简化了流操作。

[HttpPost("UploadFiles")]
public async Task<IActionResult> Post(List<IFormFile> files)
{
    long size = files.Sum(f => f.Length);

    // full path to file in temp location
    var filePath = Path.GetTempFileName();

    foreach (var formFile in files)
    {
        if (formFile.Length > 0)
        {
            using (var stream = new FileStream(filePath, FileMode.Create))
            {
                await formFile.CopyToAsync(stream);
            }
        }
    }

    // process uploaded files
    // Don't rely on or trust the FileName property without validation.

    return Ok(new { count = files.Count, size, filePath});
}

此外，您还可以在此处找到完整的文档。 File uploads in ASP.NET Core：

【讨论】：

我正在为后端使用该代码的改编版本，我假设它正在工作，因为我的错误从错误代码 400 变成了 500。所以我的结论是我的 aurelia 获取请求是错误的部分。你知道我该如何解决这个问题吗？在 fetch 中使用 catch 会记录错误，并且没有保存图像。