Post
Ask Question

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. ) 
     
    Create Table

  2. After storing some data into the table:

    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".

    empty Website
     
  2. Add a new Generic Handler named "ImageHandler.ashx".

    ImageHandler

    That will look like:

    look

Step 3

  1. Add a web Form named "GetImage.aspx".

    Add a web Form

  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" /> 

      Add 3 controls

  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; 

    Click of event of button

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

 fetch the image from the database

Step 5
 
Run the page that will be like:

Run the Page

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

roll number

Result

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


Similar Articles