Retrieve Image From the Database in ASP.Net

Introduction

This article shows how to fetch an image from a database.

To explain this article, I will do the following genral procedure:

1. Create a table in the database to store the image and some other relevant data to fetch the image from the table and store some data into the table.
2. Create a website with a generic handler (.ashx) with some code, that will fetch the image data from the database.
3. Create a page that contains an image control in the design part of that page (.aspx) that will call the generic handler (.ashx).

The is the details of the preceding procedure.

Step 1

1. Create a table named "Images" that will store:
   
   
   • Roll number of a student
   • Image of a student
   • Date of image insertion
     
     
     1. CREATE TABLE dbo.Images(
     2. Roll_no varchar(12) primary key,
     3. img varbinary(max) ,
     4. img_date datetime
     5. )
        
   
   
   
   
2. After storing some data into the table:
   
   
   

Note: To understand saving the image in the database, read my previous article "How to Save An Image Into the Database".

Step 2

1. Create a new empty Website named "ImageToBinary".
   
   
   
2. Add a new Generic Handler named "ImageHandler.ashx".
   
   
   
   That will look like:
   
   
   

Step 3

1. Add a web Form named "GetImage.aspx".
   
   
   
   
2. Add the following 3 controls to the page:
   
   
   • TextBox (for Roll number of student)
   • Image with fixed height and width (to show the image)
   • Button with Onclick event (for getting the image via handler)
     
     Roll Number
     
     
     1. <asp:TextBox ID="txtrollno" runat="server">
     2. </asp:TextBox>
     3. <asp:Image ID="Image1" runat="server" length="100px" Width="100px" />
     4. <br />
     5. <asp:Button ID="txtGetImage" runat="server"
     6. Text="Convert" OnClick="txtGetImage_Click" />
        
     
     
     
     
3. Set the generic handler with roll number in "querystring" as "imageurl" of the image control on the click of event of the button like this:
   
   
   1. Image1.ImageUrl = "ImageHandler.ashx?roll_no=" + txtrollno.Text;
      
   
   
   

Step 4

Get the image from the database via handler.

1. Delete or comment the 2 default generated lines, that are specified below. Just because of irrelevancy.
   
   
   1. context.Response.ContentType = "text/plain";
   2. context.Response.Write("Hello World");
      
2. Write the code to fetch the image from the database.
   
   
   1. string roll_no = context.Request.QueryString["roll_no"].ToString();
   2. string sConn = System.Configuration.ConfigurationManager.ConnectionStrings["constr"].ToString();
   3. SqlConnection objConn = new SqlConnection(sConn);
   4. objConn.Open();
   5. string sTSQL = "select img from Images where Roll_no=@roll_no";
   6. SqlCommand objCmd = new SqlCommand(sTSQL, objConn);
   7. objCmd.CommandType = CommandType.Text;
   8. objCmd.Parameters.AddWithValue("@roll_no", roll_no.ToString());
   9. object data = objCmd.ExecuteScalar();
   10. objConn.Close();
   11. objCmd.Dispose();
   12. context.Response.BinaryWrite((byte[])data);
       

Run the page that will be like:



Fill in the roll number and click on the button to get the image.



Result

Now you can see the image that was stored in the database in binary format.