hellraiser2000
Goto Top

Einbetten von RTSP Stream in HTML Webseite gelingt nicht

Hallo zusammen,

ich habe eine Dahua IPC-HFW3241E-SA IP Kamera, mit der ich im Grunde auch sehr gut auskomme. Mir gelingt es nur leider nicht, den Public RTSP Stream in eine ganz normale Webseite reinzubasteln....

Mein Vorgehen war wie folgt:
- Aktualisierung der Kamera auf die aktuellste FW Version V2.800.0000000.30.R, Build Date: 2021-08-20 # erfolgreich
- Vergeben einer statischen IP # erfolgreich
- DynDNS in der Fritz Box aktivieren # erfolgreich
- Portfreigabe für den RTSP Port 554 der Kamera in der Fritz Box einrichten # erfolgreich
- Test des public RTSP Stream via VLC Player # erfolgreich
- HTML Dokument basteln um den RTSP Stream in Webseite einzubetten # nicht erfolgreich

Anbei mein HTML Code (Beispiel aus Internt / von Dahua Wiki selbst):
<html> 
<body> 

<head> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />   
</head> 

<h3>IP-CAM</h3>

<object 
 classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"    
 codebase="https://downloads.videolan.org/pub/videolan/contrib/win32/axvlc.cab"  
 id="vlc"   
 name="vlc"   
 class="vlcPlayer"   
 events="True"  
  <param name="Src" value="rtsp://webacc:passwort@MYDYNDNS.spdns.org:554/cam/realmonitor?channel=1&subtype=1" /> <!-- ie -->   
  <param name="ShowDisplay" value="True" />   
  <param name="AutoLoop" value="True" />   
  <param name="AutoPlay" value="True" />   
  <!-- win chrome and firefox--> 
  <embed id="vlcEmb"  type="application/x-google-vlc-plugin" version="VideoLAN.VLCPlugin.2" autoplay="yes" loop="no" width="640" height="480" target="rtsp://webacc:passwort@MYDYNDNS.spdns.org:554/cam/realmonitor?channel=1&subtype=1" ></embed>   
</object> 

Ein weiteren Test habe ich hiermti gemacht:
<!DOCTYPE html>
<html>
<title>VLC Mozilla plugin test page</title>
<body>
    <embed type="application/x-vlc-plugin" pluginspage="http://www.videolan.org"  
       width="320"  
       height="240"  
             target="rtsp://webacc:passwort@MYDYNDNS.spdns.org:554/cam/realmonitor?channel=1&subtype=1"  
       id="vlc" />  
    <script type="text/javascript">  
    <!--
    var vlc = document.getElementById("vlc"); 
vlc.audio.toggleMute();
//-->
</script>
</body>
</html>

Beide Beispiele funktionieren nicht, obwohl ich den hier verwendeten RTSP Stream wunderbar via VLC von extern (public) öffnen kann. Das Problem muss also entweder am HTML Code sein, oder am Webserver selbst. Benötigt der Webserver noch eine spezielle Vorbedingung, wie installierte Codecs oder sowas? Hat sonst noch jmd eine Idee was man testen könnte?

Thx
Hellraiser

Content-ID: 1702608009

Url: https://administrator.de/forum/einbetten-von-rtsp-stream-in-html-webseite-gelingt-nicht-1702608009.html

Ausgedruckt am: 25.12.2024 um 14:12 Uhr

aqui
aqui 08.01.2022 aktualisiert um 19:57:05 Uhr
Goto Top
Fast alle Browser-Hersteller haben aus Security-Gründen das NPAPI (Netscape Plugin Application Programming Interface) entfernt. Damit entfällt auch die Unterstützung für das VLC-PlugIn.
Mit nem ollen Internet Explorer wird es ggf. noch klappen.
Bleibt also nur den JPEG Stream zu nehmen, wenn supportet, oder der Umweg über FFMPEG und HLS:
https://dev.to/tejasvi2/rtsp-stream-to-web-browser-using-ffmpeg-1cb
Hellraiser2000
Hellraiser2000 08.01.2022 um 20:40:47 Uhr
Goto Top
Hallo und schon mal danke für die Info!

OK, ich kann easy auf den MJPEG Port connecten, wenn ich folgenden Code benutze.

http://192.168.178.44/cgi-bin/snapshot.cgi?0

Was mir jetzt aber nicht logisch erscheint, welchen Portfreigabe für DynDNS muss ich dafür einrichten? Das hab ich jetzt noch nirgendwo gefunden.
IceAge
IceAge 08.01.2022 um 20:46:38 Uhr
Goto Top
N’Abend,

http = Port80

