asp.net-mvc - 无法在 ASP.NET MVC 5 中显示图像

问题描述

我想创建一个画廊页面，但无法显示图像存储在目录中并且图像详细信息存储在数据库中的图像，下面是我的图像创建操作：

public ActionResult Create(ImagesVM img, HttpPostedFileBase upload)
    {
        if (ModelState.IsValid)
        {
            var filename = "";
            var path = "";
            if (upload != null && upload.ContentLength > 0)
            {
                if (!Directory.Exists(Server.MapPath("~/Images/" + img.PlayerId)))
                {
                    Directory.CreateDirectory(Server.MapPath("~/Images/" + img.PlayerId));
                }
                var ext = upload.ContentType.ToString();
                ext = ext.Substring(ext.LastIndexOf('/') + 1).ToString();
                filename = img.PlayerId.ToString() + "_" + Guid.NewGuid().ToString() + "." + ext;
                path = Server.MapPath("~/Images/" + img.PlayerId.ToString() + "/" + filename);
            }
            else
            {
                ModelState.AddModelError("error", "There was an error with saving the record");
                img.Players = new SelectList(db.Players, "Id", "Name");
                return View(img);
            }

            upload.SaveAs(path);
            ImageDTO dto = new ImageDTO();
            dto.ImageName = filename;
            dto.ImageUrl = path;
            dto.ThumbnailTitle = img.ThumbnailTitle;
            dto.ThumbnailDetails = img.ThumbnailDetails;
            dto.PlayerId = img.PlayerId;
            db.Images.Add(dto);
            db.SaveChanges();
            return RedirectToAction("Index");
        }

        img.Players = new SelectList(db.Players, "Id", "Name");
        return View(img);

    }

这是我要显示图像的索引视图：

@model IEnumerable<CricketNew.Models.Data.ImageDTO>

@{
ViewBag.Title = "Index";
var imgPath = "~/Images/";
}

<h2>Index</h2>

<p>
@Html.ActionLink("Create New", "Create")
</p>


<div class="container">
    <h2>Image Gallery</h2>
    <p>The .thumbnail class can be used to display an image gallery.</p>
    <p>The .caption class adds proper padding and a dark grey color to text 
inside thumbnails.</p>
    <p>Click on the images to enlarge them.</p>

@foreach (var item in Model)
{
    <div class="row">
        <div class="col-md-4">
            <div class="thumbnail">
                <a href="@(imgPath + item.PlayerId + "/" + item.ImageName)" target="_blank">
                    <img src="@(imgPath + item.PlayerId + "/" + item.ImageName)" alt="Lights" style="width:100%">
                    <div class="caption">
                        <p>Lorem ipsum donec id elit non mi porta gravida at 
eget metus.</p>
                    </div>
                </a>
            </div>
        </div>

    </div>
}

我尝试了不同的方法，如下所示：

<img src="@Url.Content(imgPath + item.PlayerId + "/" + item.ImageName)" alt="Lights" style="width:100%">  
//this gives output like /Views/Images/Photos/1/abc.jpeg

<img src="@Url.Content(item.ImageUrl)" alt="Lights" style="width:100%">  
//this gives output like D:/Projects/Cricket/Views/Images/Photos/1/abc.jpeg

<img src="@(imgPath + item.PlayerId + "/" + item.ImageName)" alt="Lights" style="width:100%">  
//this gives output like D:/Projects/Cricket/Views/Images/Photos/1/abc.jpeg

这是我从 index 操作中获得的输出：

但我无法正确加载图像，非常感谢您的帮助。

标签： asp.net-mvc

asp.net-mvc - 无法在 ASP.NET MVC 5 中显示图像

问题描述

解决方案

推荐阅读