Return 输入文件

Question

我有一个可以输入多个图像文件的表格。插入时，我可以使用 Request.Files 中的内容在服务器上恢复它们，然后我将文件作为 byte[] 添加到我的模型，以及文件名。

我的问题在于，当我尝试从我的模型中恢复数据，以编辑形式将其放回原处时，所有其他值都成功返回，但对于图像，我必须请求它们一个一个的从服务器，并将其设置为 img 标签的 src 属性。

当我重新提交我的表格时，Request.Files 上不再有图像，这导致图像从我的数据库中删除，不再存在于我的模型中，因为每次我提交插入或编辑时，它都会通过我的方法验证 Request.Files.

我怎样才能将图像保留在我的表单中，或者用它们填充 <input type="file" />？

这是将图像放入模型的代码：

private void LoadImages(Modelo.Entidades.Produto.Produto model)
{
    if (Request.Files.Count == 0)
        return;

    var indexImages = 0;

    for (var i = 0; i < Request.Files.Count; i++)
    {
        var result = AddImageToModell(model, Request.Files[i], indexImages);

        if (result)
            indexImages += 1;
    }
}

private bool AddImageToModell(Modelo.Entidades.Produto.Produto model, HttpPostedFileBase imageFile, int index)
{
    if (imageFile == null || imageFile.ContentLength == 0)
        return false;

    model.Images[index].FileName = imageFile.FileName;

    using (var dest = new MemoryStream())
    {
        Image image = Image.FromStream(imageFile.InputStream);

        imageFile.InputStream.Seek(0, SeekOrigin.Begin);

        var resizeQuery = string.Format("width={0}&height={1}&crop={2}&format={3}", image.Width, image.Height, "auto", "png");
        ImageBuilder.Current.Build(imageFile.InputStream, dest, new ResizeSettings(resizeQuery));

        dest.Seek(0, SeekOrigin.Begin);

        model.Images[index].Image = new byte[dest.Length];
        dest.Read(model.Images[index].Image, 0, model.Images[index].Image.Length);
    }

    return true;
}

这是发送文件以用作 img src:

的代码

public ActionResult Imagem(int idProduto, int item)
{
    var produto = Repositorio.ComCodigo(idProduto);

    if (produto == null)
        return NotFound();

    var imagem = produto.Imagens.Where(p => p.Item == item).FirstOrDefault().Imagem;

    if (imagem == null || imagem.Length < 10)
        imagem = System.IO.File.ReadAllBytes(Server.MapPath("~/Content/imagens/image-uploader-no-image.png"));

    var stream = new MemoryStream(imagem);
    stream.Seek(0, SeekOrigin.Begin);

    return File(stream.ToArray(), "image/png");
}

提前致谢。

Answer 1

无法在单个 HTTP 响应中将图像与 MVC 视图的主 HTTP 响应一起发送，因此您通过设置 src 属性来一张一张地发送图像img tag 是正确的。

上传和更新图片的步骤可以是：

打开表单时，在控制器中创建一个唯一键（guid），并在打开时将其设置为表单中的隐藏字段（因此在提交表单之间保持不变)
如果用户在编辑表单时上传新图片，
- 连同guid一起上传，临时保存图片（到数据库，磁盘），
- 保存到 Session 对象有关 guid 的信息和等待保存的临时文件名
- 更新 src 标签以指向临时图像，以便用户看到新图像
如果用户之后提交了整个表单，则根据guid从Session对象中收集新图片的信息，使新图片持久化
添加后台作业以清理旧的临时文件

Return 输入文件

Return file in input

html

c#

forms

asp.net-mvc

httppostedfilebase