5

我正在编写一个 ASP.NET MVC4 应用程序,它将上传的图像存储byte[]在数据库中(使用实体框架),然后显示它们。要在视图中显示我正在使用此代码的图像:

<img src="data:image;base64,@System.Convert.ToBase64String(item.ImageByte)" alt=""/>

但是每次我刷新页面时,我都会看到浏览器没有缓存图像,只是再次渲染它,导致不必要的带宽使用。

也许有一种更带宽更友好的方式来显示图像?也许将上传的图像存储为'byte []'的想法首先是愚蠢的(我的应用程序只是一个简单的网页,它存储有关心理学的文章:D 并带有一个管理面板来实现这一点),我应该只将图像存储在一个文件夹?

谢谢

4

3 回答 3

5

将图像存储在数据库中是一种可能的选择。有好主意的时候,也有坏主意的时候。一般来说,如果处理大量或大尺寸的图像,您可能会被建议重新考虑使用不同的存储方法。

实际上,您当前正在做的是将图像嵌入 HTML 中;这可能很好,我以前用过它,计算图表的数据大约需要 5 秒,页面需要相同的数据,但在一般情况下,你最好从动作中提供图像.

所以我们需要做的是在控制器中提供一个动作来获取图像;可能基于 id - 但我会留给你。

[OutputCache(Duration = 3600, VaryByParam = "id")]
public ActionResult GetImage(int Id)
{
    // 1. provide connection to entity framework
    var dbc = new DatabaseContext();
    var item = dbc.FindItem(Id);// call to get the image from EF (2)
    var ms = new MemoryStream(tem.ImageByte);    
    FileStreamResult result = new FileStreamResult(ms, "image/png");
    result.FileDownloadName = item.ImageName; // or item.Id or something (3)
    return result;
}

在cshtml中

<img src="@Url.Action("GetImage", "Controller", new {Id = Model.ImageId})" />

所以在上面的代码中你需要提供

  1. 与 EF 的连接
  2. 定位图像的调用
  3. 图像名称的东西
  4. 可能更改输出缓存
于 2013-08-09T21:05:18.787 回答
3

在您HomeController添加这样的功能:

[HttpGet]
public FileResult GetImage(string id)
{
    byte[] fileContents = ...; // load from database or file system
    string contentType = "image/jpeg";
    return File(fileContents, contentType);
}

在以下位置注册到此处理程序的路由Global.asax.cs

routes.MapRoute(
    "GetImage",
    "img/{id}",
    new { controller = "Home", action = "GetImage" });

在您的网页中,使用src指向此操作:

<img src="@Url.Action("GetImage", "Home", new { id = "logo.jpg" })" />

这将解决

<img src="/img/logo.jpg" />
于 2013-08-09T21:06:15.693 回答
2

添加通用处理程序

public class Handler : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        long id = Convert.ToInt64(System.Web.HttpContext.Current.Request.QueryString["id"]);
        string model = (System.Web.HttpContext.Current.Request.QueryString["model"]);
        DbContext Db = new DbContext();
        byte[] picture = new byte[0];

        switch (model)
        {
            case "News":
                NameSpace.Models.News news = Db.Newss.Single<NameSpace.Models.News>(n => n.ID == id);
                picture = news.Picture;
                break;

            case "Article":
                NameSpace.Models.Article article = Db.Articles.Single<NameSpace.Models.Article>(a => a.ID == id);
                picture = article.Picture;
                break;
        }

        context.Response.Clear();
        context.Response.ContentType = "image/jpeg";
        context.Response.BinaryWrite(picture);
        context.Response.Flush();
        context.Response.End();
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

*并考虑使用此图像 img src="/Handlers/Handler.ashx?id=@item.ID&model=News"

于 2013-08-09T20:56:09.867 回答