CODEWITHSUNDEEP
c#asp.net-mvc
user2465036
user2465036

Reputation: 351

How can I correctly display a list of images from database in asp.net mvc?

My requirement is to get the images from the database and display in front end.In my case i am using asp.net MVC . Database ir oracle and the data type of the image is blob .The follwing is my code

Model

This is the Model for the class and it has two properties ImageDisplay and ImageStream.

public class SelectionModel
{
    public byte[] ImageDsiplay { get; set; }
    public MemoryStream ImageStream { get; set;}
}

Controller Code

In the controller I'm trying the get the image from he database and assign to the Model.

public ActionResult Index()
{
    SelectionModel sel = new SelectionModel();

    List<SelectionModel> lissel = new List<SelectionModel>();
    byte[] imagedata;

    string sql = "select filecontent from filestore";

    OracleConnection con = new OracleConnection(ConStr);
    OracleCommand com = new OracleCommand(sql, con);

    try
    {
        con.Open();

        OracleDataReader dr;

        dr = com.ExecuteReader();

        while (dr.Read())
        {
            imagedata = (byte[])dr[0];

            sel.ImageDsiplay = imagedata;

            var stream = new MemoryStream(sel.ImageDsiplay);

            sel.ImageStream = stream;

            lissel.Add(sel);
        }
    }
    catch (Exception ex)
    {
        // ??
    }

    //Here i am trying to return the list .

    return View(lissel);
}

View Code

The Following is the view code and it should display the image .

@model IEnumerable<GoldForGold.Models.SelectionModel>

<table>
    <tr>
        <td>        
            @foreach (var item in Model)
            {
                <img  src="@Url.Action("Index", "Selection")" alt="myimage" />
            }
        </td>
    </tr>
</table>

ISSUE

The issue is i am not able to display the images from the database. Image is not displayed.I have tried for quite sometime but not able to figure out the issue

Upvotes: 2

Views: 1352

Answers (2)

Rob
Rob

Reputation: 10248

I use the WebImage class in my controllers for dynamically rendering and resizing image in the DB:

[ImageOutputCache(Duration = 18000)]
public void Image(int id)
{
    Image image = ImageDAL.SelectSingle(e => e.ImageId == id); //EF Model

    WebImage webimage = new WebImage(image.Data); //image.Data (byte[])

    //resize, crop etc

    webimage.Write();
}

Here is the attribute code for the output caching (otherwise the cache outputs a content type of text/html):

    public class ImageOutputCache : OutputCacheAttribute
    {
        public override void OnResultExecuting(ResultExecutingContext filterContext)
        {
            base.OnResultExecuting(filterContext);

            filterContext.HttpContext.Response.ContentType = "image/jpeg";
        }
    }

Upvotes: 1

itsme86
itsme86

Reputation: 19486

Historically, I've used an IHttpHandler for this sort of thing. Something like this:

public class EmployeePhotoHandler : IHttpHandler
{
    public bool IsReusable { get { return false; } }

    public void ProcessRequest(HttpContext context)
    {
        int employeeID;
        if (!int.TryParse(context.Request.QueryString["ID"], out employeeID))
            return;

        EmployeePhoto photo = EmployeeService.GetPhotoByEmployee(EmployeeService.GetEmployeeByID(employeeID));
        if (photo == null || photo.Photo == null)
            return;

        context.Response.ContentType = "image/jpeg";
        context.Response.BinaryWrite(photo.Photo);
    }
}

Upvotes: 1

Related Questions