首页 > 解决方案 > 显示数据库中保存为字节的 IFormFile 的图像

问题描述

这是我在 ASP.NET CORE 3.0 中的代码,当我使用类型将图像保存为视图模型中的 IFormFile 和模型中的字节时。现在我想在编辑方法中检索这个图像。我无法显示图像。这是我的代码

var formData = new Student()
                        {
                            AppUserID = userId,
                            FirstName = model.FirstName,
                            MatricMarks = model.MatricMarks,
                            CollegeName = model.CollegeName,
                            HSSCMarks = model.HSSCMarks,

                        };
                        if (model.Profile != null && model.Profile.FileName != "" && model.Profile.FileName != null)
                        {
                            IFormFile file = model.Profile;


                            if (file.Length > 0)

                            //Convert Image to byte and save to database

                            {
                                using (var stream = new MemoryStream())
                                {
                                    await file.OpenReadStream().CopyToAsync(stream);
                                    formData.Profile = stream.ToArray();
                                }

                            }
                        }

视图模型

public class StudentSignUpViewModel
    {


        public string Username { get; set; }

        public string CollegeName { get; set; }

        public string HSSCMarks { get; set; }

        public IFormFile Profile { get; set; }
}

这是模型类

    public string MatricMarks { get; set; }
    public string CollegeName { get; set; }
    public string   HSSCMarks { get; set; }
    [Required]
    public byte[] Profile { get; set; }

这是我试图显示图像的 Edit[GET] 方法,请指导出了什么问题

public IActionResult Edit(int? id)
        {
            StudentSignUpViewModel model = new StudentSignUpViewModel();
            if (id == null)
            {
                return NotFound();
            }

            var student = _context.Students.Where(x => x.StudentId == id.Value).Include(x=>x.AppUser).FirstOrDefault();
            model.MatricMarks = student.MatricMarks;
                model.CollegeName = student.CollegeName;
                model.HSSCMarks = student.HSSCMarks;
                model.CoursesArray = student.Courses;

                var base64 = Convert.ToBase64String(student.Profile);
                ViewBag.imgSrc = string.Format("data:image/jpg;base64,{0}",model.Profile, base64);
                }

查看我尝试显示图像的方法

<div class="form-group">
                        <img src="@ViewBag.imgSrc" class="profile-user-img img-responsive img-circle" alt="User profile picture" />

                        <label asp-for="Username" class="control-label"></label>
                        <input asp-for="Username" class="form-control" />

注意:不相关的代码被删除

标签: asp.netasp.net-core

解决方案


要使用 base64 字符串显示二进制图像,请修改您的代码如下。

var base64 = Convert.ToBase64String(student.Profile);

ViewBag.imgSrc = string.Format("data:image/jpg;base64,{0}", base64);

此外,您还可以将这些图像文件保存在您的 Web 服务器上,而不是将它们存储在数据库中,以便您的应用程序可以直接将这些图像提供给客户端。

有关提供静态文件的更多信息,请查看:https ://docs.microsoft.com/en-us/aspnet/core/fundamentals/static-files?view=aspnetcore-3.1


推荐阅读