Question

EDIT code updated

when I removed dataType it call success. however, the image does not get displayed (instead a placeholder X for an image tag is displayed). Is it even possible to display the bytes of an image in a html image tag?

original

With the following snippet (config seems to be fine) I am trying to experiment to see if I can get bitmap data from the server and load it into the DOM. The problem is it is the ajax call gets an error but the status code is 200 “OK”… does anyone know why?

Default.aspx (test page)

<div></div>
...
<script type="text/javascript">
    /// <reference path="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5-vsdoc.js"/>
    $(function () {
        $.ajax({
            type: "GET",
            url: "Service.svc/GetBitmap",
            context: $("<div>"),
            success: function (r) {
                $(this).append(
                   $("<img src='data:image/bmp;base64," + r.text+ "'></img>"));
            },
        });
    });
</script>

Service.cs (test service)

public class Service : IService
{
    public byte[] GetBitmap()
    {
        MemoryStream ms = new MemoryStream();
        Bitmap b = new Bitmap(HostingEnvironment.MapPath(@"~/Bitmap/test.bmp"));
        b.Save(ms, ImageFormat.Bmp);
        return new BinaryReader(ms).ReadBytes((int)ms.Length);
    }
}

Answer 1

Firstly, the correct MIME type is image/bmp, not img/bmp.

That said, as far as I know $.ajax only supports text data types. See here: http://api.jquery.com/jQuery.ajax/

I would suggest you to write a service that returns the image via a well-known URL.