Home > ASP.NET Articles

Determining the Dimensions of Uploaded Images in ASP.NET

This article how to describes how to determine the width and height of an image after it has been uploaded to a web server using the file upload facilities within the .NET Framework of ASP.NET.

Determining image dimensions can be useful in a number of situations. One of the most useful is to ensure that users of a web application such as a content management system do not upload massive 4000 x 3000 pixel images for display on their pages! If large images are uploaded, then the user could be informed that they should resize the image. Alternatively using some of the other image handling facilities in the .NET Framework it would be possible to build in some sort of automatic image resizing functionality.

Building the Upload Form

The upload form is a standard ASP.NET form - the HTML is shown below.

Note that for a file uploading form, the Form tag must have the encType="multipart/form-data" attribute. There should also be an Input web control with its Type attribute set to file. Finally the form will also need a submit button, which in this example has the ID of ButtonUpload.

<form id="UploadImage" method="post" encType="multipart/form-data" runat="server">
<p>Choose an image file from your machine:
<br>
    <INPUT id="UploadedPicture" type="file" name="UploadedPicture" runat="server">
<br>
<asp:button id="ButtonUpload" runat="server" Text="Upload This Image"></asp:button>
</p>
</form>

Creating the Upload Event Handler

The click event of the ButtonUpload button will handle the uploading of the image and the subsequent operations to determine the size of the uploaded picture. The code for this is show in both C# and VB.NET.

C# Code for Image Uploading

The code for the event handler is shown below. The UploadedPicture.PostedFile object can be used to interrogated to find out about the uploaded image. It contains a number of properties. For example, the string UploadedPicture.PostedFile.FileName contains the filename of the uploaded file.

The UploadedPicture.PostedFile.ContentType property is also worth interrogating as it contains information about the type of file uploaded. For security and data integrity reasons it is a good idea to only specifically allow the uploading of specific file types. Uploaded JPEGs will have the ContentType property of image/gif, JPEGs will either have image/jpeg or image/pjpeg.

To determine the dimensions of the uploaded image, a System.Drawing.Image object is created from the uploaded image's input stream, i.e. UploadedPicture.PostedFile.InputStream. The image's properties can then be used to determine its dimensions - PhysicalDimension.Width and PhysicalDimension.Height in the case of image width and height.

Note that determining the dimensions of an image works for most JPEGs and GIFs, but there is no guarantee that it will work with other image formats. As always, production code should have plenty of exception handling added!

private void ButtonUpload_Click(object sender, System.EventArgs e)  {

    //Determine type and filename of uploaded image
    string UploadedImageType = UploadedPicture.PostedFile.ContentType.ToString().ToLower();
    string UploadedImageFileName = UploadedPicture.PostedFile.FileName;

    //Create an image object from the uploaded file
    System.Drawing.Image UploadedImage = System.Drawing.Image.FromStream(UploadedPicture.PostedFile.InputStream);

    //Check that image does not exceed maximum dimension settings
    if (UploadedImageWidth > 600 || UploadedImageHeight > 400) {
            Response.Write("This image is too big - please resize it!");
    }

}

VB.NET Code for Image Uploading

Private Sub ButtonUpload_Click(ByVal sender As Object, ByVal e As System.EventArgs)

    'Determine type and filename of uploaded image
    Dim UploadedImageType As String = UploadedPicture.PostedFile.ContentType.ToString().ToLower()
    Dim UploadedImageFileName As String = UploadedPicture.PostedFile.FileName

    'Create an image object from the uploaded file
    Dim UploadedImage As System.Drawing.Image = System.Drawing.Image.FromStream(UploadedPicture.PostedFile.InputStream)

    'Determine width and height of uploaded image
    Dim UploadedImageWidth As single = UploadedImage.PhysicalDimension.Width
    Dim UploadedImageHeight As single = UploadedImage.PhysicalDimension.Height

   'Check that image does not exceed maximum dimension settings
    If UploadedImageWidth > 600 Or UploadedImageHeight > 400 Then
        Response.Write("This image is too big - please resize it!")
    End If

End Sub

Useful Development Tools

ASP Documentation Tool™

Automatically creates developer documentation for ASP 2.0 and 3.0 web applications written in VBScript and JScript. Documentation for Microsoft Access, SQL Server 7/2000 databases and Visual Basic 6.0 components associated with the web application can also be incorporated into the reports. Documentation is created in HTML, HTML Help and plain text formats.

View Sample Output (HTML Help format).     View Sample Output (HTML Format).     Download Trial Version (5.2Mb ZIP file).

.NET Documentation Tool

Automatically creates technical documentation for .NET Framework Windows and ASP.NET applications written in C# or VB.NET and SQL Server 7/2000/2005 or Microsoft Access databases associated with the application. Documentation is created in HTML, HTML Help and plain text formats.

View Sample Output (HTML Help format).     View Sample Output (HTML Format).     Download Trial Version (5Mb ZIP file).

SQL Documentation Tool

The SQL Documentation Tool creates technical documentation for Microsoft SQL Server 7.0 and 2000 databases. Technical documentation is created in HTML and HTML Help formats. The HTML Help format documentation is fully searchable and cross referenced. The SQL Documentation Tool documents SQL Server Tables, Views, Stored Procedures, Triggers and Table Relationships.

View Sample Output (HTML Help format).     View Sample Output (HTML Format).     Download Trial Version (10.3Mb ZIP file).

VB Documentation Tool

The VB Documentation Tool creates technical documentation for Microsoft Visual Basic 6.0 projects. Technical documentation is created in HTML and HTML Help formats. The HTML Help format documentation is fully searchable and cross referenced.

View Sample Output (HTML Help format).     View Sample Output (HTML Format).     Download Trial Version (1Mb ZIP file).

Indexing Service Companion

The Indexing Service Companion is a Windows application that extends the functionality of the Microsoft Windows Indexing Service so that it is able to index content from remote websites and also from ODBC databases. As such it can be used as a low cost alternative to Sharepoint Portal Search Services.

Try Sample Search Facility.     Download Trial Version (1.7Mb ZIP file).

The Website Utility

The Website Utility examines websites for errors and areas that need to be optimised for search engines by using a built in web crawling engine. Errors checked for include broken or moved hyperlinks, missing page titles and missing meta tags. It also generates HTML for use in creating website site maps (table of contents pages - like this one), and is able to create both client-side JavaScript Search Engines and server-side ASP Search Engines for a website.

View Sample Output (HTML Format).     Download Trial Version (3Mb ZIP file).

PHP Documentation Tool™

Automatically creates developer documentation for PHP web applications. Documentation is created in HTML, HTML Help and plain text formats.

View Sample Output (HTML Help format).     View Sample Output (HTML Format).     Download Trial Version (1.0Mb ZIP file).