Alle Kamerabilder in einer Übersicht anzeigen
In einem anderen Artikel (Link) habe ich beschrieben wie man die RTSP Streams komfortabel in VLC öffnet. Hier möchte ich eine weiter Möglichkeit beschreiben wie man noch schneller und komfortabler auf die Kamerabilder in einem Browser zugreifen kann.
Meine D-Link Kameras haben sowohl die Möglichkeit auf das aktuelle Bild als Standbild zuzugreifen, aber auch das Videobild als MJPG wiederzugeben.
Das Kamerabild kann man bei meiner DCS 936L/935L unter folgenden Link abrufen:
http://IP-Adresse-der-Kamera/image/jpeg.cgi
Das Kameravideo kann man unter folgendem Link erreichen:
http://IP-Adresse-der-Kamera/video/mjpg.cgi
In den Einstellungen der Kamera unter Verwaltung -> Admin kann man bei AUTHENTIFIZIERUNG festlegen, ob man ein Passwort eingeben muss für
1. RTSP -> Stream
2. HTTP -> Stream
3. Momentaufnahmen -> Einzelbild
Falls man es so einstellt, das man nur mit Passwort drauf zugreifen darf, dann muss vor die IP-Adresse im Link noch Benutzername:Passwort@ also z.B. so http://admin:Password@192.168.2.1/video/mjpg.cgi.
Mit diesen beiden Infos habe ich mir eine kleine HTML Seite aufgebaut, die mir die Bilder direkt auf einer Seite anzeigt. So benötigt es nur einen Webserver im LAN, z.B. auf einem Raspberrypi und Zugriff auf die neu erstellte HTML Seiten.
HTML Seite mit Einzelbildern
Die HTML Seite für die Einzelbilder aktualisiert das Bild alle 10 Sekunden und zeigt alle Bilder direkt untereinander an. Dies könnt ihr als Vorlage nehmen, einfach den Text kopieren, in einen Editor einfügen und die Datei als .html abspeichern.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>Webcams</title>
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Expires" content="-1">
<META HTTP-EQUIV="refresh" CONTENT="10">
</head>
<body bgcolor="#000000">
<main>
<ul id="galerie">
<!-- -->
<br>
<img src="http://10.0.1.38/image/jpeg.cgi" alt="Carport">
<br>
<img src="http://10.0.1.39/image/jpeg.cgi" alt="Garten">
<br>
</ul>
</main>
</body>
</html>
HTML Seite mit Videostream
Die HTML Seite mit den Video Streams zeigt alle Kamerabilder untereinander an und alle zeigen ein Livebild.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>Webcams</title>
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Expires" content="-1">
<META HTTP-EQUIV="refresh" CONTENT="10">
</head>
<body bgcolor="#000000">
<main>
<ul id="galerie">
<!-- -->
<br>
<img src="http://10.0.1.38/video/mjpg.cgi" alt="Carport">
<br>
<img src="http://10.0.1.93/video/mjpg.cgi" alt="Garten">
<br>
</ul>
</main>
</body>
</html>
Ihr könnt dann z.B. den Link auf diese HTML Datei in eurem LAN auf dem Handy aufrufen und den Link abspeichern oder eine Verknüpfung direkt auf dem Homebildschirm ablegen. Dann habt ihr immer direkt Zugriff auf die Kamerabilder.
Auch von Unterwegs funktioniert dies, hierfür muss aber z.B. ein VPN eingerichtet und aktiviert sein, wenn ihr auf euer eigene Netzwerk zugreifen möchtet.