[FTUI3] Homebridge/CameraUI in TabletUI zeigen

[StephanFHEM]

Bin jetzt auch mal etwas in die Homekit Welt eingetaucht und komme bei einer Sache nicht weiter. Über eine Homebridge (QNAP) hab ich das Plugin CameraUI laufen welches mit die Streams in Home zaubert. In der CameraUI gibt es auch http-Seiten wo die Streams dargestellt werden. Leider bekomme ich diese nicht in TabletUI angezeigt. Hat das schon jemand bei sich am laufen und kann mir den Code für die Einbindung verraten? Möchte es im Endeffekt gerne genau so haben wie in der Home App auf dem Iphone

[mr_petz]

Hi, wie hast du es denn versucht?
Mir fällt erstmal nur iframe und/oder content ein.
Für mehr Hilfe bräuchte es mehr Infos...

ps.: Ist das das Plugin???: https://github.com/seydx/homebridge-camera-ui
Edit: oder das: https://github.com/seydx/camera.ui

LG

[StephanFHEM]

es ist das hier: https://github.com/SeydX/homebridge-camera-ui#readme

Ich hab es mit iframe probiert genau so wie ich aktuell die erzeugten mpg-streams von MotionEye auch eingebunden habe.
CameraUI hat ein eigenes Interface auf dem man sich Passwort-Geschützt einloggen kann. Dort gibt es eine Sicht mit allen Kameras. Die Adresse lautet "http://ipvonqnap:8081/camview". Dazu gibt es dort Einzelsichten die zum Beispiel unter "http://ipvonqnap:8081/cameras/Kamera1" abrufbar sind.

vielleicht Wichtig: Die Kameraseiten zeigen nicht nur das Bild/Stream sondern auch Navigationspfeile und Menü und CameraUI/Homebridge und FHEM laufen nicht auf dem selben Server, sind aber im selben Netz

[mr_petz]

Muss nochmal Nachfragen.
Und was gefällt oder geht nicht im iframe?
Ich habe es mit paar Sites, Urls und Streams probiert (auch fhem:8083) und hatte keine Probleme.
Es gibt nur Probleme wenn die Gegenseite die Einbindung in einem iframe unterbindet/ablehnt. Diese Ablehnung machen einige Webseiten.
Wenn es bei dir ebenso ist, kannst du bestimmt in den settings des ui noch was pimpen???

Bsp. iframe:

Code Auswählen Erweitern


  <iframe src="https://streamable.com/e/3yce42" frameborder="0" width="100%" height="100%" allowfullscreen style="width: 100%; height: 100%; position: absolute;"></iframe>


LG

[StephanFHEM]

der iFrame zeigt bei mir einfach nichts an. Ich hab es auch mit User und Passwort in verschiedenen Variationen probiert und denke auch, dass es mit der CameraUI-Seite zu tun hat. Daher meine Hoffnung, dass hier jemand das schon mal eingebunden hat

[andreas_r]

Je nach Art des Streams ginge es vielleicht auch so einzubinden:

Code Auswählen Erweitern


<ftui-image src="http://IP der Cam/control/faststream.jpg?stream=full" nocache="true"></ftui-image>


VG

[mr_petz]

Vielleicht könnte es auch über die API gehen:
https://github.com/seydx/camera.ui#api
https://github.com/seydx/camera.ui/tree/master/src/api

Da müsste nur jemand ran der es am laufen hat und js kann...

LG

Edit: Ich hatte auch mal zu Testzwecken eine PTZ Steuerung gebaut inkl. Zoom und Presets. Befehle werden da über CGI gesendet. Bei Interesse sag Bescheid.

[StephanFHEM]

hab noch etwas rumgebastelt und es ist wohl tatsächlich so, dass ich User und Passwort übergeben müsste. Das funktioniert aber auf dem normalen Weg nicht. Es steht jetzt auch klar da, dass der Server die Verbindung abgelehnt hat. Wenn ich den Link im Browser direkt eingebe dann öffnet sich auch erst ein Fenster wo ich User und PWD eingeben muss...

Der Link den ich versucht habe ist der folgende:

http://cameraui-IP:8081/cameras/Kamera1/feed?name=VarUser&pwd=VarPass

Wenn ich im Browser die auftauchende Abfrage mit User und PWD ausfülle dann lässt es sich dort aufrufen. Die Abfrage kommt über iframe natürlich nicht. Dort wird halt direkt abgelehnt

edit: in der API steht wie man sich authentifiziert... leider kann ich da nichts mit anfangen:-) (siehe Bild)

[mr_petz]

So wie ich das lese muss man per post im requestheader den usernamen und das password übermitteln.
Vielleicht so?:

Code Auswählen Erweitern


// JAVASCRIPT
var req = new XMLHttpRequest();
req.open("POST", "http://cameraui-IP:8081/api/auth/login/", true);
req.setRequestHeader('Content-Type', 'application/json');
req.withCredentials = true;
req.send(JSON.stringify({username: user, password: pass}));

k.A.

LG