Is there a way to load an Image in Javascript with data retrieved via an HTTP POST?

Question

Is there any means to use AJAX to request an image file via an HTTP POST and then create a new Image with that data in HTML? Since you can't do this with the IMG tag, is it possible to do it with an Image javascript object?

Answer 1

Yes that is possible.

When your serverscript opens the image files and encodes them as a base64 string, almost all browsers (except IE7 and below) can handle that. For instance:

jQuery('<img>', {
    src: 'data:image/jpeg;base64,' + someBase64EncodedString
}).appendTo(document.body);

A real-world example of this, can be found here: https://github.com/jAndreas/Supply