asked on

Webcam Photo not refreshing

We are trying to put a webcam on our website. My page www.downtownrapidcity.com/camera.html is set to refresh every 5 seconds which it does. But the photo doesn't change from the webcam. I have to manually click on Refresh on my browser window to get the image to change.

If you go to http://208.117.100.102/cgi-bin/viewer/video.jpg where it is pulling the photo, it updates with each refresh of the page.

How do I get the image to change with each auto refresh?

SOLUTION

Roza

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER CERTIFIED SOLUTION

sjklein42

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

sjklein42

You video server (camera) appears to be down.

Instead of an image it is returning this:

http://208.117.100.102/cgi-bin/viewer/video.jpg

HTTP/1.1 500 Internal Server Error

sjklein42

The javascript approach has the added advantage that only the image is updated, so you can embed it in a static web page and not have to refresh the whole page.

Did we take down your camera server?

katlees

ASKER

I don't know. Another company does the camera server I have put in a trouble ticket to them. Thanks... as soon as it is back up I can try these fixes.

sjklein42

Improved version. I have it pointing at my webcam for now. You can change the URL (in two places) and try it with your camera when your server comes back online.

<SCRIPT LANGUAGE="JavaScript">

var url='http://sjklein.dyndns.org:11001/cam_1.jpg?';
var frq=1500;           // interval in msec

function PrefetchImage()
{
    var imgno = Math.round(Math.random()*215815);
    image1 = new Image();
    image1.src = url + imgno;
}

var imgno;
var image1;

PrefetchImage();

function RefreshMyCamera()
{
    if (image1.complete)
    {
        document.images['mycamera'].src = image1.src
        PrefetchImage();
    }

    setTimeout('RefreshMyCamera()',frq);
}
</script>

<img border='0' src='http://sjklein.dyndns.org:11001/cam_1.jpg' name='mycamera' width=95%>

<SCRIPT LANGUAGE="JavaScript">
setTimeout('RefreshMyCamera()', 10);
</SCRIPT>

Open in new window

sjklein42

I'm afraid my code is taking down the camera server.

katlees

ASKER

Both responses worked but I liked the one where I could embed it right into the website! Thanks guys