HowTo: Node Red / Magic Mirror – Toon gegevens van Node Red op de spiegel

Lange tijd was ik op zoek naar een manier om de gegevens die ik uit mijn SmartHome verzamel met NodeRed handig weer te geven op de MagicMirror.
Dankzij de vele plugins voor MagicMirror en NodeRed werd dit sneller geïmplementeerd dan verwacht. Hoe het werkt, wordt beschreven in het volgende artikel.

---

Veiligheidsinstructies

Ik weet dat de volgende opmerkingen altijd een beetje vervelend zijn en onnodig lijken. Helaas hebben veel mensen die "beter" wisten door onvoorzichtigheid ogen, vingers of andere dingen verloren of zichzelf verwond. Gegevensverlies is in vergelijking bijna te verwaarlozen, maar zelfs dit kan erg vervelend zijn. Neem daarom vijf minuten de tijd om de veiligheidsinstructies te lezen. Omdat zelfs het coolste project geen blessure of andere problemen waard is.
https://www.nerdiy.de/sicherheitshinweise/

Affiliate links / reclame links

De hier vermelde links naar online winkels zijn zogenaamde affiliate-links. Als u op zo'n affiliate-link klikt en via deze link een aankoop doet, ontvangt Nerdiy.de een commissie van de betreffende onlineshop of aanbieder. De prijs verandert voor jou niet. Als u via deze links uw aankopen doet, steunt u Nerdiy.de om in de toekomst andere nuttige projecten aan te kunnen bieden. 🙂 

---

Eisen

Handige artikelen:
Voordat je begint met de installatie, moet je de RaspberryPi hebben voorbereid zodat hij toegankelijk is via het netwerk en bestuurbaar is via SSH.

In de volgende drie artikelen wordt beschreven wat er moet gebeuren om de RaspberryPi voor te bereiden:
RaspberryPi – setup voor nerds!
RaspberryPi – De eerste configuratie!
RaspberryPi – Bedien de RaspberryPi via SSH
MagicMirror - De benodigde software installeren
MagicMirror - Modules van derden installeren

Benodigd materiaal:

In de volgende lijst vindt u alle onderdelen die u nodig heeft om dit artikel te implementeren.

---

Log in op de configuratie-interface van NodeRed

Voordat u uw NodeRed-configuratie kunt bewerken, moet u - indien geactiveerd - eerst inloggen op de NodeRed-configuratie-interface.

---

Maak de gegevensbron in NodeRed aan als JSON

In dit voorbeeld worden gegevens van de RaspberryPI waarop NodeRed draait weergegeven op de MagicMirror.
NodeRed levert deze gegevens als JSON, die de MagicMirror met regelmatige tussenpozen verzamelt en op het display weergeeft. U hoeft geen nieuwe knooppunten te installeren, omdat de gegevensbron is samengesteld uit de standaardknooppunten.

Om dit te doen, moet je de volgende stroom bouwen.

Het is eenvoudiger om de volgende knooppuntcode in te voegen:

[{"id 'cc7a1b10.a7c038', type 'http in', z '8c9f8f17.13eb78', 'name', 'url', 'url', 'daten.json', method 'get', 'upload':false, 'swaggerDoc', 'x':320,'y':460,'wires':[['61e489ce.08eb68']]},{'id "89f4552e.8cc4f8", "type":http response, "z":8c9f8f17.13eb78", "name":, "x":1040,"y":460,"draden": []},{"id 'ced95c01.75153', type 'change', z '8c9f8f17.13eb78', 'name 'Kopteksten instellen', 'regels':[{"t vacatures: "p"headers", "pt":msg", "to":{}", "tot":json"},{"t":set", p"headers.content-type", "pt":msg", "to"application/json", "tot" str"}],"action"", "property": "","from":", "to":", reg":false,"x":880,"y":460,"draden":[["89f4552e.8cc4f8"]]}, {"id 'a5b108a6.e68c88', type 'template', z '8c9f8f17.13eb78', 'name' pagina, 'field', payload, 'fieldType', msg "format" stuur "syntax" snor "template": { "Gegevens": [ { "naam": "RPi Temp", "waarde": "{{temp}} °C", "lastUpdate": "{{temp-timestamp}}" }, { "name": "CPU-belasting", "value": "{{load}}%", "lastUpdate": "{{load -timestamp}}" }, { "name": "Vrij geheugen", "value": "{{free}}MB", "lastUpdate": "{{free-timestamp}}" } ] }","output trays":[["ced95c01.75153"]]},{"id":c088c2a8.b53bc","type"commentaar ","z":8c9f8f17.13eb78", "name":Json-feed voor het voeden van de MagicMirror", "info":, "x":240,"y":80,"draden":[] },{"id '61e489ce.08eb68', type 'wijzigen', z '8c9f8f17.13eb78', 'name 'Kopieertijd', 'regels':[{"t': "set","p"temp",pt"msg", "to"temp",tot"flow"},{"t"set",p": "temp-timestamp", "pt":msg", "to":temp-timestamp", "tot":flow"},{"t"set", "p": laden", "pt":msg", "to": laden", "tot": flow"},{"t: set", "p: tijdstempel laden", "pt: msg "to"load-timestamp","tot"flow"},{"t"set"p"free"pt"msg""to": "gratis", "tot":flow"},{"t":set", "p": gratis tijdstempel", "tot":flow"}],"action":"property":560, "y":460,"draden":[["a5b108a6.e68c88"]]},{"id":b64f17d1.b71778", "type"commentaar", "z":8c9f8f17.13eb78", "name":Inkomende gegevens worden hier tijdelijk opgeslagen om ze later te kunnen verzenden", "info":"x":480,"y":140,"wires":[]},{"id":9eede084 .b713a", "type":comment","z":8c9f8f17.13eb78", "name": Hier worden de opgeslagen gegevens geleverd als Json ", info":, "x":410, "y":420,"wires":[]},{"id":877b026b.7bbd9", "type"exec", "z":8c9f8f17.13eb78", "command":vcgencmd meet_temp ","addpay":false,"append":","useSpawn"","timer":",name"RPi-temperatuur", "x":510,"y":220 ,"draden":[["c71030c9.e8723"],[],[]]},{"id":e2c23c0f.e6896", type": injecteren", "z":8c9f8f17.13eb78" ,"name" "topic" ", "payload" ", "payloadType ", datum ", repeat "10", crontab ", "once":false ,"onceDelay":","x":310,"y":220,"draden":[["877b026b.7bbd9","bd2a3aa8.b05be8","f6021bf6.b47108"]]},{"id 'c71030c9.e8723', type 'function', z '8c9f8f17.13eb78', name 'cutString', 'func' str = msg.payload msg.payload = str. subtekenreeks(5,9); return msg;","outputs":1,"noerr":0,"x":700,"y":220,"wires":[["38abd283.af271e"]]},{"iddice: bd2a3aa8.b05be8", type "exec", "z":8c9f8f17.13eb78", "command":top -d 1 -b -n2 | grep "Cpu(s)"|tail -n 1 | awk '{print $2 + $4}'","addpay":false,"append":","useSpawn":", "timer":", "oldrc":false,"name"CPU Belasting","x":510,"y":280,"draden":[["966babc4.47d538"],[],[]]},{"id":f6021bf6.b47108", "type" :"exec", "z":8c9f8f17.13eb78", "command": gratis | grep-meme | awk '{print 100*($4+$6+$7)/$2}'","addpay":false,"append" "useSpawn" "timer": "name": "Vrij geheugen","x":510,"y":340,"wires":[["350be0e6.dc723"],[],[]]},{"id 'ff73e7b0.560078' type 'wijzigen', z '8c9f8f17.13eb78', name 'Bewaartijd', 'regels':[{"t 'instellen', 'p 'temp', 'pt static: "to"payload","tot"msg"},{"t"set", "p"temp-timestamp", "pt":flow", "to"timestamp","tot"msg"}],"action" ", "property" ", "from" ", " to ", "reg": false,"x":1170,"y":220,"wires":[[]]},{"id":ec6a82fb.238ff", type":change", "z":8c9f8f17. 13eb78", "name": "Winkeltijd", "rules":[{"t":set", "p": laden", "pt":flow", "to": payload", "tot":msg"},{"t":set", "p": laadtijdstempel", "pt":flow", to: tijdstempel", tot "msg" "}],"action": "property": "from": "to": "reg":false,"x":1170,"y":280, "wires":[[]]},{"id 'bd9b96f7.e4c268', type 'change', z ' z ' 8c9f8f17.13eb78 ',name 'Winkeltijd', 'regels ":[{"t "set", p "free", pt "flow", to "payload", tot "msg"},{"t": "set", "p": gratis tijdstempel "pt "flow", "to" tijdstempel ", tot "msg"}]," action ", "property" :"","from":", "to":", reg":false,"x":1170,"y":340,"wires":[[]]},{"id" :"38abd283.af271e","type"function",z"8c9f8f17.13eb78",name"tijdstempel toevoegen",func":msg.payload = msg.payload; var nu = nieuwe datum(); var Uren=nu.getHours(); var Minuten=nu.getMinutes(); var Seconden=nu.getSeconds(); als (Seconden<10) Seconden = "0"+Seconden; if (Minuten<10) Minuten = "0"+Minuten; if (Uren<10) Uren = "0"+Uren; msg.timestamp=Uren+:+Minuten+:+Seconden; return msg;","outputs":1,"noerr":0,"x":960,"y":220,"wires":[["ff73e7b0.560078"]]},{"iddice: 9a625c6e.b43da","type"function",z"8c9f8f17.13eb78",name"tijdstempel toevoegen",func":msg.payload = msg.payload; var nu = nieuwe datum(); var Uren=nu.getHours(); var Minuten=nu.getMinutes(); var Seconden=nu.getSeconds(); als (Seconden<10) Seconden = "0"+Seconden; if (Minuten<10) Minuten = "0"+Minuten; if (Uren<10) Uren = "0"+Uren; msg.timestamp=Uren+:+Minuten+:+Seconden; return msg;","outputs":1,"noerr":0,"x":960,"y":280,"wires":[["ec6a82fb.238ff"]]},{"iddice: a85eaa63.cad4a8", type "function", z "8c9f8f17.13eb78", naam "addTimestamp", "func":msg.payload = msg.payload; var nu = nieuwe datum(); var Uren=nu.getHours(); var Minuten=nu.getMinutes(); var Seconden=nu.getSeconds(); als (Seconden<10) Seconden = "0"+Seconden; if (Minuten<10) Minuten = "0"+Minuten; if (Uren<10) Uren="0"+Uren; msg.timestamp=Uren+:+Minuten+:+Seconden; return msg;","outputs":1,"noerr":0,"x":960,"y":340,"wires":[["bd9b96f7.e4c268"]]},{"iddice: 350be0e6.dc723 "type" function "z":8c9f8f17.13eb78 "name" "deleteWhitespace" "func" str = msg.payload msg.payload = str.trim() ; return msg;","outputs":1,"noerr":0,"x":730,"y":340,"wires":[["a85eaa63.cad4a8"]]},{"iddice: 966babc4.47d538 "type" function "z" 8c9f8f17.13eb78 "naam" deleteWhitespace "" func "str = msg.payload msg.payload = str.trim() ; return msg;","uitgangen":1,"noerr":0,"x":730,"y":280,"draden":[["9a625c6e.b43da"]]}]

Nun wird Euch unter der Adresse (achtet aber darauf ob Ihr ein „https://“ oder „http://“ voranstellen müsst.

https://IP_EURER_NODE_RED_INSTALLATION:1880/daten.json

er wordt een JSON weergegeven met de gegevens die u hebt ingevoerd. Deze kan nu op zijn beurt hierop worden weergegeven door een MagicMirror-plug-in.

---

Het installeren van de module

Damit Ihr die Daten die euch von NodeRed als JSON zur Verfügung gestellt werden auf dem MagicMirror anzeigen könnt müsst Ihr dann das Modul „MMM-JsonTable“ installieren. Ihr findet es unter https://github.com/timdows/MMM-JsonTable.

Installeer dit op je RaspberryPi. Hoe u uw modules installeert, wordt beschreven in het volgende artikel:
MagicMirror - Modules van derden installeren

---

Configuratie van de module

De configuratie van de module is eenvoudig gehouden, aangezien de structuur van de weergegeven data wordt bepaald door de JSON.

sudo nano ~/MagicMirror/config/config.js

{ module: 'MMM-JsonTable', position: 'top_right', header: 'Raspi-Status', config: { url: 'https://IP_EURER_NODE_RED_INSTALLATION:1880/daten.json', // Vereiste arrayName: 'Data' , // optioneel tryFormatDate: false } }

---

Ga naar de module voor zelfondertekende SSL-certificaten

Helaas is er een probleem met de MagicMirror plugin (huidig: november 2018). Dit staat geen HTTPS-verbindingen toe als het betreffende SSL-certificaat zelfondertekend is.
Dat wil zeggen, als u uw NodeRed-installatie hebt zoals beschreven in het bericht NodeRed - Verbinding versleutelen Als je het hebt beveiligd met een zelfondertekend SSL-certificaat, kan de MagicMirror-plug-in de gegevens uit de JSON niet laden of weergeven.

Om dit probleem op te lossen is er een kleine oplossing die deze beveiligingsfunctie uitschakelt. Dit betekent dat de MagicMirror-plug-in ook zelfondertekende SSL-certificaten kan accepteren en de gegevens van uw JSON kan weergeven.

Schakel hiervoor naar de modulemap van de MagicMirror-module die u zojuist hebt geïnstalleerd.

cd MagicMirror/modules/MMM-JsonTable/

Dort öffnet Ihr die Datei „node_helper.js“ mit folgendem Befehl:

sudo nano node_helper.js

In het geopende bestand moet je nu de regel vinden met de volgende inhoud:

request({ url: url, methode: 'GET'}, function (error, response, body) {

In dieser Zeile müsst Ihr nun nach dem „…method: ‚GET'“ den Befehl „, rejectUnauthorized: false“ einfügen.
De regel zou er dus zo uit moeten zien:

 request({ url: url, methode: 'GET', rejectUnauthorized: false}, function (error, response, body){

Last but not least moet u uw MagicMirror-installatie opnieuw starten door de volgende opdracht in te voeren:

pm2 herstart mm

Na het opnieuw opstarten en opnieuw laden van de MagicMirror-weergave worden de gegevens uit de JSON weergegeven. 🙂

---

Verdere informatie

https://github.com/MichMich/MagicMirror
https://github.com/timdows/MMM-JsonTable

---

Veel plezier met het project

Ik hoop dat alles werkte zoals beschreven. Zo niet, of als je vragen of suggesties hebt, laat het me weten in de commentaren. Ik zal dit dan zo nodig aan het artikel toevoegen.
Ideeën voor nieuwe projecten zijn altijd welkom. 🙂

PS Veel van deze projecten - vooral de hardwareprojecten - kosten veel tijd en geld. Natuurlijk doe ik dit omdat ik het leuk vind, maar als je het cool vindt dat ik de informatie met je deel, dan zou ik blij zijn met een kleine donatie aan het koffiefonds. 🙂