Explanation
In the Page_Load() method, we check the IsPostBack property to
see if the page has been posted back ( user has clicked the 'submit' button ), if it has then
we delegate the work of uploading respective files to respective methods ( with or without
restrictions ).
private void Page_Load(object sender, System.EventArgs e)
{
if(IsPostBack)
{
message.Attributes.Add("align", "left");
UploadImageWithSizeRestrictions(file.PostedFile);
UploadImageWithDimensionRestrictions(file1.PostedFile);
UploadImageWithNoRestrictions(file2.PostedFile);
}
else
{
message.Attributes.Add("align", "center");
AppendMessage("Select file to upload.");
}
}
We have also added a method to display useful information to the user about the size,
type, width and height of the image. This method is here only for debugging purposes, you
should remove it ( and all calls to it ) in the production system as it does nothing but
to degrade performance.
private void DisplayImageInfo(HttpPostedFile image)
{
AppendMessage(String.Format("FileName: {0}<br>", image.FileName));
AppendMessage(String.Format("FileSize: {0} KB<br>",
image.ContentLength / 1024));
using(Bitmap bitmap = new Bitmap(image.InputStream, false))
{
AppendMessage(String.Format("Width: {0}<br>", bitmap.Width));
AppendMessage(String.Format("Height: {0}<br>", bitmap.Height));
if(bitmap.RawFormat.Equals(ImageFormat.Bmp))
{
AppendMessage("ImageFormat: Bitmap Image (BMP)<br>");
}
if(bitmap.RawFormat.Equals(ImageFormat.Gif))
{
AppendMessage("ImageFormat: Graphics Interchange Format (GIF)<br>");
}
if(bitmap.RawFormat.Equals(ImageFormat.Jpeg))
{
AppendMessage("ImageFormat: Joint Photographic Experts Group (JPEG)<br>");
}
if(bitmap.RawFormat.Equals(ImageFormat.Png))
{
AppendMessage("ImageFormat: W3C Portable Network Graphics (PNG)<br>");
}
}
}
Then we have another useful method which other methods will call to make sure that the
file they are going to process is in fact an image file.
This method uses regular expressions to make sure that the content-type of the
uploaded file contains "image/*". It it does then it is an image, otherwise not.
Note: Remove the call to DisplayImageInfo() in production systems.
private bool IsImage(HttpPostedFile file)
{
if(file != null && Regex.IsMatch(file.ContentType, "image/\\S+") &&
file.ContentLength > 0)
{
DisplayImageInfo(file);
return true;
}
return false;
}
Let us see the code for the first method responsible for uploading image file only if the
size of that image is between 5 KB and 20 KB.
Now this is important, lot of users have been asking me how to get to know the size of
an uploaded image without actually saving that image on the server. This method illustrates
how to do that.
After using IsImage() to check if this is an image file, all it has to do
to is to use HttpPosteFiled.ContentLength property to get the size of uploaded
file in bytes. It then checks this size against the two minimum ( 5 KB ) and maximum
( 20 KB ) values. If the size is in between those values, it allows uploading of the file
by calling our UploadImage() method.
protected void UploadImageWithSizeRestrictions(HttpPostedFile file)
{
if(IsImage(file))
{
int contentLength = file.ContentLength;
if(contentLength > MinSize && contentLength < MaxSize)
{
UploadImage(file);
}
else
{
AppendMessage(String.Format("<span style=\"color:red;\">Image size " +
"exceeding limits: {0} KB</span><br><br>",
contentLength / 1024));
}
}
}
Next method makes sure that images with width and height less than 300 pixels each get
uploaded. It does that by creating a Bitmap object and then using it's Width
and Height properties to determine it's width and height.
Now this is very interesting. I've seen sites that display a form and then ask the user
to upload his/her site's logo and then suggesting that user to make sure that width and
height are say for example 100x40 pixels. But if the user uploads an image of wider width
and height, the form still uploads the image as it doesn't check the width and height of the
uploaded image against the required values. Now after seeing the code to do that in this article,
you can be sure that you will not make that mistake.
protected void UploadImageWithDimensionRestrictions(HttpPostedFile file)
{
if(IsImage(file))
{
using(Bitmap bitmap = new Bitmap(file.InputStream, false))
{
if(bitmap.Width < MaxWidth && bitmap.Height < MaxHeight)
{
UploadImage(file);
}
else
{
AppendMessage(String.Format("<span style=\"color:red;\">Image " +
"dimensions exceeding limits: {0} x {1}</span><br><br>",
bitmap.Width, bitmap.Height));
}
}
}
}