NEWS
[Solved] Benutze Socket.io Adapter in React App
-
Hi,
ich bin relativ neu dabei und habe eine zweite Anwendung (React) außerhalb von ioBroker die einige States benötigt und diese auch schreiben möchte. Bisher habe ich es mit einem Poll Intervall über den API Adapter gemacht. Jedoch habe ich nun den Websocket Adapter entdeckt und dachte ich könnte ihn nutzen.Habe das Beispiel im Repo (Github ioBroker.socket.io) gefunden und auch zum laufen bekommen (als eigenständige index.html außerhalb von React), jedoch scheint das von ioBroker bereitgestellte Socket.io Script nicht mit der React Komponente zu Socket.io benutzbar zu sein. Gibt es eine einfache Lösung um den Websocket zu benutzen und nicht alles selbst schreiben zu müssen was in der conn.js im Beispiel drin steht?
Vielen Dank.
-
Hi,
ich bin relativ neu dabei und habe eine zweite Anwendung (React) außerhalb von ioBroker die einige States benötigt und diese auch schreiben möchte. Bisher habe ich es mit einem Poll Intervall über den API Adapter gemacht. Jedoch habe ich nun den Websocket Adapter entdeckt und dachte ich könnte ihn nutzen.Habe das Beispiel im Repo (Github ioBroker.socket.io) gefunden und auch zum laufen bekommen (als eigenständige index.html außerhalb von React), jedoch scheint das von ioBroker bereitgestellte Socket.io Script nicht mit der React Komponente zu Socket.io benutzbar zu sein. Gibt es eine einfache Lösung um den Websocket zu benutzen und nicht alles selbst schreiben zu müssen was in der conn.js im Beispiel drin steht?
Vielen Dank.
@samuel-assmann-0 Ich hab von der ganzen Sache keine Ahnung, aber es gibt einen neuen Adapter: iobroker.ws
-
@samuel-assmann-0 Ich hab von der ganzen Sache keine Ahnung, aber es gibt einen neuen Adapter: iobroker.ws
@homoran vielen Dank für die Info ich werde es mir mal genauer angucken.
-
Hi,
ich bin relativ neu dabei und habe eine zweite Anwendung (React) außerhalb von ioBroker die einige States benötigt und diese auch schreiben möchte. Bisher habe ich es mit einem Poll Intervall über den API Adapter gemacht. Jedoch habe ich nun den Websocket Adapter entdeckt und dachte ich könnte ihn nutzen.Habe das Beispiel im Repo (Github ioBroker.socket.io) gefunden und auch zum laufen bekommen (als eigenständige index.html außerhalb von React), jedoch scheint das von ioBroker bereitgestellte Socket.io Script nicht mit der React Komponente zu Socket.io benutzbar zu sein. Gibt es eine einfache Lösung um den Websocket zu benutzen und nicht alles selbst schreiben zu müssen was in der conn.js im Beispiel drin steht?
Vielen Dank.
@samuel-assmann-0 Ich bin mir zwar nicht sicher, was du mit
der React Komponente zu Socket.io
meinst, aber es gibt ne einfache Lösung, die auch funktioniert: Nutze https://github.com/ioBroker/socket-client/
Meines Wissens sowohl mit dem im web-Adapter eingebauten Socket, als auch mit socket.io und dem ws-Adapter.
Und hier kannst du dir sicher auch ein bisschen was abschauen: https://github.com/AlCalzone/iobroker-react/blob/654698e2ff6fc8f0de1f466640417d28fb235e4f/src/lib/app/IoBrokerApp.tsx#L68-L90
oder direkt auf die
IoBrokerApp-Komponente setzen:
https://alcalzone.github.io/iobroker-react/#/ -
@samuel-assmann-0 Ich bin mir zwar nicht sicher, was du mit
der React Komponente zu Socket.io
meinst, aber es gibt ne einfache Lösung, die auch funktioniert: Nutze https://github.com/ioBroker/socket-client/
Meines Wissens sowohl mit dem im web-Adapter eingebauten Socket, als auch mit socket.io und dem ws-Adapter.
Und hier kannst du dir sicher auch ein bisschen was abschauen: https://github.com/AlCalzone/iobroker-react/blob/654698e2ff6fc8f0de1f466640417d28fb235e4f/src/lib/app/IoBrokerApp.tsx#L68-L90
oder direkt auf die
IoBrokerApp-Komponente setzen:
https://alcalzone.github.io/iobroker-react/#/@alcalzone leider hat mir der Socket Client in meinem React Frontend nichts gebracht da ich das dafür benötigte Script in einer React App nicht einbinden kann. Leider ist auch der ioBroker Adapter zu Socket.io zu schlecht documentiert als das es möglich wäre mit der offiziellen Docu eine Verbindung aufzubauen.
-
@alcalzone leider hat mir der Socket Client in meinem React Frontend nichts gebracht da ich das dafür benötigte Script in einer React App nicht einbinden kann. Leider ist auch der ioBroker Adapter zu Socket.io zu schlecht documentiert als das es möglich wäre mit der offiziellen Docu eine Verbindung aufzubauen.
@samuel-assmann-0 sagte in Benutze Socket.io Adapter in React App:
das dafür benötigte Script in einer React App nicht einbinden kann
Meines Wissens soll die nicht eingebunden werden, sondern direkt vom Server geladen. Welcher Pfad das beim socket.io ist, kann ich dir aus dem Kopf aber nicht sagen. Ich selbst nutze den
iobroker.webals Gegenstelle, der das entsprechende Skript ausliefert.Ich frag mal nach, wie das beim socket.io gedacht ist.
-
@alcalzone leider hat mir der Socket Client in meinem React Frontend nichts gebracht da ich das dafür benötigte Script in einer React App nicht einbinden kann. Leider ist auch der ioBroker Adapter zu Socket.io zu schlecht documentiert als das es möglich wäre mit der offiziellen Docu eine Verbindung aufzubauen.
@samuel-assmann-0 Gerade nochmal gecheckt... Der socket.io-Adapter liefert unter dem Pfad
socket.io/socket.io.jseine kompatible Library aus. Das oben genanntesocket-clientist ein Wrapper darum.Du musst also in deiner Anwendung zusätzlich das folgende Skript laden (Platzhalter ersetzen):
http(s)://<hostname>:<socket-io-port>/socket.io/socket.io.jsDann sollte das in deiner Anwendung enthaltene
socket-clienteine Verbindung herstellen.Siehe z.b. hier
https://github.com/AlCalzone/ioBroker.zwave2/blob/c77bfb1b9be77f1fab2ccdbdfa3e13ed1d1284e2/admin/index_m.html#L5-L8
das ist zwar für web, funktioniert aber genauso.