Dashboard-Server mit Freeboard einrichten

Kategorien: administration

Adafruit bietet für das Internet of Things einiges an. Besonders hat mir auf den ersten Blick der Dienst Adafruit.IO gefallen. Ruckzuck hatte ich einen Benutzer eingerichtet und einen ESP8266 mit PlattformIO programmiert. Mit dem Programmbeispiel sendet der ESP-01 alle fünf Sekunden einen Zählerwert. Der Wert wird schön in einem Graph im Dashboard auf adafruit.io angezeigt.

Beispiel eines adafruit.io Dashoards

Für den Unterricht ist der Dienst aber ungeeignet:

  • Die Schüler müssen einen Benutzer einrichten. Adafruit möchte dabei netterweise keine besonderen Daten.
  • Die Verfügbarkeit des Dienstes ist nicht garantiert.
  • Die Firewall der Schule lässt nur HTTP/HTTPS-Verkehr über einen Proxy mit Autorisierung durch. Damit können keine MQTT-Nachrichten das Schulnetz verlassen. Websockets habe ich nicht ausprobiert. Sie sind mir aber auch für die Vermittlung der Prinzipien zu aufwendig.
  • Der MQTT-Server liegt auf Github adafruit-io-node allerdings scheint die Version deutlich älter zu sein als der Dienst unter adafruit.io. Es fehlt auch das Dashboard und die Benutzerverwaltung.

MQTT-Server

Eine kurze Recherche findet viele Server, die das MQTT-Protokoll unterstützen:

Mosquitto ist einfach einzurichten, unterstützt Websockets und mehrere Benutzer mit Authentikation. Fürs Erste werde ich Mosquitto verwenden. EMQ sieht aber auch interessant aus.

Installation von Mosquitto

Die aktuell in Raspbian-Jessy verfügbare Mosquitto-Version 1.3 unterstützt leider keine Websockets, deshalb musste ich die Version 1.4 aus dem Mosquitto-Repository installieren.

cd /etc/apt/sources.list.d/
sudo wget http://repo.mosquitto.org/debian/mosquitto-jessie.list
cd
wget http://repo.mosquitto.org/debian/mosquitto-repo.gpg.key
sudo apt-key add mosquitto-repo.gpg.key
rm mosquitto-repo.gpg.key

sudo apt update
sudo apt upgrade

Jetzt kann man die Datei /etc/mosquitto.conf/conf.d/simple.conf anlegen:

listener 1883
listener 9001 127.0.0.1
protocol websockets

Das ist noch keine Produktiv-Konfiguration, sondern nur für die Testumgebung.

Dashboards

Ein Dashboard (deutsch Armaturenbrett) ist nicht unbedingt notwendig. Schließlich kann man die Anzeige der Sensorwerte auch händisch programmieren, aber das ist mir zu aufwendig. Schön ist, wenn man verschiedene Instrumente mit verschiedenen Sensoren verbinden kann und “beliebig” in einem Raster auf eine Webseite anordnen kann. adafruit.io bietet das an.

Freeboard

Bei der Recherche bin ich schnell auf Freeboard gestoßen. Das ist ebenfalls erst einmal ein Dienstanbieter. Der allerdings den Quellkode des Kerns auf Github unter MIT-Lizenz anbietet. Dem Kern fehlt eine Benutzerverwaltung und die Verwaltung der Dashboards der Benutzer. Das kann/soll man sich selbst programmieren (oder natürlich besser den Dienst abonnieren - Preise).

Es gibt auch einen Fork MyViz, der teilweise etwas weiter zu sein scheint, das Github-Repository scheint mir aber etwas unordentlich.

Der größte Nachteil von Freeboard ist das Fehlen von interaktiven Widgets, mit denen beispielsweise ein Aktor eingeschaltet oder einen Wert bekommt. Es gibt aber einige Ideen, wie man das umsetzen kann.

Installation

Die Installation von Freeboard unter Linux (zum Beispiel Raspbian( ist schnell erledigt, wenn man Apache, NPM und Grunt installiert hat.

Bei Raspbian habe ich vorher das System aktualisiert und musste Apache, NPM und grunt-cli installieren

sudo apt update
sudo apt upgrade

sudo apt install apache2 npm
sudo npm install -g grunt-cli

Damit ist die Installation von Freeboard einfach:

cd ~
mkdir git
cd git
git clone https://github.com/Freeboard/freeboard.git

cd freeboard

npm install
grunt

sudo cp -dpR css/ img/ index.html js/ plugins/ /var/www/html/

Jetzt kann man mit dem Stöberer (engl. browser) aka Firefox, Chromium, Safari den Server ansprechen. Es sollte die Freeboard-Seite angezeigt werden.

Allerdings unterstützt Freeboard den MQTT-Server nicht als Datenquelle. Dazu sind noch zwei weitere Projekte notwendig.

Das Eclipse Paho-Projekt bietet eine MQTT-3.1-Client-Implementierung in JavaScript an. Am besten ist es, das ZIP-Archiv von der Download-Seite zu laden und mqttws31-min.js aus dem Archiv zu extrahieren. Die einfachere Variante, die JavaScript-Implementierung zu installieren, ist aber die folgende. Sie hat aber den Nachteil, dass bei jedem Laden der Seite, die vergleichsweise große, nicht minifizierte JavaScript-Datei geladen wird.

cd ~/git/freeboard/lib/plugins/thirdparty
wget https://raw.githubusercontent.com/eclipse/paho.mqtt.javascript/master/src/mqttws31.js

Ein Freeboard-Plugin, das diesen Paho-Client nutzt, gibt es auf Github. Man könnte natürlich das Repository klonen, aber wir benötigen nur eine Datei.

wget https://raw.githubusercontent.com/alsm/freeboard-mqtt/master/paho.mqtt.plugin.js

In dieser Datei muss noch die URI des Paho-JavaScript-Clients angegeben werden. Bei uns wird sie unter plugins/thirdparty liegen. Also ändern wir die Datei paho.mqtt.plugin.js:

freeboard.loadDatasourcePlugin({
  "type_name"   : "paho_mqtt",
  "display_name": "Paho MQTT",
      "description" : "Receive data from an MQTT server.",
  "external_scripts" : [
    "plugins/thirdparty/mqttws31.js"
  ],

// Der Rest bleibt unverändert…

In der index.html muss jetzt noch das Plugin geladen werden:

<script type="text/javascript">
    head.js("js/freeboard_plugins.min.js",
            "plugins/thirdparty/paho.mqtt.plugin.js",
            // *** Load more plugins here ***

Nach etwas Gegrunze wird Freeboard mit Plugin auf dem Server abgelegt:

cd ~/git/freeboard
grunt
sudo cp -dpR css/ img/ index.html js/ plugins/ /var/www/html/