Grüße I.
aqui
aqui 08.01.2022 um 20:58:38 Uhr
Goto Top
Oder wie es jeder Netzwerker macht, mit dem Wireshark oder tcpdump einmal selber nachsehen ! face-wink
Hellraiser2000
Hellraiser2000 08.01.2022 um 21:22:31 Uhr
Goto Top
Jetzt sehe ich gerade den Wald vor lauter Bäumen nicht...

Meine RTSP Port Freigabe in der FritzBox (funktioniert ja, bestens mit VLC getestet)
rtsp

wird auch im Test bestätigt:
554

selbige Konfiguration gilt für meine Port 80 Freigabe:
m

diese wird auch in der FritzBox als funktional angezeigt:
fb

aber im WWW kommt der nicht an:
80

ganz komisch... weil ich ja so auch den Port80 vom Raspberry nach draußen geben kann, muss also vermutlich irgendeine Sondergeschichte an der Kamera sein....

Noch jmd ne Idee was man prüfen kann, sonst mache ich Schluss für heute^^
Hellraiser2000
Hellraiser2000 08.01.2022 um 21:46:56 Uhr
Goto Top
Geschafft!!!!

Ich habe in der Kamera den Port 80 auf Port 1025 umgesetzt, dann die Kamera rebootet.

Dann in der Fritte diese Freigabe eingerichtet:
fritte

Jetzt kann ich MJPEG cgi Link nutzen um von aussen auf den Kamera Stream zu schauen... Den Link muss ich jetzt nur noch in ein HTML Gerüst ballern und gut ist...

Danke euch & schönes Rest Wochenende!
aqui
aqui 09.01.2022 aktualisiert um 12:27:48 Uhr
Goto Top
Spannend wäre zum Schluß für die Community hier vielleicht noch welchen HTML Code Schnipsel du nun dafür verwendest ? face-wink
Hellraiser2000
Hellraiser2000 10.01.2022 um 20:46:40 Uhr
Goto Top
Hallo aqui,

ich habe noch nichts gemacht, da ich nur unterwegs war...
Hoffe ich komme die Tage mal abends zum Testen, dann schaue ich mal nach nem HTML Gerüst...

BR
Hellraiser2000
Hellraiser2000 11.01.2022 um 20:42:42 Uhr
Goto Top
Hallo aqui,

den MPEG CGI Link habe ich recht simpel mit folgendem HTML Code auf eine Testwebsite eingebunden:

<html>
<head>
<title>LiveVideo</title>
<META content="text/html"; charset="UTF-8"; http-equiv=Content-Type>  
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">  
<META HTTP-EQUIV="Expires" CONTENT="-1">  
</head>
<body>
LiveVideo by....

<tr>
   <div class="box">  
        <TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0>
      <tr><td bgcolor=black > <font color=white> CameraName <BR></font>
      </td> </tr> </TABLE>   
      <iframe src="http://myWANip:port#/video.cgi"  
         width="640" height="480" class="smart_sizing_iframe noresize" frameborder="0" scrolling="no" >  
      </iframe>
    </div>
</tr>

</body>
<HEAD>
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">  
<META HTTP-EQUIV="Expires" CONTENT="-1">  
</HEAD>
</html>

hier ist nur die eigene URL (also die DYN DNS Adresse) in der Zeile iframe src einzubinden, dann wird der Kamera Stream direkt auf eine Website angezeigt.

Nur eine Sache stört mich wirklich:
Der MJPEG Kamera Stream läuft immer über den Webserver HTTP Port der Kamera. D.h. wenn ich eine Portfreigabe für diesen Stream mache (TCP Port 80) ist über meine DynDNS Adresse somit auch das Kamera Login zum Webinterface der kamera erreichbar. Da habe ich natürlich ein starkes Passwort, aber man weiß ja nie...

Sollte jemand in meine Kamera gelangen, ist er schon am NAS usw...
Was denkt ihr darüber in Bezug auf IT Sicherheit? Ich würde am liebsten das Webinterface der Kamera irgendwie abschalten bzw. das es nur aus dem internen Netzwerk erreichbar ist. Aber dann geht auch der Stream auf die externe Webseite kaputt... Teufelskreis nennt man das wohl.
aqui
aqui 12.01.2022 um 11:02:44 Uhr
Goto Top
Danke fürs Feedback ! 👍
Der Stream hat ja so oder so immer die Quell IP Adresse der Kamera. Ist also damit ja auch immer eindeutig direkt identifizierbar.
Mehr Sorgen sollte dir bereiten das der Inhalt komplett ungeschützt ist was zu rechtlichen Problemen führen könnte je nachdem welche Inhalte du da überträgst. Ein VPN wäre da dicher besser...
JuliaThompson
JuliaThompson 21.01.2022 um 13:34:03 Uhr
Goto Top
Danke für die Tipps. Ich stand auch vor dem Problem, dass RTSP Stream in HTML nicht funktionierte.