eigene Webseite im Stil der Status Seite erstellen
-
- Beiträge: 4446
- Registriert: Mi Nov 11, 2020 7:16 pm
- Has thanked: 4 times
- Been thanked: 26 times
Re: eigene Webseite im Stil der Status Seite erstellen
10kWp PV mit SMA Tripower 10000TL-10 (PE11 mit SDM72V2); 2,4kWp mit Solis 2.5 G6 (EE11 mit SDM120). OpenWB Standard+. EVU EM540 an einem Raspi mit Venus OS. BEV Mercedes EQA 300 (06/2024)
Re: eigene Webseite im Stil der Status Seite erstellen
Was sagen die Experten zu meiner Seite?
Ich habe bei 0 angefangen vorletzte Woche (html, css, selbst js ist komplett anders als ich es aus Node Red kannte).
Werde da sicherlich noch die nächsten Monate weiter dran basteln.
becker8.de
www => IPv6
Gibt es Sicherheitsbedenken?
Ich habe bei 0 angefangen vorletzte Woche (html, css, selbst js ist komplett anders als ich es aus Node Red kannte).
Werde da sicherlich noch die nächsten Monate weiter dran basteln.
becker8.de
www => IPv6
Gibt es Sicherheitsbedenken?
openWB series2 Buchse (2021)
go-eCharger HOME+ 22 kW (2022)
go-eCharger HOME+ 22 kW (2022)
-
- Beiträge: 3778
- Registriert: Di Feb 25, 2020 9:23 am
- Has thanked: 3 times
- Been thanked: 23 times
Re: eigene Webseite im Stil der Status Seite erstellen
Sieht für Deine ersten Erfahrungen mit der kompletten Technik sehr gut aus! Top!
Bei Deiner Seite gibt es ein paar Schönheitsfehler.
Ich lasse "handgemachtes" HTML immer gerne von offizieller Stelle validieren: https://validator.w3.org/
Dann ist Dir sicher bewusst, dass jetzt jeder sich mit Deinem MQTT Broker verbinden kann und die Daten von Deinem Haus lesen kann? Ich würde dem Broker etwas mehr Sicherheit gönnen und eine Anmeldung mit Benutzer/Passwort einrichten. Analog zu der 1.9er Cloud könnte man dann die Anmeldedaten auf der Seite eingeben und der Client versucht sich damit am Broker anzumelden. Dann sollte das am Besten noch alles über HTTPs laufen, damit die Anmeldedaten auch nicht im Klartext von Deinem Browser zum Server geschickt werden.
Bei Deiner Seite gibt es ein paar Schönheitsfehler.
Ich lasse "handgemachtes" HTML immer gerne von offizieller Stelle validieren: https://validator.w3.org/
Dann ist Dir sicher bewusst, dass jetzt jeder sich mit Deinem MQTT Broker verbinden kann und die Daten von Deinem Haus lesen kann? Ich würde dem Broker etwas mehr Sicherheit gönnen und eine Anmeldung mit Benutzer/Passwort einrichten. Analog zu der 1.9er Cloud könnte man dann die Anmeldedaten auf der Seite eingeben und der Client versucht sich damit am Broker anzumelden. Dann sollte das am Besten noch alles über HTTPs laufen, damit die Anmeldedaten auch nicht im Klartext von Deinem Browser zum Server geschickt werden.
Re: eigene Webseite im Stil der Status Seite erstellen
Danke
der Validator sagt mir: da werde ich nicht ganz schlau raus, Visual Studio Code hat das formatiert. Wie sollte es denn sein?
Genau, jeder Webseitenbesucher kann/darf meine Daten lesen, nicht schreiben.
https ist aktiviert, die größten Schwierigkeiten hat mir wss bereitet.
der Validator sagt mir: da werde ich nicht ganz schlau raus, Visual Studio Code hat das formatiert. Wie sollte es denn sein?
Genau, jeder Webseitenbesucher kann/darf meine Daten lesen, nicht schreiben.
https ist aktiviert, die größten Schwierigkeiten hat mir wss bereitet.
openWB series2 Buchse (2021)
go-eCharger HOME+ 22 kW (2022)
go-eCharger HOME+ 22 kW (2022)
-
- Beiträge: 3778
- Registriert: Di Feb 25, 2020 9:23 am
- Has thanked: 3 times
- Been thanked: 23 times
Re: eigene Webseite im Stil der Status Seite erstellen
Die Meldungen besagen, dass die Tabelle mit drei Spalten angelegt wurde, einige Zeilen jedoch nur zwei Spalten haben. Entweder Du fügst noch eine leere Spalte ein, oder arbeitest mit "colspan".
Re: eigene Webseite im Stil der Status Seite erstellen
Weißt du zufällig wie ich dynamische Farben hin bekomme?
im Node-Red Dashboard habe ich es so:
Template Node:
Ausgabe Node:
{{msg.payload.P > 0 ? '<span class="plus">' + msg.payload.P + '</span>' : msg.payload.P}} W
sobald ein positiver Wert erscheint wird er rot, sonst Standard.
Ich würde das gern im html anwenden:
z.B. in meiner Tabelle:
"P" (also die im Sekundentakt wechselende Leistung) soll entsprechend rot werden, "Hausanschluss" und "W" nicht.
mit msg.payload kann man im html nicht arbeiten habe ich gemerkt.
im Node-Red Dashboard habe ich es so:
Template Node:
Code: Alles auswählen
<style>
.plus {
color: red !important;
}
</style>
{{msg.payload.P > 0 ? '<span class="plus">' + msg.payload.P + '</span>' : msg.payload.P}} W
sobald ein positiver Wert erscheint wird er rot, sonst Standard.
Ich würde das gern im html anwenden:
z.B. in meiner Tabelle:
Code: Alles auswählen
<tr>
<td>Hausanschluss</td>
<td id="P"></td>
<td>W</td>
</tr>
mit msg.payload kann man im html nicht arbeiten habe ich gemerkt.
openWB series2 Buchse (2021)
go-eCharger HOME+ 22 kW (2022)
go-eCharger HOME+ 22 kW (2022)
-
- Beiträge: 3778
- Registriert: Di Feb 25, 2020 9:23 am
- Has thanked: 3 times
- Been thanked: 23 times
Re: eigene Webseite im Stil der Status Seite erstellen
Du kannst auch mit CSS Klassen arbeiten.
Im Skript nicht nur den Wert in die Tabelle schreiben, sondern auch die Eigenschaft "class" ändern.
https://www.w3schools.com/howto/howto_js_add_class.asp
Im Skript nicht nur den Wert in die Tabelle schreiben, sondern auch die Eigenschaft "class" ändern.
https://www.w3schools.com/howto/howto_js_add_class.asp
Re: eigene Webseite im Stil der Status Seite erstellen
Spricht eigentlich was dagegen auf den öffentlichen test.mosqitto zu wechseln?
Oder darf man dort nicht 24/7 im Sekundentakt drauf schreiben?
wss funktioniert dort jedenfalls.
Oder darf man dort nicht 24/7 im Sekundentakt drauf schreiben?
wss funktioniert dort jedenfalls.
openWB series2 Buchse (2021)
go-eCharger HOME+ 22 kW (2022)
go-eCharger HOME+ 22 kW (2022)
Re: eigene Webseite im Stil der Status Seite erstellen
Bin auf FlashMQ gewechselt, der läuft super, sowohl "wss" IPv4 & IPv6.
(Victron ist auch auf FlashMQ umgestiegen)
(Victron ist auch auf FlashMQ umgestiegen)
openWB series2 Buchse (2021)
go-eCharger HOME+ 22 kW (2022)
go-eCharger HOME+ 22 kW (2022)