Abstract
.NET is the new distributed computing platform developed by Microsoft and ASP.NET is its programming model for web development. The intent of this article is to get a good experience in developing data driven ASP.NET Web Forms applications by means of a real world application. This application will teach you how to save an image file into a database and how to retrieve it from the database. It uses ADO.NET as the data access mechanism, C# as the development language, and SQL Server 2000 as the backend database.
Overview of the Solution
Normally, images are saved in the web server folder, not in the database; this is for larger file size category. In some cases like, in bank, for example, they scan the user signatures as image files and save that file into the database.
- Database schema
MS SQL Server 2000 is used as the backend database for this small demonstration. And I used a special data type in SQL Server called image
. The image data type is used to save the image into the database.
- Controls used in this application
System.Web.UI.HtmlControls.HtmlInputFile
System.Web.UI.WebControls.TextBox
System.Web.UI.WebControls.Button
- Namespaces used in this application:
using System.Data.SqlClient;
using System.Drawing;
using System.Data;
using System.IO;
using System.Drawing.Imaging;
Solution with Code
Use the HtmlInputFile
class, which you can declare an instance of with an <input type="file" runat="server"/>
tag. The following example is a complete ASPX file that lets a user upload an image file and a comment describing the image. The OnUpload
method writes the image and the comment to a table named Pictures in a SQL Server database named iSense.
public void OnUpload(Object sender, EventArgs e)
{
int len = Upload.PostedFile.ContentLength;
byte[] pic = new byte[len];
Upload.PostedFile.InputStream.Read (pic, 0, len);
SqlConnection connection = new
SqlConnection (@"server=INDIA\INDIA;database=iSense;uid=sa;pwd=india");
try
{
connection.Open ();
SqlCommand cmd = new SqlCommand ("insert into Image "
+ "(Picture, Comment) values (@pic, @text)", connection);
cmd.Parameters.Add ("@pic", pic);
cmd.Parameters.Add ("@text", Comment.Text);
cmd.ExecuteNonQuery ();
}
finally
{
connection.Close ();
}
}
The above created function is called using the onClick
property of a button.
How do I read an image from a database using ADO.NET and display it in a Web page?
Here, I used the web page to display the image and not any other control. The following is the code for displaying the image from the database.
private void Page_Load(object sender, System.EventArgs e)
{
MemoryStream stream = new MemoryStream ();
SqlConnection connection = new
SqlConnection (@"server=INDIA\INDIA;database=iSense;uid=sa;pwd=india");
try
{
connection.Open ();
SqlCommand command = new
SqlCommand ("select Picture from Image", connection);
byte[] image = (byte[]) command.ExecuteScalar ();
stream.Write (image, 0, image.Length);
Bitmap bitmap = new Bitmap (stream);
Response.ContentType = "image/gif";
bitmap.Save (Response.OutputStream, ImageFormat.Gif);
}
finally
{
connection.Close ();
stream.Close ();
}
}
The GDI+ functions offer a rich set of features for managing and modifying image data. This article's examples offer only a glimpse into the functionality you can leverage using the classes available in the System.Drawing
and System.Drawing.Imaging
namespaces. For example, you can develop applications for storing and managing image files on the Web, or you can provide a simple, easily deployed application that enables users to manipulate images.
How to run this application? First, create a virtual directory and put the project files into the virtual directory. And then change the server name, database name, and table name in the following statement.
SqlConnection connection = new SqlConnection
("server=localhost;database=mypictures;uid=sa;pwd=");
and publish the project to get the best results.