Question

我有一个表单，用户可以在我的viewmodel中使用以下属性更改其个人资料图片：

public HttpPostedFileBase Image { get; set; }

这适用于上传，但我怎样才能显示他的照片？

我是否必须创建这样的另一个属性？

public HttpPostedFileBase UploadedImage { get; set; }
public byte[] Image { get; set; }

看起来不对，有没有办法用1个属性做到这一点？

谢谢

Answer 1

解决方案取决于您保存图像的方式。如果您将其序列化为byte []，则可以执行以下操作以在View：

中加载图像

在您的控制器中创建一个功能：

public void GetImageThumbnailFromByteArray(Guid? profileId)
        {   

            Profile profile = // Get profile by profileId
            Byte[] image = profile.Image;

            new WebImage(image).Write();

        }

在视图中：

  <img src="@Url.Action("GetImageThumbnailFromByteArray", "Profile", new { profileId = Model.ProfileId})" />

Answer 2

用户类

public class ApplicationUser : IdentityUser
{
    public string Email { get; set; }
    public byte[] Picture { get; set; }
}

查看图片：

[HttpGet]
[AllowAnonymous]
public ActionResult ViewImage(string id)
{
    ApplicationUser user = m_DAL.Find<ApplicationUser>(x => x.UserName == User.Identity.Name);

    byte[] buffer = user.Picture;
    return File(buffer, "image/jpg", string.Format("{0}.jpg", user.UserName));
}

剃刀：

<img src="/user/viewimage/aaa">

或者如果你想在ViewModel中使用它：

@Html.Raw("<img src=\"data:image/jpeg;base64," + Convert.ToBase64String(Model.Picture) + "\" class=\"img-thumbnail\" style=\"width: 100px; height: 100px; margin-bottom: 20px;\" />")

Answer 3

您通常会将图像保存到服务器（或数据库）上的目录中，然后只提供一个可用于呈现图像的URL，而不是将字节数组发送到HTML。

Answer 4

你不想在viewmodel中使用HttpPostedFileBase来显示文件，这是HTTP请求的一部分。你的问题已在这里得到很好的回答：

Uploading/Displaying Images in MVC 4

或在这里

Upload Image in form and show it on MVC 4

如何使用viewmodel加载和上传图像

4 个答案: