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 (Accesspoint-Modus) mit Name und Passwort (mind. 8 Zeichen sind da notwenig). Im Funknetz gibt es zwei Geräterollen. Ein Access Point ist das Gerät, das ein drahtloses Netzwerk bereitstellt. Er sendet die WLAN-Funkzelle aus (SSID) und dient als Zentralstelle, mit der sich andere Geräte (WLAN-Clients) verbinden. Aufgaben eines AP: stellt das WLAN-Netz bereit, verwaltet Verbindungen der Clients, leitet Daten ins kabelgebundene Netzwerk oder ins Internet weiter. Zuhause übernimmt meist ein WLAN-Router (z. B. Fritz-Box) diese Funktion. Aber auch unser Microcontroller kann als Access Point arbeiten und ein lokales Netz (Intranet = internes Netzwerk) aufspannen.
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". Aber für unser lokales Netz gibt es mit mDNS (multicast DNS) ist ein Protokoll, das Geräte 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, kann man Geräte über Namen wie "makey.local" oder „opctopus.local“ erreichen.