Geschrieben am 22.02.2016 von Marco, aktualisiert 06.07.2020
Artikel Bild
Bild
WLAN-Kamera Video auf einer Webseite anzeigen

Es kommt öfter die Frage auf, wie das Video/Stream einer WLAN-Kamera auf einer Homepage bzw. Webseite angezeigt werden kann. In diesem Artikel möchte ich auf dieses Problem eingehen und mögliche Lösungen aufzeigen. Ich werde das ganze so einfach wie möglich erklären, jedoch bedarf es Grundwissen über HTML, FTP und JS.

Dieser Artikel ist nicht vollständig und befindet sich in stetiger Erweiterung. Wenn ich Neues entdecke füge ich diese Informationen hier hinzu.

 
Info: Bitte beachten Sie jedoch, dass Sie sich hierfür einigermaßen mit HTML auskennen sollten. D.h. Sie sollten wissen wie HTML/Javascript Dateien angelegt werden und wie diese auf einen Server kopiert werden.

Generelle Vorraussetzung

Die WLAN-Kamera muss einen Stream zur Verfügung stellen und der Zugriff darf z.B. nicht auf den Lokalhost beschränkt sein. Auch eine Firewall/NAT darf nicht blockieren. Ein oft verwendetes Streaming-Protokoll bei WLAN-Kameras ist z.B RTSP (https://de.wikipedia.org/wiki/Real-Time_Streaming_Protocol).

Zugriff per Gästebenutzer

 

Wenn die Kamera über einen Gästezugang verfügt kann der Zugang auf die Kamera folgendermaßen gewährt werden: http://benutzer:passwort@ip

Beispiel: http://guest:gagapasswort@192.168.1.246

Möglichkeiten

Es gibt diverse Möglichkeiten das Videobild einer WLAN-Kamera in einem Webseite einzubauen. Dies sind z.B. Videoplayer, Embed Scripte oder kommerzielle Programme.

Info: Einige Browser, Plugins oder Benutzereinstellungen können das Laden des Videos blockieren.

RTSP Stream

Der RTSP Stream wird über einen Player wie VLC, Quicktime oder VLC in der Webseite geladen. Eine RTSP Adresse sieht beispielsweise so aus:

rtsp://admin:DEINPASSWORT@192.168.0.104:554/12

Beispiel Embed Code (Bitte nicht einfach irgendwohin kopieren) für einen RTSP-Stream mit VLC:

<OBJECT classid="clsid:9BE31822-FDAD-5321-AD51-BE1D1C159921"

     codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"

     width="640" height="480" id="vlc" events="True">

   <param name="Src" value="rtsp://ipaddress" />

   <param name="ShowDisplay" value="True" />

   <param name="AutoLoop" value="False" />

   <param name="AutoPlay" value="True" />

   <embed id="vlcEmb"  type="application/x-google-vlc-plugin" version="VideoLAN.VLCPlugin.2" autoplay="yes" loop="no" width="640" height="480"

     target="rtsp://cameraipaddress" ></embed>

</OBJECT>

Dokumentation VLC, Englisch: https://wiki.videolan.org/Documentation:WebPlugin

Anleitung für INSTAR Kameras

Die Firma Instar hat auf Ihrer Supportseite direkt eine Anleitung: http://www.instar.de/faq_web_integration_hd

H264

Die Integration erfolgt hier über ein ActiveX -Plugin, welches der Besucher herunterladen muss.

MJPEG

Hier ist kein extra Plugin nötig, denn dieses Format funktioniert in allen modernen Browsern.

 

 

Weitere Infos

https://github.com/Streamedian/html5_rtsp_player/wiki/HTML5-RTSP-Player

Webseite Stream Homepage
Kategorie:

Über mich

Bild
Hallo

Hallo, ich bin Marco und ich teste seit Jahren Überwachungskameras und schreibe die Artikel auf dieser Seite. Links zu Onlineshops sind sogenannte Affiliatelinks und wenn ihr darüber etwas kauft, so erhält diese Seite eine kleine Werbevergütung. Für euch ändert das am Endpreis nichts.

Infos über die Redaktion und wie ihr das Projekt unterstützen könnt.

Neuste Testberichte

Produkt Test Ranger 2C
6
IMOU Ranger 2C Überwachungskamera im Test

Die Ranger 2C im Test. Preiswert, viele Funktionen, App, Cloud und z.B. auch als Babyphone geeignet.

Produkt Test EZVIZ C8C wide
6
EZVIZ C8C Überwachungskamera mit Motor und Licht - Testbericht

Eine Überwachungskamera mit Licht, Motorsteuerung, App, SD-Slot und optionaler Cloud im Test.

Produkt Test IMOU Bullet 2E wide
6
Die IMOU Bullet 2E im Test - Preiswerte Überwachungskamera mit Licht

Heute gibts mal wieder eine Überwachungskamera in der Preisklasse bis 60€. Ich muss allerdings sagen, dass ich über die Features, bei dem Preis, überrascht war.

Gespeichert von Ralfi (nicht überprüft) am Di., 16.03.2021 - 16:06 Permalink

Die Anzahl der Webseiten-Besucher, die gleichzeitig diesen eingebetteten Stream sehen können auf der Webseite ist aber dann sehr begrenzt mit dem oben beschriebenen Verfahren, und hängt von der Kamera ab.
Bei INSTAR Kameras z.B. können nur 3 Websiten Besucher gleichzeitig diesen Stream sehen.
Jeder Webseitenbesucher ist wie ein weiterer User, der sich auf die Kamera einloggt -> und das (gleichzeitig eingeloggte User) ist in den Kameras stark begrenzt (aus Sicherheitsgründen)

Die Redaktion

Bild
Wer schreibt hier?

Hallo lieber Besucher. Mein Name ist Marco und ich betreibe diese Seite. Ich führe die Testberichte durch und schreibe die Artikel. Hier findest du weitere Infos über mich und wie ihr das Projekt unterstützen könnt. Ich bedanke mich.

Empfehlungen

Produkt Test INSTAR 8015 wide
6
Die INSTAR 8015 FullHD im Test - Sehr gute Überwachungskamera mit SD-Karte, Cloud, LAN, WLAN

Heute teste ich ein weiteres Flaggschiff von INSTAR mit sehr vielen Funktionen und Motorsteuerung. Die IN-8015 FullHD. Es gibt auch eine PoE-Version dieser Kamera. 

weiterlesen

Bestseller