Websocket

Hallo,

Hat jemand eine Ahnung wie das mit dem neuen Websocket Rückkanal funktioniert?

Gibt es ein kleines Beispiel dafür?

Was genau möchtest du machen?

paresy

JavaScript für „volle“ API:


//Normal IP-Symcon 5.1/5.2
var connection = new WebSocket('ws://127.0.0.1:3777/api/', [btoa("email:fernzugriffpw").replace(/=/g, '')]);

//Normal IP-Symcon 5.3+
var connection = new WebSocket('ws://127.0.0.1:3777/api/', [encodeURIComponent(btoa("email:fernzugriffpw"))]);
 
//SSL IP-Symcon 5.1/5.2
var connection = new WebSocket('wss://127.0.0.1:3777/api/', [btoa("email:fernzugriffpw").replace(/=/g, '')]);

//SSL IP-Symcon 5.3+
var connection = new WebSocket('wss://127.0.0.1:3777/api/', [encodeURIComponent(btoa("email:fernzugriffpw"))]);

JavaScript für „WebFront“ API:


//Normal | IP-Symcon 5.1
var connection = new WebSocket('ws://127.0.0.1:3777/api/wfc/12345', [btoa("webfront:webfrontpw").replace(/=/g, '')]);

//Normal | IP-Symcon 5.2
var connection = new WebSocket('ws://127.0.0.1:3777/wfc/12345/api/', [btoa("webfront:webfrontpw").replace(/=/g, ''));

//Normal | IP-Symcon 5.3+
var connection = new WebSocket('ws://127.0.0.1:3777/wfc/12345/api/', [encodeURIComponent(btoa("webfront:webfrontpw")));
 
//SSL | IP-Symcon 5.1
var connection = new WebSocket('wss://127.0.0.1:3777/api/wfc/12345', [btoa("webfront:webfrontpw").replace(/=/g, '')]);

//SSL | IP-Symcon 5.2
var connection = new WebSocket('wss://127.0.0.1:3777/wfc/12345/api/', [btoa("webfront:webfrontpw").replace(/=/g, '')]);

//SSL | IP-Symcon 5.3+
var connection = new WebSocket('wss://127.0.0.1:3777/wfc/12345/api/', [encodeURIComponent(btoa("webfront:webfrontpw"))]);

Beim WebFront ist der Username (also vor dem Doppelpunkt) wirklich fest „webfront“ und muss nicht geändert werden.

paresy

Hallo zusammen,

ich bin nach einigen Irrungen über verschiedene Systeme nach Jahren nun doch (endlich!) bei IP Symcon gelandet.
Zuerst einmal ein dickes Lob an die Macher! Fühle mich (nicht nur wegen PHP) nach relativ kurzer Zeit heimisch, die Struktur und Umsetzung ist ganz nach meinem Geschmack :slight_smile:

Da Websockets ja von Haus aus integriert sind, habe ich mir mal den Datenverkehr genauer angeschaut (ich möchte eine eigene Visualisierung auf Basis von Vue.js umsetzen) und bin etwas verwirrt. Habe schon hier im Forum gesucht, bin aber noch nicht fündig geworden (oder habe falsch gesucht).

Deshalb habe ich ein paar Fragen:

  1. Wenn ich das Webfront öffne, sehe ich mit den entsprechenden DevTools zwar die Socketverbindung - aber nur eingehende Nachrichten, keine ausgehenden. Werden hier meine Aktionen nicht per Websocket an IP Symcon übertragen?

  2. Die Datenstruktur ist für mich noch etwas verwirrend. Für einen „normalen“ Homematic Lichtschalter bekomme ich in data z. B.


0: false
1: false
2: false
3: 1557697007
4: 1557697007
5: 1557697007

zurück. Wofür stehen die ganzen Werte? Das Aussehen unterscheidet sich natürlich auch bei anderen SenderIDs. Wie muss eine Message aufgebaut sein, wenn ich sie an IP Symcon verschicke?

Vielen Dank schon mal!

  1. Nein, diese laufen weiterhin über die normale JSON-RPC API gegen /api/
  2. Der Nachrichtenaufbau für VM_UPDATE ist wie folgt

Wert
Gab es eine Änderung
Vorheriger Wert
Zeitstempel der Änderung
Zeitstempel der letzten Aktualisierung (seit 5.1)
Zeitstempel der letzten Änderung (seit 5.1)

paresy

Super, danke!

Ich versuche gerade eine Websocket-Verbindung aufzubauen und stoße dabei auf folgende Probleme:

[ol]
[li]Wenn ich auf die volle API von Linux Firefox zugreife, dann funktioniert alles wunderbar.[/li]Wenn ich auf die volle API von Linux Chromium oder IOS Safari zugreife, klappt es nicht.
[li]Wenn ich auf eine Webfront-API zugreifen will, dann wird auch in Firefox das Password nicht akzeptiert.[/li][/ol]
Was muss ich da anders machen?

Viele Grüße
Jürgen

Funktioniert denn das WebFront korrekt? Ab der 5.2 haben sich die Endpoints geändert. Habe es oben mal angepasst.

paresy

Webfront funktioniert einwandfrei. Ist auch das aktuelle IOS.

Schau ggf. mal mit den Entwickler Tools unter „Netzwerk“ was du anders machst.

paresy

bei Chromium kommt

Uncaught DOMException: Failed to construct 'WebSocket': The subprotocol 'xxdfsdfcxsxdds...' is invalid.

Jürgen

Auf die schnelle kann ich dir leider keinen heißen Tipp geben :frowning: Sofern das WebFront ja läuft muss es irgendeine Kleinigkeit an deinem Code sein. wenn du ein minimales Beispiel bei jsfiddle baust, kann ich evtl. zwischendurch mal reingucken. Nutz dazu als Endpoint z.B. unsere WebFront.info Seite.

paresy

das Script ist ganz simple

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="initial-scale=1.0, width=device-width" />

    </head>
    <body>
        <div id=8></div>
        <script  type="text/javascript" charset="UTF-8" >

            const ws = new WebSocket('wss://xy.example.com:443/wfc/12345/api/', [encodeURIComponent(btoa("webfront:passwd"))]);
            document.getElementById(8).innerHTML = ws.url;

            ws.onmessage = function(msg) {
                var data = JSON.parse(msg.data);
                if(data.SenderID == 34567 && data.Data[1]===true){
                    document.getElementById(8).innerHTML = data.Data[0];
                }
            }

        </script>
    </body>
</html>

das Resultat lautet

Error during WebSocket handshake: Invalid status line

Bei der Webfront.info gibt es kein Password. Was wird da bei btoa(„webfront:.passwd“) eingetragen?

Jürgen

ein erster Erfolg, wenn auch ein zweifelhafter…
…Safari und Chrome vertragen im Protocol-String keine Sonderzeichen. Wenn man aber die beiden „=“-Zeichen am Ende des Strings entfernt, funktioniert es :eek:

Webfront kriege ich weiterhin nicht zum Laufen.

Jürgen

Bist du auch auf der 5.2 unterwegs wenn das neue URL Format nutzt?

paresy

nein auf IP-Symcon 5.1, Raspberry Pi, 23.07.2019, f85391467278.
Was ist denn das neue URL-Format?

Habe inzwischen rausgefunden, dass Ihr das mit den Wegschneiden der =-Zeichen genauso macht. Dann passt das ja. Für mich bleibt aber die Frage: Wie bekomme ich den eingeschränkten WebFront-Datenfluss?

Jürgen

Hallo paresy,
nachdem ich den Thread nochmal von vorne gelesen habe, habe ich auch Deinen Hinweis mit Version 5.2 verstanden. :wink:

Die neuen URLs funktionieren bei Firefox perfekt. Für die Kompatibilität mit z.B. Chrome oder Safari müssen mit folgender Änderung die Sonderzeichen entfernt werden

JavaScript für „volle“ API:


siehe Post weiter vorne.

Restproblem:
Unabhängig davon ob ich die „volle“ API oder die „WebFront“ API wähle kommen über den WebSocket immer ALLE Änderungen und nicht nur die vom gewählten WebFront.

mein Wunsch:
Kannst Du das so ändern, dass bei der „WebFront“ API nur die Änderungen der im WebFront verwendeten Variablen gesendet werden?

Das brächte richtig Freude :loveips:

Ansonsten megacoole Sache :cool:

Viele Grüße
Jürgen

Magst du das noch einmal prüfen? Ich habe es soeben noch einmal getestet und bei mir werden nur die im WebFront erlaubten Variablen gesendet. Beachte: Wenn dein WebFront Zugruff auf Root hat, dann wird natürlich alles übermittelt. (Ebenfalls wenn die mobilen Apps diesen Zugriff haben!)

paresy

Super! Das war der entscheidende Hinweis. Die mobile App war noch „an“. Jetzt kommen nur noch die relevanten Daten.
Danke
Jürgen

@Silberstreifen: Ich habe noch einen Fehler gefunden, der sehr selten auftreten kann. Die korrigierte Variante ist wieder in Post 3: Websocket Das passende IP-Symcon Update folgt heute noch.

paresy