# HTML5 Video funktioniert nicht via HTTPS

**URL:** https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770
**Category:** IN-8003 Full HD
**Created:** [29. Juni 2020 um 12:46 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770 "2020-06-29T12:46:25Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![Thetaphi](https://forum.instar.com/user_avatar/forum.instar.com/thetaphi/32/256_2.png) [@Thetaphi](https://forum.instar.com/u/Thetaphi)
#### Post date: [29. Juni 2020 um 12:46 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/1 "2020-06-29T12:46:25Z")

</div>

Hallo,  
ich habe heute früh das Update auf WebUI 2.6 gemacht. Allerdings ist mir folgendes aufgefallen:

- Wenn ich die Kamera direkt über den HTTP-Port (80) zugreife und auf HTML5-Video umgestellt habe, wird alles in FullHD angezeigt und das als Stream. Im Chrome Netwerkviewer sieht man keine sekündlichen MJPEG Downloads sondern ein einen HTML5-Stream.
- Wenn ich mich direkt mit der Kamera via HTTPS (Port 443) verbinde, erzeugt das Webinterface nur einen Kanvas und läd jede Sekunde ein niedrig aufgelöstes MJPEG Bildchen. Der Schalter H.264 hat keinen Einfluss, egal ob an oder aus werden jede Sekunde ein niedrig aufgelöstes MJPEG geholt.
- Normalerweise greife ich auf die Kamera über einen Apache2-Webserver mit HTTP/2, der die Verschlüsselung mit eigenen Zertifikat durchführt und als Reverse Proxy die Kamera hinter der Firewall per HTTP (Port 80) zugreift - also der klassische Aufbau (zum Internet HTTPS mit Reverse Proxy zur lokalen Kamera unverschlüsselt). Auch in dieser Variante wird der Stream nicht in FullHD via HTML5 dargestelt. Weiterhin nur ein Canvas Element und alle Sekunde ein niedrig aufgelöstes Bild.

Ich habe das Javascrkipt analysiert, anscheinend schaltet das WebUI bei Erkennung von HTTPS das H264 ab, was aber vor allem dann keinen Sinn macht, wenn die Kamera hinter einem Reverse Proxy steht! Außerdem ist die Anzeige sehr komisch, denn der H264-Schalter unten tut nicht das was er soll.

Sollte hier von INSTAR keiner eine Lösung haben, auch über HTTPS (via Reverse Proxy) den Stream als HTML5-Video zu bekommen, werde ich ein Support-Ticket aufmachen.

Ich sehe ein, dass die Kamera evtl mit HTTPS überfordert ist auch das Video in FullHD zu senden, aber das tut sie hier ja nicht. Die Verschlüsselung macht der Webserver im Router (Intel Core i7) - und der kann sogar HTTP/2, was die WebUI aus dem Internet richtig schnell macht (multiplexing).

---

<div class="post-metadata">

### Author: ![Joheiha](https://forum.instar.com/user_avatar/forum.instar.com/joheiha/32/1428_2.png) [@Joheiha](https://forum.instar.com/u/Joheiha)
#### Post date: [29. Juni 2020 um 13:23 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/2 "2020-06-29T13:23:42Z")

</div>

Wie an anderer Stelle bereits geschrieben, habe ich das Problem auch. Ich kann den Livestream nur über den Http Port in einer sehr guten Qualität darstellen. Sobald ich auf den HTTPS Port gehe ist die Bildqualität sehr schlecht. Vollbildmodus funktioniert bei mir leider auch nicht mehr.  
Allerdings wurde mir das Update auch nur über den HTTP Port angezeigt. Über den von mir bevorzugt benutzten HTTPS Port wurde mir kein Update vorgeschlagen. Vielleicht wurde das sogar bewusst so gesteuert, da das Problem bekannt ist. Keine Ahnung, hoffe aber mal, dass das noch gelöst wird.

---

<div class="post-metadata">

### Author: ![m.polinowski](https://forum.instar.com/user_avatar/forum.instar.com/m.polinowski/32/458_2.png) [@m.polinowski](https://forum.instar.com/u/m.polinowski)
#### Post date: [29. Juni 2020 um 13:34 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/3 "2020-06-29T13:34:50Z")

</div>

> [@Thetaphi](#):
>
> Ich habe das Javascrkipt analysiert, anscheinend schaltet das WebUI bei Erkennung von HTTPS das H264 ab

Der HTML5 Videostream wird über einen Websocket bereitgestellt, der nur unter HTTP zur Verfügung steht. D.h. wenn die WebUI erkennt das man über HTTPS zugreift, fällt sie zurück auf den MJPEG Stream. Aufgrund der recht hohen Bandbreitenanforderungen wird dieser standardmäßig in der mittleren Auflösung geladen.

Man kann ihn jedoch über das Dev Menü auf die hohe Auflösung stellen (Achtung diese Einstellungen werden nicht auf der Kamera, sondern per Cookie gespeichert. Es muß also bei jedem Browser geändert werden).

Um zum Dev Menü zu gelangen, muß man das System/Logbuch Menü öffnen und dort die drei Tasten `d`, `e` und `v` gleichzeitig gedrückt halten. Beim Loslassen lädt dann das Menü.

---

<div class="post-metadata">

### Author: ![Joheiha](https://forum.instar.com/user_avatar/forum.instar.com/joheiha/32/1428_2.png) [@Joheiha](https://forum.instar.com/u/Joheiha)
#### Post date: [29. Juni 2020 um 13:42 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/4 "2020-06-29T13:42:45Z")

</div>

> [@m.polinowski](#):
>
> Um zum Dev Menü zu gelangen, muß man das System/Logbuch Menü öffnen und dort die drei Tasten `d` , `e` und `v` gleichzeitig gedrückt halten. Beim Loslassen lädt dann das Menü.

Funktioniert, Danke. Gibt es jetzt noch irgendwie eine Möglichkeit den Stream wieder im Vollbild Modus zu öffnen?

---

<div class="post-metadata">

### Author: ![m.polinowski](https://forum.instar.com/user_avatar/forum.instar.com/m.polinowski/32/458_2.png) [@m.polinowski](https://forum.instar.com/u/m.polinowski)
#### Post date: [29. Juni 2020 um 13:44 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/5 "2020-06-29T13:44:17Z")

</div>

> [@Joheiha](#):
>
> Vollbild Modus

Zur Zeit nicht - aber ich kann es mal weiterleiten.

---

<div class="post-metadata">

### Author: ![Joheiha](https://forum.instar.com/user_avatar/forum.instar.com/joheiha/32/1428_2.png) [@Joheiha](https://forum.instar.com/u/Joheiha)
#### Post date: [29. Juni 2020 um 13:54 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/6 "2020-06-29T13:54:17Z")

</div>

> [@m.polinowski](#):
>
> Zur Zeit nicht - aber ich kann es mal weiterleiten.

Danke. Wäre super, ich gehöre zu der Fraktion, die das Livebild ganz gern mal im Vollbildmodus auf dem Browser laufen lassen. 😃

---

<div class="post-metadata">

### Author: ![Thetaphi](https://forum.instar.com/user_avatar/forum.instar.com/thetaphi/32/256_2.png) [@Thetaphi](https://forum.instar.com/u/Thetaphi)
#### Post date: [29. Juni 2020 um 14:49 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/7 "2020-06-29T14:49:19Z")

</div>

> [@m.polinowski](#):
>
> Um zum Dev Menü zu gelangen, muß man das System/Logbuch Menü öffnen und dort die drei Tasten `d`, `e` und `v` gleichzeitig gedrückt halten. Beim Loslassen lädt dann das Menü.

Dankesehr, das hilt schon sehr, da man dann zumindest Ansatzweise ein scharfes Bild bekommt.

Ich werde mal sehen, ob ich über den Reverse Proxy vor dem unverschlüsselten Kamera-HTTP-Port nicht das Websocket zum Laufen bekomme. Das Javascript werde ich durch den Apache (evtl auch NGINX) umschreiben lassen. Ich werde hier die Ergebnisse Posten, falls jemand anderes auch den Websocket im Reverse-Proxy aktivieren will.

---

<div class="post-metadata">

### Author: ![HSC](https://forum.instar.com/letter_avatar_proxy/v4/letter/h/dc4da7/32.png) [@HSC](https://forum.instar.com/u/HSC)
#### Post date: [30. Juni 2020 um 13:49 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/8 "2020-06-30T13:49:22Z")

</div>

… unabhängig von http oder https, direktem Zugriff oder via Portforwarding von außen ruckelt der Stream im HTML5-Modus im Sekundentakt. Im Flashmodus ist es in jeder Zugriffsart fliessend.  
Wird das noch gefixt? Wäre fein…

---

<div class="post-metadata">

### Author: ![m.polinowski](https://forum.instar.com/user_avatar/forum.instar.com/m.polinowski/32/458_2.png) [@m.polinowski](https://forum.instar.com/u/m.polinowski)
#### Post date: [30. Juni 2020 um 14:09 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/9 "2020-06-30T14:09:32Z")

</div>

Wie gesagt, der HTML5 Stream steht nur über HTTP zur Verfügung. Sobald man per HTTPS zugreift schaltet die WebUI auf MJPEG. Da der sehr viel Platz in der Leitung braucht kann es durchaus ruckeln.

Wenn der HTML5 Stream ruckelt wird es vermutlich eher an der CPU Auslastung des Rechners liegen. Gerade auf alten PCs oder schwachen Mobilgeräten kann der Prozessor gut ausgelastet werden.

---

<div class="post-metadata">

### Author: ![hbr](https://forum.instar.com/letter_avatar_proxy/v4/letter/h/8edcca/32.png) [@hbr](https://forum.instar.com/u/hbr)
#### Post date: [30. Juni 2020 um 14:15 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/10 "2020-06-30T14:15:49Z")

</div>

> [@m.polinowski](#):
>
> Wenn der HTML5 Stream ruckelt wird es vermutlich eher an der CPU Auslastung des Rechners liegen. Gerade auf alten PCs oder schwachen Mobilgeräten kann der Prozessor gut ausgelastet werden.

Dem ist so!  
Daher nutze ich den Webbrowser nur zur Konfiguration der Kamera und solange Flash  
noch läuft eben auch mal das Livebild per Webbrowser  
Und wofür gibt es die InstarVision Apps für Smartphone und Windows PC.

---

<div class="post-metadata">

### Author: ![Joheiha](https://forum.instar.com/user_avatar/forum.instar.com/joheiha/32/1428_2.png) [@Joheiha](https://forum.instar.com/u/Joheiha)
#### Post date: [30. Juni 2020 um 14:51 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/11 "2020-06-30T14:51:44Z")

</div>

> [@hbr](#):
>
> Daher nutze ich den Webbrowser nur zur Konfiguration der Kamera und solange Flash  
> noch läuft eben auch mal das Livebild per Webbrowser  
> Und wofür gibt es die InstarVision Apps für Smartphone und Windows PC.

Es ist ja gut zu wissen, wofür Du den Browser benutzt, aber andere möchten das vielleicht anders handhaben , nutzen den Browser nicht nur zur Konfiguration und möchten das Livebild halt am PC und nicht über das Smartphone sehen. Da hilft die Instar Vision App für Windows nur bedingt, wenn man ein anderes Betriebssystem hat.

---

<div class="post-metadata">

### Author: ![hbr](https://forum.instar.com/letter_avatar_proxy/v4/letter/h/8edcca/32.png) [@hbr](https://forum.instar.com/u/hbr)
#### Post date: [30. Juni 2020 um 14:57 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/12 "2020-06-30T14:57:40Z")

</div>

> [@Joheiha](#):
>
> Da hilft die Instar Vision App für Windows nur bedingt, wenn man ein anderes Betriebssystem hat.

Schon klar und verstehe ich ja auch.

---

<div class="post-metadata">

### Author: ![HSC](https://forum.instar.com/letter_avatar_proxy/v4/letter/h/dc4da7/32.png) [@HSC](https://forum.instar.com/u/HSC)
#### Post date: [1. Juli 2020 um 05:44 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/13 "2020-07-01T05:44:19Z")

</div>

Danke für die Antwort - CPU-Auslastung ist unabhängig vom Modus bzw. Browser minimal (macMini 2014, macbook air 2020) - ehrlich gesagt, sehe ich auch keinerlei Unterschiede in der Darstellung zwischen HTML5-Stream und MJPEG (habe via DEV-Menü auf HD umgestellt). Es läuft beides abgehackt.  
Das nur für die evtl. Analyse, mich störts nicht allzusehr.

---

<div class="post-metadata">

### Author: ![m.polinowski](https://forum.instar.com/user_avatar/forum.instar.com/m.polinowski/32/458_2.png) [@m.polinowski](https://forum.instar.com/u/m.polinowski)
#### Post date: [1. Juli 2020 um 06:52 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/14 "2020-07-01T06:52:52Z")

</div>

> [@HSC](#):
>
> Darstellung zwischen HTML5-Stream und MJPEG (habe via DEV-Menü auf HD umgestellt).

Die Darstellung sollte gleich gut sein - sobald man den MJPEG Stream auf Full HD gestellt hat.

Allerdings sollte der HTML5 Stream einiges mehr an CPU benötigen. Der MJPEG Stream hingegen sehr viel mehr Bandbreite.

Der HTML5 Stream ruckelt auf meinem Android Tablet auch sehr stark - CPU limitiert. Auf einem halbwegs aktuellen Core i7 Desktop hingegen läuft er sogar besser als der Flash Stream.

Wenn der Stream überall ruckelt und die CPU Auslastung im grünen Bereich ist, würde ich eher sagen, dass der HMTL5 Stream gar nicht aktiviert wird. Man kann es eventuell mal mit einem anderen Browser probieren. Der Browser wird von der WebUI vielleicht falsch erkannt und der Stream fällt automatisch immer auf MJPEG zurück.

Die Leistung der Browser unterscheidet sich auch. Mit Safari (und macOS) habe ich keine Erfahrung. Aber speziell unter Linux habe ich gemerkt das z.B. Firefox um einiges besser läuft als Chrome.

---

<div class="post-metadata">

### Author: ![HSC](https://forum.instar.com/letter_avatar_proxy/v4/letter/h/dc4da7/32.png) [@HSC](https://forum.instar.com/u/HSC)
#### Post date: [1. Juli 2020 um 08:04 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/15 "2020-07-01T08:04:12Z")

</div>

…„Der Browser wird von der WebUI vielleicht falsch erkannt und der Stream fällt automatisch immer auf MJPEG zurück.“ …

genau so ist es: in Firefox und Chrome liest man im Inspector (obwohl Webgui auf HTML5-Video gestellt ist) folgendes:

`"<img id="activeVideo" mode="mjpeg" class="img-responsive" src="http://192.168.178.113:80/mjpegstream.cgi?-chn=11&amp;usr=....."`

---

<div class="post-metadata">

### Author: ![m.polinowski](https://forum.instar.com/user_avatar/forum.instar.com/m.polinowski/32/458_2.png) [@m.polinowski](https://forum.instar.com/u/m.polinowski)
#### Post date: [1. Juli 2020 um 08:14 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/16 "2020-07-01T08:14:35Z")

</div>

Da müsste man mal schauen was die WebUI denkt was der Browser ist in dem sie läuft:

Einfach mal das in der Console eingeben und den Screenshot hier posten:

```auto
instar.system

```

Das sollte so aussehen:

 ![Untitled](https://forum.instar.com/uploads/default/original/2X/1/12cc1742f3de305564d725836ebc9f921de491b4.png)

---

<div class="post-metadata">

### Author: ![HSC](https://forum.instar.com/letter_avatar_proxy/v4/letter/h/dc4da7/32.png) [@HSC](https://forum.instar.com/u/HSC)
#### Post date: [1. Juli 2020 um 08:35 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/17 "2020-07-01T08:35:04Z")

</div>

FIREFOX:

activeX: false  
browser: „Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:77.0) Gecko/20100101 Firefox/77.0“  
chrome: false  
edgc: false  
edge: false  
ff32bit: false  
firefox: true  
ie: false  
ipad: false  
iphone: false  
ipod: false  
linux: false  
mac: true  
mobile: false  
opera: false  
os: „MacIntel“  
safari: false

scripts: Object { }  
win: false  
win7: false

: Object { … }  
​

CHROME:  
browser: „Mozilla/5.0 (Macintosh; Intel Mac OS X 10\_14\_6) Ap…L, like Gecko) Chrome/83.0.4103.116 Safari/537.36“, os: „MacIntel“, win: false, win7: false, mac: true, …}activeX: falsebrowser: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10\_14\_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36"chrome: trueedgc: falseedge: falseff32bit: falsefirefox: falseie: falseipad: falseiphone: falseipod: falselinux: falsemac: truemobile: falseopera: falseos: "MacIntel"safari: falsesafari9: falsesafariDl: falsescripts: {}win: falsewin7: false\_\_proto\_\_: Object

---

<div class="post-metadata">

### Author: ![m.polinowski](https://forum.instar.com/user_avatar/forum.instar.com/m.polinowski/32/458_2.png) [@m.polinowski](https://forum.instar.com/u/m.polinowski)
#### Post date: [1. Juli 2020 um 08:38 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/18 "2020-07-01T08:38:25Z")

</div>

Und das kommt beim Zugriff über HTTP nicht HTTPS ?

Und der Kollege erwähnt gerade noch - eventuell einmal den Browser Cache leeren. Da könnten noch Infos gespeichert sein von der v2.5 WebUI.

---

<div class="post-metadata">

### Author: ![HSC](https://forum.instar.com/letter_avatar_proxy/v4/letter/h/dc4da7/32.png) [@HSC](https://forum.instar.com/u/HSC)
#### Post date: [1. Juli 2020 um 08:41 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/19 "2020-07-01T08:41:57Z")

</div>

über HTTP. Bei HTTPS-Zugriff (alles im lokalen Netzwerk) kommt folgendes:

activeX: false  
browser: „Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:77.0) Gecko/20100101 Firefox/77.0“  
chrome: false  
edgc: false  
edge: false  
ff32bit: false  
firefox: true  
ie: false  
ipad: false  
iphone: false  
ipod: false  
linux: false  
mac: true  
mobile: false  
opera: false  
os: „MacIntel“  
safari: false  
scripts: Object { }  
win: false  
win7: false

​ Cache wurde gelöscht, gleiches Ergebnis im Inspector.

---

<div class="post-metadata">

### Author: ![m.polinowski](https://forum.instar.com/user_avatar/forum.instar.com/m.polinowski/32/458_2.png) [@m.polinowski](https://forum.instar.com/u/m.polinowski)
#### Post date: [1. Juli 2020 um 08:44 UTC](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770/20 "2020-07-01T08:44:30Z")

</div>

> [@m.polinowski](#):
>
> Und der Kollege erwähnt gerade noch - eventuell einmal den Browser Cache leeren. Da könnten noch Infos gespeichert sein von der v2.5 WebUI.

👆🏻 hat das einen Effekt? Cache leeren und ggf. den HTML5 Stream noch mal neu auswählen - also in den Videoeinstellungen auf z.B. Flash stellen, speichern und noch mal zurück auf HTML5.

[Nächste Seite](https://forum.instar.com/t/html5-video-funktioniert-nicht-via-https/26770.md?page=2)
