You could look at refreshing the image using Javascript
This first method wont combat the issue with loading a broken image, however it will update quickly (i've got it set at 500ms - 0.5s), I use a security cam at home and although it does occasionally show a broken image it is only for a very small time:
function refreshImage()
{
var src = "http://192.168.1.121/snapshot.jpg?" + new Date().getTime();
var myImage = new Image();
myImage.src = src;
myImage.onload = function(){
document.getElementsByTagName('img')[0].src = src;
};
}
setInterval( refreshImage, 500 );
Alternatively, you could load the image in with XHR - but you'll probably have to set up a local domain for it to work instead of IP address based. - This will fix the broken image issue - I've added in the Content-Length check but you could probably remove this and it still work fine
function refreshImage()
{
var src = "http://192.168.1.121/snapshot.jpg?" + new Date().getTime();
var xhr = new XMLHttpRequest();
xhr.open('HEAD', src, true);
xhr.onreadystatechange = function(){
if ( xhr.readyState == 4 && xhr.status == 200 ) {
if( xhr.getResponseHeader('Content-Length') > 0 )
{
document.getElementsByTagName('img')[0].src = src;
}
}
};
xhr.send(null);
}
setTimeout( refreshImage, 5000 );