Die Technik
Herzstück ist ein VIA-ITX-Rechner.
Centaur VIA Samuel 2 533 MHz CPU 1066.68 BogoMIPS
512 MB RAM
40 GB 2,5" Notebook Festplatte
Logitech QuickCam 4000 Pro USB webcam
Betriebssystem: SUSE 10.0
Die Bilder werden über CamSource bereitgestellt. Dieses Programm speichert zusätzliche alle 60 Sekunden ein Bild.
Aus diesen Bildern werden mit Hilfe von Mencoder Mpeg4 Filme erstellt.
Der Computer ist natürlich überdimensioniert, um nur WebCam Bilder bereitzustellen.
Daher hat er auch andere Aufgaben für mich zu erledigen, auf die ich hier nicht weiter eingehen will.
Die Webseite selber liegt bei einem Provider. Nicht, weil der Rechner das nicht könnte. Mit der Bandbreite des Providers kann mein DSL Anschluss einfach nicht mithalten.
Da CamSource die Bilder auf Port 9192 bereitstellt und ich die Daten lieber auf dem Standard HTTP-Port 80 abholen wollte, habe ich ein kleines PHP Programm geschrieben:
<?php
/* Datei: /cam/index.php */
/*Quelle des Bildes*/
$name="http://[ip-adresse]:9192/";
/*Bild öffnen*/
$fd = @fopen($name, 'rb');
/* Fehler beim öffnen ? - Temp. Fehler Melden */
if($fd == false){
header("",true,404);
die();
}
/* header Infos des Bildes übertragen*/
/* z.B.
Server: camsource 0.7.0
Content-Length: 61191
Connection: Keep-alive
Pragma: no-cache
Cache-Control: no-cache
Content-Type: image/jpeg
*/
$info=stream_get_meta_data($fd);
foreach ($info['wrapper_data'] as $header) {
header($header,true);
}
ob_end_flush();
ob_end_clean();
/*Bild senden*/
while(!feof($fd) and (connection_status()==0)) {
print fread($fd, 1024 * 10);
flush();
ob_flush();
flush();
ob_flush();
flush();
ob_flush();
}
fclose ($fd);
ob_clean();
exit();
?>
Die Aktualisierung des Webcambildes übernimmt ein kleines Javascript:
<script type="text/javascript">
var t = 30 // interval in seconds
imgsrc = "";
function ErrorImg() {
document.images.WebCamImage.src = "error.jpg";
setTimeout("LoadImg()", t*1000);
}
function LoadImg() {
if (imgsrc == "")
{
imgsrc = document.images.WebCamImage.src;
}
else
{
document.images.WebCamImage.onload = "";
tmp = new Date();
tmp = "?"+tmp.getTime();
document.images.WebCamImage.src = imgsrc+tmp;
}
setTimeout("LoadImg()", t*1000);
}
</script>
Der IMG-Tag muss dann so aussehen:
<IMG src="http://[url]/cam/" width="640" height="480" border="1" name="WebCamImage" onload="LoadImg()" onerror="ErrorImg()" alt="Loading..."/>
Und so sieht der Rechner aus:
|
|
 |