在 MVC 中从数据库上传和显示多个图像

Question

我正在使用 ASP.NET MVC，我正在尝试将多张图片上传到数据库，然后在视图中显示它们。我相信上传过程正在运行，但是当我尝试显示图像时，只显示替代文本并且在 Chrome 调试中找不到资源错误。

这是我的图像在我的视图中的显示方式

@model IList<InspectionPhoto>

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
    <h4 class="modal-title" id="myModalLabel">Photo Management</h4>
</div>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    <div class="modal-body">
        <div class="form-horizontal">

            @if (Model.Count > 0)
            {
                <div class="row">
                    @for (var i = 0; i < Model.Count(); i++)
                    {
                        <div class="row">
                            <div class="col-md-6">
                                <img src="@Url.Action( "ShowPhoto", "Inspection", new { id = Model[i].PhotoID } )" alt="Image not available" />
                            </div> 
 //continues

显示图片方法：

public Bitmap ShowPhoto(int id)
{
    InspectionPhoto image = db.InspectionPhotoes.Find(id);
    var result = (Bitmap)((new ImageConverter()).ConvertFrom(image.ImageBytes));
    return result;
}

显示照片方法在我的 Inspections 控制器中，因为照片视图是模态局部视图，当在检查视图中单击按钮时显示。

如有任何帮助，我们将不胜感激。如果需要更多信息，请告诉我。

Answer 1

你的 ShowPhoto 方法是 return 位图，你试图写入的是 html 的 img src 标签，它需要一个 url-string。您应该将 ShowPhoto 函数修改为 return 与已上传图像关联的 url。

Answer 2

ShowPhoto returns Bitmap 但应该 return File 如下所示。如果您的图像保存正确，那么以下应该可以正常工作。

public ActionResult ShowPhoto(int id)
{
    InspectionPhoto image = db.InspectionPhotoes.Find(id);
    byte[] result = image.ImageBytes;
    return File(result, "image/png");
}

Answer 3

我认为你应该 return FileContent

    public FileContentResult GetImage(int id)
    {
        InspectionPhoto image = db.InspectionPhotoes.Find(id);
        byte[] byteArray = image.ImageBytes ;
        return byteArray != null
            ? new FileContentResult(byteArray, "image/jpeg")
            : null;
    }

在 MVC 中从数据库上传和显示多个图像

Uploading and displaying multiple images from database in MVC

c#

asp.net-mvc

image-uploading