IP Camera stream/bild in OH 3 Sitemap einbinden

[Jerry82]

Guten Tag liebes Forum,

ich habe bereits einige Tutorials und Forenbeiträge durch und komme nicht zum gesuchten Erfolg. Daher meine Frage:

Wie binde ich meine Hikam A7 (aktuelle Firmware) per Camerabinding in OH3 ein?

Ziel ist einen Videostream oder notfalls ein Standbild über die Sitemap auf ein Tablet zu bringen wenn die Motiondetection ausgelöst wird.
Ein optional dauerhaft eingeblendeter Stream auf der Sitemap wäre auch eine Möglichkeit.

Die Kamera wird vom Binding gefunden und bietet u.A. folgende Channels:

- Mjepeg URL (String)
- Image URL (String)
- HLS URL (String)
- Motion Alarm (Switch)

Name und Password sowie den korrekten ONIF Port (8090) habe ich ebenfalls, die Kamera wird in den Things als Online angezeigt.

Bisher habe ich auf einer Sitemap ein Widget hinzugefügt (getestet habe ich "Image" mit dem Thing Channel "Image URL", und Webview Sowie Video Widgets mit dem Thing Channel "MJPEGURL".

Bestenfalls bekomme ich damit die Fehlermeldung "Bad Message 400 (reason: Bad Request) auf der Sitemap, sowie den Namen (Cam) des Widgets und das Camera Symbol.

Die Camera müsste einen RSTP Stream liefern, aber ich weiß nicht wie ich diesen herausfinde. Unter Anderem habe ich hier auf der Supportseite des Cameraherstellers die folgenden Adressen gefunden und im Thing eingetragen (natürlich mit der korrekten IP der Kamera):

- rtsp://IP-Adresse der Kamera:554/onvif1
- rtsp://IP-Adresse der Kamera:554/stream=0
- rtsp://IP-Adresse der Kamera:554/stream=1

Leider ebenfalls ohne Erfolg.

Wie binde ich den stream einer IP Kamera auf einer Sitemap ein?
Wie finde ich die korrekte "Adresse" des Kamerastreams heraus und wo muss ich diese im Thing eintragen?

Falls eine Lösung dadurch leichter wird: die Kamera(s) sind auch an einer Synology Diskstation angebunden, kann die sonst den Stream zur Verfügung stellen?


Vielen Dank & Gruß

Bastian (Jerry)

[sihui]

Die Kamera wird vom Binding gefunden

Du sprichst vom IPCamera Binding?

- Mjepeg URL (String)

Dann so:

Code: Alles auswählen

Video url="http://<IPDeinerKamera>:<Port>/ipcamera.mjpeg" encoding="mjpeg"

Der Port ist der serverPort aus deiner Thing Konfiguration. FFMPEG muss natürlich installiert sein, aber das steht alles in der Doku des Bindings.
RTSP oder sonstige höher auflösende Streams sind mir bisher in openHAB nicht gelungen, mir reicht aber inzwischen MJPEG völlig. Gerade im HInblick auf HABPanel und Nutzung eines Tablet ist die vorhandenen Prozessorleistung nicht ganz zu vernachlässigen.
HABPanel Dashboards schaltest du bei Erkennung von Bewegung auf die Kamera um mit "Switch Dashboard with Item Value" aus den HABPanel Einstellungen, das Video wird eingebunden mit

Code: Alles auswählen

<img ng-src="http://<IPDeinerKamera>:<Port>/ipcamera.mjpeg" style="height: 100%; width: 100%;"</img>

Alle Details findest du wie üblich in der Doku:

https://www.openhab.org/docs/configurat ... h-habpanel
https://www.openhab.org/addons/bindings/ipcamera/

[mcdandrew]

Ich habe meine Kamera als Standbild in der Sitemap wir folgt eingebunden.
Die dafür notwendige URL habe ich auf der Homepage des Herstellers gefunden.

Code: Alles auswählen

Image url="http://[b]IP-Adresse[/b]/cgi-bin/api.cgi?cmd=Snap&channel=0&rs=wuuPhkmUCeI9WG7C&user=[b]USERNAME[/b]&password=[b]PASSWORD[/b]"

[Jerry82]

Du sprichst vom IPCamera Binding?

Ja.


Der Port ist der serverPort aus deiner Thing Konfiguration. FFMPEG muss natürlich installiert sein, aber das steht alles in der Doku des Bindings.
RTSP oder sonstige höher auflösende Streams sind mir bisher in openHAB nicht gelungen, mir reicht aber inzwischen MJPEG völlig. Gerade im HInblick auf HABPanel und Nutzung eines Tablet ist die vorhandenen Prozessorleistung nicht ganz zu vernachlässigen.
HABPanel Dashboards schaltest du bei Erkennung von Bewegung auf die Kamera um mit "Switch Dashboard with Item Value" aus den HABPanel Einstellungen, das Video wird eingebunden mit

Meine Kamera stellt lt Herstellerseite einen MJPEG Stream zur Verfügung.


https://www.openhab.org/docs/configurat ... h-habpanel
https://www.openhab.org/addons/bindings/ipcamera/
[/quote]


Danke ich merke aktuell wie unzureichend meine Englischkenntnisse sind, gebe aber mein bestes.

Danke für Deine Hilfe

[sihui]

Meine Kamera stellt lt Herstellerseite einen MJPEG Stream zur Verfügung.

Na, dann einfach diese URL im Browser aufrufen und wenn es funktioniert dann genauso in openHAB in einer Sitemap.
Ich schätze aber mal du wirst dann einen Usernamen und ein Passwort eingeben müssen, dann wird es etwas schwieriger ...
Das alles würde dir das IPCamera Binding natürlich abnehmen wenn du den dortigen MJPEG Stream nutzt.

[Kuli]

Hallo,

da ich mich gerade erneut mit dem IP-Camera-Binding beschäftige, bin ich auch über diesen Thread gestolpert und habe gleich mal Anmerkungen und Verständnisfragen dazu.

Die Frage war nach "IP Camera stream/bild in OH 3 Sitemap einbinden".

Verstehen wir alles das Gleiche unter einer "Sitemap"?
Wenn ja, wo soll diese dargestellt werden?

Für mich ist eine Sitemap Die Struktur einer Seite, die ich meisten in meiner "openHAB IOS-App" nutze.
Dort habe ich bisher nicht geschafft eine Livebild ein zu bauen.
Wahrscheinlich geht das auch gar nicht, weil die Darstellung in der App kein mjpeg unterstützt.
Wenn hier jemand Lösungsansätze hat, bitte gerne.

Eine Sitemap kann natürlich auch im Browser (welcher?) dargestellt werden.
Wie soll das Livebild dort angezeigt werden? Mit dem Mausklick auf das Kamerasymbol im selben oder separaten TAB?

Das geht mit einer "Cell" in der Sitemap, die man dann mit der Action = external URL belegt und dann die Adresse des MJPEG-Streams dort hinterlegt.
Um diese Optionen zu sehen bei der Konfiguation der "Cell" "show advanced" anklicken.


Grüße Kuli

[sihui]

Verstehen wir alles das Gleiche unter einer "Sitemap"?

Doku zu Sitemaps: https://www.openhab.org/docs/configurat ... emaps.html

Für mich ist eine Sitemap Die Struktur einer Seite, die ich meisten in meiner "openHAB IOS-App" nutze.

Das wäre eine Möglichkeit. Eine andere wäre z.B. die Anzeige in der BasicUI.

Wahrscheinlich geht das auch gar nicht, weil die Darstellung in der App kein mjpeg unterstützt.

Zum Apfel kann ich nichts sagen, in Android funktioniert die Anzeige eines Livebildes über eine Sitemap ohne Probleme.

Das geht mit einer "Cell" in der Sitemap, die man dann mit der Action = external URL belegt und dann die Adresse des MJPEG-Streams dort hinterlegt.
Um diese Optionen zu sehen bei der Konfiguation der "Cell" "show advanced" anklicken.

Ich habe gerade nicht die geringste Ahnung wovon du redest, lies bitte einfach noch mal die oben verlinkte Doku.

[Kuli]

Ich habe gerade nicht die geringste Ahnung wovon du redest, lies bitte einfach noch mal die oben verlinkte Doku.

Das war mein Lösungsansatz zur Einbindung in eine "Page" Typ "layout" in die Master-UI und nicht als "sitemap" in die Basic-UI (es ging ja schliesslich um OH3).

[sihui]

und nicht als "sitemap" in die Basic-UI (es ging ja schliesslich um OH3).

BasicUI und Sitemaps gibt es auch in openHAB3. Das kann man sogar 1:1 aus einer älteren Version übernehmen.

[Kuli]

BasicUI und Sitemaps gibt es auch in openHAB3. Das kann man sogar 1:1 aus einer älteren Version übernehmen.

Hallo ja das stimmt und nur dann funktionieren die Video Items auch in der Sitemap.
Wenn du in OH3 die Sitemap neu erstellst unter “Page“, funktioniert es im BASIC-UI offensichtlich nicht.
Mit neuer Welt (OH3) erstellt, mit alter Welt Basic-UI (OH2) angeschaut.
So funktioniert es zumindest in der Version OH3.0.0 bei mir noch nicht.

Was aber funktioniert ist die Videointegration in ein Layout mit einem selbst erstellten Widget.

Wenn dieser Workarround für dich in Frage kommt abei noch den Code für das Widget aus dem englischen Forum:

uid: ClickableCamera
props:
parameters:
- description: "example: http://192.168.1.2:54321/autofps.mjpeg"
label: Thumbnail URL
name: thumbnailURL
required: true
type: TEXT
- description: "example: http://192.168.1.2:54321/snapshots.mjpeg"
label: Stream URL
name: streamURL
required: true
type: TEXT
timestamp: Dec 14, 2020, 9:59:29 PM
component: oh-image-card
config:
class:
- oh-cell
- no-margin
style:
- border-radius: 6px
- width: 100%
- height: auto
url: =props.thumbnailURL
action: photos
actionPhotos: =[props.streamURL]
actionPhotoBrowserConfig:
theme: dark
type: popup

Per Copy und Paste kannst du damit in der Entwicklungsumgebung unter Widgets ein eigenes Kamerawidget erstellen.
Das kannst du dann unter Pages in ein Layout integrieren und bekommst das Kamerbild live in der Zelle (Cell) des Laypouts angezeigt, als auch in groß beim Klick auf die Zelle (Cell).

Wahrscheinlich gibt es auch noch andere Möglichkeiten, die bei mir bisher auch noch nicht funktioniert haben.

Grüße Kuli