VS Builtin web server sends images as octet-stream

Question

I am debugging an ASP.NET website which has a lot of javascripts and images using Visual Studio 2008 development web server.

One of the many scripts try to create an <img> tag on the fly and supply it with a proper src attribute. However, none of the images are loaded and instead alt text are displayed in Firefox, IE and Opera.

Digging further, I copied one of the image link and then paste it in Firefox's address bar and this is what comes up in live headers window:

GET /images/nav/zoomin.png HTTP/1.1
Host: localhost:7777
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.0.6) Gecko/2009011913 Firefox/3.0.6 (.NET CLR 3.5.30729)
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive

HTTP/1.x 200 OK
Server: ASP.NET Development Server/9.0.0.0
Date: Wed, 25 Feb 2009 16:59:23 GMT
X-AspNet-Version: 2.0.50727
Cache-Control: private
Content-Type: application/octet-stream
Content-Length: 292
Connection: Close

The problematic part is the Content-Type header which is somehow set to "application/octet-stream" forcing a download operation instead of showing normally inside the <img> tag.

I am quiet sure that it isn't the javascript that is the problem, because it is code that has been copied verbatim from another application that worked just fine.

I believe I might have misconfigured something somewhere. But I could be wrong, so here's the code that create the HTML tag:

var zin = document.createElement("img");
zin = $Img.Png(zin, Settings.ImageHost + "zoomin.png");
zin.style.top = (this.y + zoomPaddingY) + "px";
zin.style.left = (this.x + zoomPaddingX) + "px";
zin.style.position = "absolute";
$Img.Swap(zin, Settings.ImageHost + "zoomin.png", Settings.ImageHost + "zoomin_active.png");
zin.alt = zin.title = "zoom in";
zin.style.cursor = this.hand;
$Evt.addListener(zin, "click", this.zoomIn, this, true);

// long long scroll ...

controlDiv.appendChild(zin);

The $Img.Png part is working fine for other PNG images, so it shouldn't be the source of the problem.

What did I did wrong?!?

Thanks for any help!

It's already midnight here... and I'm still working on this little app...

Answer 1

Are you using a GenericHandler that renders the image?

It would seem like an easy choice to do so.

Eg.

public class RenderImage : IHttpHandler, IReadOnlySessionState
{
  public void ProcessRequest(HttpContext context)
  {
     context.Response.ContentType = "image/png";
     context.Response.Clear();

    // TODO: Write image data
    Bitmap bitmap = ...

    bitmap.Save(Response.OutputStream,ImageFormat.Png);

    context.Response.End();
  }

  public bool IsReusable { get { return false; } }
}