2010-10-11 20 views
1

我试图创建一个页面,用于显示和刷新网络摄像头的图像(camimg.jpg),但如果图像最近未更新,则会显示静态图像(notlive.jpg)。我已经找到了AJAXCam脚本,该脚本用于在设定的间隔重新加载“活”形象的目的(15秒),但与没有使用Javascript的经验,我无法弄清楚如何确定当图像上次更新以决定是否显示camimg.jpg或notlive.jpg。确定在Javascript中的图像的创建日期?

我与编程有限的经验我想它应该是沿着线的东西:

pageLoaded = time page loaded in browser 
imageUpdated = time the image was uploaded to server 

if imageUpdated is not within 20 seconds of pageLoaded: 
    display notlive.jpg 
else: 
    run AJAXCam 

的AJAXCam代码(最初由<body onLoad="holdUp()">的称呼)如下:

<script type="text/javascript"> 
<!-- 
// 
//AJAXCam v0.8b (c) 2005 Douglas Turecek http://www.ajaxcam.com 
// 
function holdUp() 
{ 
// 
// This function is first called either by an onLoad event in the <body> tag 
// or some other event, like onClick. 
// 
// Set the value of refreshFreq to how often (in seconds) 
// you want the picture to refresh 
// 
refreshFreq=15; 
// 
//after the refresh time elapses, go and update the picture 
// 
setTimeout("freshPic()", refreshFreq*1000); 
} 

function freshPic() 
{ 
// 
// Get the source value for the picture 
// e.g. http://www.mysite.com/doug.jpg and 
// 
var currentPath=document.campic.src; 
// 
// Declare a new array to put the trimmed part of the source 
// value in 
// 
var trimmedPath=new Array(); 
// 
// Take everything before a question mark in the source value 
// and put it in the array we created e.g. doug.jpg?0.32234 becomes 
// doug.jpg (with the 0.32234 going into the second array spot 
// 
trimmedPath=currentPath.split("?"); 
// 
// Take the source value and tack a qustion mark followed by a random number 
// This makes the browser treat it as a new image and not use the cached copy 
// 
document.campic.src = trimmedPath[0] + "?" + Math.random(); 
// 
// Go back and wait again. 
holdUp(); 
} 

// --> 
</script> 

是什么我试图完成甚至可能?如果是这样,我将如何去实施它?先谢谢您的帮助!

+0

对于那些谁可能会发现这个问题,并面临着类似的问题,我发现cavemonkey50的[网络摄像头更新脚本](http://cavemonkey50.com/code/webcam_update_script/)。将他的PHP和AJAXCam的脚本结合起来,实现了我原本打算的结果。 – bobby 2010-10-11 20:05:59

回答

1

有没有办法做到这一点在JavaScript。

你唯一的选择是,如果你有访问服务器端语言如PHP,您可以发送一个简单的HEAD请求,并检查最后的图像Modified头然后报告回通过Ajax的浏览器。

+0

感谢您的输入! – bobby 2010-10-11 19:59:41

相关问题