ASP.NET Image Output

Image output. An image can be written to the Response.

This allows the image to be displayed only in certain cases. We use an ASPX page or an ASHX handler to display it. We write images in ASP.NET in a simple and reliable way.

Intro. First, when you use the Response.Write method in ASP.NET, it replaces the actual web forms in your ASPX page. You need to add an image to the root of your web site project in Visual Studio. Use Website and then Add Existing Item.

Then: In the dialog, browse to your image and click Add. It appears in the right pane called Solution Explorer.

Code-behind. Let's examine the code-behind for writing an image to the output. The hardest part here involves telling the web page where your image is located. You have to use a method called MapPath. Also, you could use PhysicalApplicationPath.

MapPathPhysicalApplicationPath

Page that writes image: C#

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
	string loc = Server.MapPath("~/Name.png");
	Response.WriteFile(loc);
	Response.ContentType = "image/png";
    }
}

The above code is from default.aspx.cs. Most of the lines should already be there. It uses Server.MapPath. Server is an intrinsic object on the Page class, and it has a method called MapPath.

And: It uses a virtual path. The string "~/Name.png" indicates a file called Name.png at the root of your application.

Then: Response.WriteFile is used. This method writes the contents of the file Name.png to the output. It writes the raw binary of the file.

Next, it sets the ContentType property. This property tells the browser what the type of the binary is. This part is not actually needed—most browsers will infer the correct image type.

Set ContentType

Finally: To test, browse to Default.aspx. The entire contents of Default.aspx are replaced with the image written to the Response.

Content types. Your binary file will have a content type. It is best to usually specify this. If you do not, browsers will sometimes not be able to know what the binary is. The content types can easily be set in ASP.NET.

Tip: Simply use the Response.ContentType property and assign it to one of the strings.

Content types

image/png
image/jpeg
image/gif
text/css
text/html
text/plain
text/xml
application/zip
application/xhtml+xml
application/x-shockwave-flash

Summary. We rendered image data to the response buffer in an ASP.NET web application. Use this kind of code for writing images to output. This code can be improved to eliminate bandwidth leeching as well. It works well and is fast.

Tip: You can combine this technique with web handler files using the ASHX extension for even simpler code.

ASHX Handler

Related Links