Question

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

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

这是我从索引操作获得的输出：

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

Answer 1

我认为您应该将图像保存在网站根目录中的图像文件夹中，而不是在views文件夹中。因为views文件夹的内容被禁止从公共访问。

无法在ASP.NET MVC 5中显示图像

1 个答案: