In diesem Beitrag möchte ich dir gerne zeigen, wie du via HTTP-Request LEDs am ESP32 D1 R32 mit MicroPython steuern kannst. Im letzten Beitrag hatte ich dir bereits erläutert, wie man einen HTTP Webserver aufsetzt und eine kleine Webseite ausliefert. Nun möchte ich dir zeigen, wie man Aktoren steuern kann.
Das Gute daran ist, dass du statt LEDs auch Relais anklemmen kannst, um andere Geräte zu schalten. Relais funktionieren ähnlich wie LEDs im Code, was dieses Beispiel sehr einfach aufzubauen und zu programmieren macht. In diesem Beitrag zeige ich dir, wie du LEDs und Relais über HTTP-Requests steuern kannst. Dies ermöglicht dir eine einfache Steuerung deiner Geräte über das Internet oder ein lokales Netzwerk.
Inhaltsverzeichnis
- Benötigte Ressourcen für den Nachbau
- Aufbau der Schaltung
- Webseite zum Steuern der LEDs und des Relais
- Ausblick auf den nächsten Beitrag zu MicroPython mit ESP32 & HTTP-Request
Benötigte Ressourcen für den Nachbau
Wenn du das kleine Projekt nachbauen möchtest, dann benötigst du:
- einen ESP32 D1 R32*
- ein Micro USB-Datenkabel*
- ein Relais Shield*
- drei Breadboardkabel*, weiblich-männlich
- drei 5 mm LEDs*
- drei 220 Ohm Vorwiderstände*
- sechs Breadboardkabel, männlich-männlich
- ein 400 Pin Breadboard*
Hinweis von mir: Die mit einem Sternchen (*) markierten Links sind Affiliate-Links. Wenn du über diese Links einkaufst, erhalte ich eine kleine Provision, die dazu beiträgt, diesen Blog zu unterstützen. Der Preis für dich bleibt dabei unverändert. Vielen Dank für deine Unterstützung!
Aufbau der Schaltung
Der ESP32 D1 R32 hat den Vorteil, dass dieser im Format des Arduino UNO R3 / R4 ist und somit die meisten Multifunktionalen Shields drauf passen. Jedoch möchte ich in diesem Beitrag eine kleine Schaltung an diesem aufbauen.
Es gibt Shields welche über LEDs und ein Relais verfügt, hier zum Beispiel das YwRobot Easy Module MIX V1*. Dieses hatte ich dir bereits im Beitrag Arduino Lektion #101: Multifunktionales Shield “Easy Module MIX V1” von YwRobot anhand des Arduino vorgestellt.
Nachfolgend möchte ich dir jedoch zeigen, wie du die kleine Schaltung mit den LEDs und dem Relais auf einem 400 Pin Breadboard aufbaust.
Testen der Schaltung
Bevor wir mit der Programmierung beginnen, testen wir die Schaltung, ob dieses so funktioniert, dazu schreiben wir ein einfaches kleines Programm, welches die LEDs und das Relais aktiviert und deaktiviert.
# importieren der Module für den Zugriff auf
# die GPIOs
import machine
# importieren des Modules für den Zugriff auf
# die Funktionen für Zeit
import time
# rote LED am GPIO17 angeschlossen
ledRot = machine.Pin(17, machine.Pin.OUT)
# grüne LED am GPIO16 angeschlossen
ledGruen = machine.Pin(16, machine.Pin.OUT)
# gelbe LED am GPIO14 angeschlossen
ledGelb = machine.Pin(14, machine.Pin.OUT)
# Relais am GPIO12 angeschlossen
relais = machine.Pin(12, machine.Pin.OUT)
# Funktion zum setzen eines neuen Status des GPIOs
def setState(state):
ledRot.value(state)
ledGelb.value(state)
ledGruen.value(state)
relais.value(state)
# Alle GPIOs / Komponenten deaktivieren
setState(0)
try:
# Wiederhole 20x
for index in range(20):
# Alle GPIOs / Komponenten aktivieren
setState(1)
# eine Pause von 500ms
time.sleep(0.5)
# Alle GPIOs / Komponenten deaktivieren
setState(0)
# eine Pause von 500ms
time.sleep(0.5)
except KeyboardInterrupt:
# Alle GPIOs / Komponenten deaktivieren
setState(0)
Der Code lässt die GPIOs der LEDs und des Relais 20x Ein-/Ausschalten.
Webseite zum Steuern der LEDs und des Relais
Es gibt wie oft im Leben mehrere Lösungen, nachfolgend möchte ich dir eine Lösung vorstellen, in welcher wir die Webseite auf dem Mikrocontroller ablegen und bei jedem Aufruf der IP-Adresse des Gerätes ausgeliefert wird.
Die Webseite enthält für jede Komponente eine Schaltfläche sowie eine kleine Leuchte welche den Zustand dieser Komponente bzw. den dahinterliegenden GPIO visualisiert.
Schritt 1 – erstellen einer lokalen Webseite
Im ersten Schritt erstellen wir die kleine Webseite mit dem Dashboard. Die Bilder für die Visualisierung des Status der GPIOs habe ich von der Seite iconfinder.com geladen (dort kann man nicht nur Suchen, sondern auch einen Filter auf Free & free for commercial use setzen).
Die kleinen PNG-Dateien habe ich in der Größe von 48px x 48px heruntergeladen und mit der Seite www.base64-image.de in Base64 Zeichenketten umgewandelt, dieses macht es einfacher die Bilder in die Seite zu integrieren.
Schritt 2 – Ablegen der Webseite auf den Mikrocontroller
Zum Programmieren verwende ich wie so oft für MicroPython Thonny dieses kostenfreie Tool kannst du dir unter thonny.org für Windows, Linux und macOS herunterladen.
Über dieses Tool kannst du die HTML-Datei auf den Mikrocontroller ablegen.
Dazu klickst du im oberen Bereich des Explorers auf die Datei und wählst aus dem Kontextmenü (rechte Maustaste) den Eintrag „Upload to /“.
Es ist empfehlenswert, dass zu diesem Zeitpunkt kein Programm läuft, so dauert der Upload nicht so lange.
Schritt 3 – Programm auf dem Mikrocontroller erstellen
Zunächst benötigen wir die Imports für den Aufbau der WiFi-Verbindung und zum ansteuern der GPIOs vom Mikrocontroller.
import network import socket from secrets import * from machine import Pin
Ablage der Zugangsdaten in der Datei secrets.py
Die SSID sowie das Passwort lege ich in der Datei secrets.py ab, welche ebenso importiert wird. Du könntest diese Werte auch direkt in den Code schreiben.
wifi_ssid = "xxxx" wifi_password = "yyyy"
Schritt 3.1 – Aufbau einer WLAN-Verbindung
Damit die Verbindung zum lokalen WLAN Netzwerk hergestellt werden kann, benötigen wir die SSID sowie das Passwort.
# Aufbau der WiFi-Verbindung zum WLAN connection = network.WLAN(network.STA_IF) connection.active(True) connection.connect(wifi_ssid, wifi_password)
Schritt 3.2 – Laden der Webseite
Da die Webseite als HTML-Datei auf dem Mikrocontroller abgelegt wurde, müssen wird diese einmal einlesen und in eine Variable verpacken. In einem weiteren Abschnitt würden wir die darin befindlichen Platzhalter mit Werten ersetzen.
website = ''
with open('website.html', 'r') as file:
for line in file.readlines():
website += line
Schritt 3.3 – Auslesen der aktuellen Status der GPIOs
Bevor die Seite ausgeliefert wird, werden alle Status der GPIOs (von den LEDs und dem Relais) ausgelesen und auf die jeweiligen CSS-Klassen gemappt.
ledRotClass = classImgOn if ledRot.value() == 1 else classImgOff ledGruenClass = classImgOn if ledGruen.value() == 1 else classImgOff ledGelbClass = classImgOn if ledGelb.value() == 1 else classImgOff relaisClass = classImgOn if relais.value() == 1 else classImgOff
Schritt 4 – Request vom Client auswerten
Wenn der Benutzer der Webseite eine Schaltfläche klickt, dann wird ein Ajax Request abgesendet. Bei einer positiven Rückantwort wird die Seite neu geladen und der aktuelle Status ist sichtbar. Für jede Schaltfläche wird ein Index beginnend bei 0 übergeben und im Code ausgewertet. Dazu wird lediglich geprüft, ob im Response ein Text enthalten ist.
data = r.decode('utf-8')
print(data)
currentState = -1
component = None
handleRequest = False
if '/toggle=0' in data:
currentState = ledRot.value()
component = ledRot
handleRequest = True
if '/toggle=1' in data:
currentState = ledGelb.value()
component = ledGelb
handleRequest = True
if '/toggle=2' in data:
currentState = ledGruen.value()
component = ledGruen
handleRequest = True
if '/toggle=3' in data:
currentState = relais.value()
component = relais
handleRequest = True
Schritt 4.1 – aktivieren eines GPIOs
Wenn ein definierter Text im Request erkannt wurde, dann wird der entsprechende GPIO aktiviert bzw. deaktiviert.
if handleRequest:
if currentState == 0:
component.value(1)
else:
component.value(0)
Schritt 4.2 – ersetzen der Platzhalter durch Status der GPIOs
In der Variable website befindet sich der Inhalt der Datei website.html in welchem wiederum wieder Platzhalter enthalten sind, welche wir durch die jeweiligen Style-Klassen ersetzen.
keyLedRotClass = '{ledRotClass}'
keyLedGelbClass = '{ledGelbClass}'
keyLedGruenClass = '{ledGruenClass}'
keyRelaisClass = '{relaisClass}'
website = website.replace(keyLedRotClass, ledRotClass);
website = website.replace(keyLedGelbClass, ledGelbClass);
website = website.replace(keyLedGruenClass, ledGruenClass);
website = website.replace(keyRelaisClass, relaisClass);
Ausblick auf den nächsten Beitrag zu MicroPython mit ESP32 & HTTP-Request
Im nächsten Beitrag möchte ich dir zeigen, wie du für dein Smarthome einen Shelly steuerst und auslesen kannst. Die Shelly Geräte haben den Vorteil, dass diese eine öffentliche API haben und somit sehr einfach anzusteuern sind.