Umweltdaten im Web-Server

Zielsetzung

In diesem Projekt zeigen wir Umweltdaten (z. B. Temperatur, Luftfeuchtigkeit) nicht nur am Neopixel oder seriellen Monitor an, sondern im Webbrowser – z. B. am Handy. Dazu bauen wir einen kleinen Webserver, der eine eigene Webseite liefert. Gleichzeitig lernen wir auch etwas über WLAN, Client / Server und Protokolle wie HTTP, DNS und HTML.

Umsetzung

Wir erstellen ein eigenes WLAN im Access-Point-Modus mit einem frei wählbaren Netzwerknamen (SSID) und einem Passwort, das mindestens acht Zeichen lang sein muss. In einem Funknetz gibt es grundsätzlich zwei Geräterollen. Ein Access Point ist das Gerät, das ein drahtloses Netzwerk bereitstellt. Er sendet die WLAN-Funkzelle aus (SSID) und fungiert als zentrale Instanz, mit der sich andere Geräte, sogenannte WLAN-Clients, verbinden. Zu den Aufgaben eines Access Points (AP) gehören die Bereitstellung des WLAN-Netzes, die Verwaltung der Client-Verbindungen sowie die Weiterleitung von Daten in ein kabelgebundenes Netzwerk oder ins Internet. In Heimnetzwerken übernimmt diese Funktion in der Regel ein WLAN-Router, beispielsweise eine Fritz!Box. Auch unser Microcontroller kann jedoch als Access Point betrieben werden und ein lokales Netzwerk (Intranet = internes Netzwerk) bereitstellen.
Dann bauen wir mit einem HTTP-Block einen kleinen Webserver auf. Das Hypertext Transfer Protocol ist die Sprache, in der sich unser Handy (mit dem Webbrowser als Client) und unserem Mikrocontroller (als Server) unterhalten. Ein Protokoll ist eine festgelegte Regelung, wie Geräte in einem Netzwerk miteinander kommunizieren und Daten austauschen.
Im Browser können wir die IP-Adresse (z. B. 192.168.4.1/) eingeben. Diese lokale IP-Adresse identifiziert ein Gerät eindeutig innerhalb des eigenen Netzwerks, damit Daten an das richtige Ziel gelangen. 192.168.4.1 ist also die Adresse unseres Mikrocontrollers im selbst aufgespannten Intranet → dort sehen wir eine Webseite mit den aktuellen Umweltdaten. Dazu sendet der Browser als Client eine HTTP-Anfrage an den Server. Der Server antwortet mit einer HTTP-Antwort, die den Inhalt der Webseite enthält. Das Client-Server-Modell beschreibt, dass ein Client eine Anfrage stellt und ein Server darauf reagiert bzw. einen Dienst bereitstellt.
Bei uns werden die Werte auf der Webseite automatisch aktualisiert. Optional kann man eine Textnachricht eingeben, die auf der LED-Matrix erscheint.

Erweiterungen:

mDNS aktivieren → Browser erkennt octopus.local statt IP-Adresse. Eigentlich sind wir es gewohnt, im Webbrowser eine URL einzugeben (z. B. https://www.umwelt-campus.de). Eine RRL (Uniform Resource Locators) ist ein lesbarer Name, den Menschen leicht verstehen können. Computer dagegen kommunizieren über IP-Adressen (z. B. 93.184.216.34). Damit dein Handy also weiß, welche IP-Adresse zu einer URL gehört, verwendet es das DNS-Protokoll. DNS (Domain Name System) ist wie ein Telefonbuch des Internets. Wenn du eine URL aufrufst, passiert normalerweise Folgendes: Dein Gerät fragt beim DNS-Server nach: „Welche IP-Adresse gehört zu www.umwelt-campus.de?“ Der DNS-Server sucht den Eintrag heraus. Dein Gerät erhält die IP-Adresse und verbindet sich damit zum Webserver. Diese automatische Vermittlung funktioniert allerdings nur im "großen Internet". Für unser lokales Netz gibt es jedoch mDNS (multicast DNS), ein Protokoll, das es Geräten in einem lokalen Netzwerk ermöglicht, sich gegenseitig über Namen zu finden, ohne einen zentralen DNS-Server zu benötigen. Statt eine IP-Adresse einzugeben, können Geräte über Namen wie “makey.local” oder “octopus.local” erreicht werden.