DIsplaying image retrieved by Ajax

I read a number of posts on this but nothing seemed to help. I have an ajax client that retrieves an image from a remote web service running on a Jetty server. If I use the browsers (Firefox etc.) the retrieval is displayed successfully. If I use the ajax script the image is displayed as a bunch of u开发者_StackOverflownreadable characters. Does the image need to be sent a certain way from the server in the ajax case? I have tried many different methods including data URI ones but nothing seems to work. Any ideas? I will greatly appreciated it. Thakns.

Actually getting an image asyncronously is the literal way of doing it with javascript:

var img = new Image();
img.src = "http://your img uri";
document.getElementById("image_container").appendChild(img);

No need for XHR type AJAX to get it.

If you need a success callback, you can add it before the img.src definition:

img.onload = function() { /* ... */ }

The X in AJAX stands for XML. So the result is basicly text. You can change this, but depends on the framework used. Like jQuery

Maybe you are trying to do something that won't need AJAX. Or you AJAX only retrieves the URL of that image.

If you have the IMG DOM Object already instanced in a var like:

var img = document.getElementById('my_img');

and you already have the image path (ie: '/img/img.jpg')

try

img.src='/img/img.jpg';