Make the browser pool for an image until available

Question

I have a small http server which generates some images on-the-fly, and the generation process may take some time. After generation, the image is cached indefinetly.

Currently, if a user requests an image which is not cached, the server returns a 202 Accepted with a Refresh header. If the image is cached, a 301 Permanently Moved is sent and the user redirected to a unique url (different images may share the same unique url).

The whole system breaks if the image is referenced in an <img> tag (on Firefox, at least). Can this be solved without Javascript? If not, how would the script look like?

Answer 1

Im not sure if you can do it without Javascript but you could probably do this with ajax? I mean, point at the server and then just check to see if it is there... then if it is display it, else try again 30 seconds later, it could be something like:

function getImage(img) {
 $.ajax({
            cache: true,
            url: <<ADDRESS>>,
            data: "",
            timeout: 60,
            error: function (jqXHR, error, errorThrown) {
                setTimeout(function() {
                    getImage(img);
                }, 30000);
            },
            success: function (data) {
                //set the image
            }
        });
}

Okay your then hoping that the image will come down at somepoint.

The only other option would be to generate the image before it is requested? For example if it is just creating a thumbnail for a photo gallery, why wait until it is requested to generate it? Just generate it as soon as you have it?

Hope that helps / makes sense.