How to save and get images from database

Publish date: Wednesday April 15, 2009

Images on webpages are mostly stored on server and accessed by giving the relative path to the file. This is a good solution for large size files. But sometimes it is easier to store small files into database. .NET environment provides mechanisms which make storing and managing images in database easier than ever before.

    What do we need?
  1. database table for storing images
  2. .aspx page with GUI to get and display images
  3. handler page for getting image from database

1) Ok, we've decided to store images in database, and so we need a table - let's call it Images - where we will save necessary data:

  • ImageID - table primary key
  • ImageContent - MSSQL offers special data type dedicated to image storage, in practice data are saved in the form of byte array
  • ImageType - HTTP MIME type file, we need it to know what the file format is (about MIME TYPE)
  • Description - nullable column for optional image description (we don't need it for getting or saving image but it is helpful when we search something in database, etc.)

2) So we have the place to store the data now. Let's take care of the form, on which we will save and dispaly our image.

We need 3 controls for the sake of this simple example: FileUpload - by means of which we will upload a file from disk, Button 'Save' - which will initiate saving function, and Image control - which will display the image saved in database:

Under btnSave_Click event of btnSave button we link saveImage() function, which will get image data from fupImage control, save the data in database and display image in imgMyImage control:

Notice: We need System.IO namespace for using stream.

Notice: Please remember about file type validation (only graphic files) and exception handling.

From fupImage control we get MIME content type and read byte array, which we will save in database. Now we just need to link image data to proper parameters of sql command and create a query. When the image has been saved, we can link it under imgMyImage control and here it comes:

3) handler page for displaying images - getting and displaying image from database.

To display image on web site, we use Image control, which unfortunately doesn't give possibility for direct linking of byte stream. The only way to link the file is by specifying a concrete URL address to an existing graphic file. So we create GetImageFromDB.aspx page which, on the basis of a parameter (ImageID) taken from URL address, will get and process required data, and by means of function Response.BinaryWrite(byte[] byteArray) will return as image. In other words, this page will be our link to image with a given ImageID ;)

    How to do it:
  • we link GetImageFromDB.aspx page with ImageID parameter under Image control
    imgMyImage.ImageUrl = ResolveUrl(string.Format("~/GetImageFromDB.aspx?ImgID={0}", ImageID.ToString()));
  • in Page_Load event of GetImageFromDB.aspx page we get ImageID
    String ImgID = Request.QueryString["ImgID"];
  • and connect with database to get data and return file
    Response.ContentType = myReader["ImageType"].ToString();
    byte[] byteArray = (byte[])myReader["ImageContent"];

Complete function code below:

Note: Please remember about exception handling. You can also check if image exists in database and display some default image if reader is empty.

Author: Agnieszka Rorot

Latest Tutorials Click here to see All Tutorials
How to save and get images from database How to save and get images from database
How to create HTTP Endpoint in SQL Server 2005 How to create HTTP Endpoint in SQL Server 2005
In-store video advertisement In-store video advertisement Online payment processing gateway Online payment processing gateway Tracking & rating with .NET shipping components Tracking & rating with .NET shipping components
Copyright Netrosoft @ 2007 - 2018