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

Question

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

You keep repeating your intro. You keep repeating your intro. You keep repeating your intro. — itsme86
– itsme86, Commented Feb 20, 2014 at 22:18
Lol..itsme86 .It was not leting me to post the question .I wanted to me add more content . So sorry about that.. Do you have an solution for the above problem? — user2465036
– user2465036, Commented Feb 20, 2014 at 22:25

itsme86 · Accepted Answer · 2014-02-20 23:05:18Z

1

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);
    }
}

answered Feb 20, 2014 at 23:05

itsme86

19.6k4 gold badges44 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user2465036 Over a year ago

Hello itsme86 ..I am trying to work with your solution ..can you please explain as per my quesion because i am just starting with MVC

user2465036 Over a year ago

I mean to say what are the properties in the model should look like and what is the line of code in the view to render the image .

Rob · Accepted Answer · 2014-02-21 04:50:31Z

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";
        }
    }

Collectives™ on Stack Overflow

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

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related