Webserver
Nu onze ESP32 verbinding maakt met WiFi kunnen er verder met het echte werk. Maak een nieuw bestand aan in je IDE en geef deze alvast de naam "main.py".
wij hebben het volgende gecodeerd:
(inspriningen worden niet vertoont op deze website, ik raad u aan om mijn github pagina (gitfront) voor een betere weergave van onze scripten.
import socket
# maakt IP-communicatie mogelijk.
led_state = {0: "uit", 1: "aan"}
# een variabele die 0 omzet in uit en 1 omzet in aan.
def web_page():
return """<html>
<head>
<title>ESP32 webserver met led</title>
<meta content="width=device-width, initial-scale=1">
</head>
<body>
<h1>ESP32 webserver met led</h1>
<a href="/?led={}"><button>{}</button></a>
</body>
</html>""".format(led_state[not led.value()], led_state[led.value()])
# het html script, hier ga ik laten op in
server_socket = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
server_socket.bind(("", 8080))
server_socket.listen(5)
# maakt een socket aan met het TCP/IP protocol(familie).
# verbindt de socket met het IP adress van de ESP32 en poort.
# accepteerd inkomende verbindingen, met een maximale wachtrij van 5.
while True:
connection, address = server_socket.accept()
print("Got a connection from %s" % str(address))
request = str(connection.recv(1024))
print("connect = %s" % request)
# verbindt en retourneert nieuwe socket en het adres van de client.
# ontvangt en slaat inkomend http-verzoek op in request.
led_on = request.find("/?led=aan")
led_off = request.find("/?led=uit")
if led_on == 6:
print("LED ON")
led.value(1)
if led_off == 6:
print("LED OFF")
led.value(0)
# zorgt Dat de value van de led op 0 of 1 wordt gezet, oftewel aan of uit.
# print LED OFF of LED ON in de terminal wanneer hij uit of aan gaat.
response = web_page()
connection.send("HTTP/1.1 200 OK\n")
connection.send("Content-Type: text/html\n")
connection.send("Connection: close\n\n")
connection.sendall(response)
connection.close()
# genereerd de webpagina op basis van de huidige status van de led.
# verzenden de http-respons met de juiste headers en de gegenereerde HTML-pagina naar de client.
# sluit verbinding nadat response is verzonden.
Na het runnen van dit script gaf de terminal mij de volgende error:
line 25: OSError: [Errno 112] EADDRINUSE
Eerst kwamen we er niet uit wat het was. We gingen even googelen en hebben ChatGpt gevraagd om hulp. Uiteindelijk kwamen we erachter dat het probleem "80" is. 80 is namelijk de poort die we webserver gebruikt. Alleen is op dat moment poort 80 al in gebruik. Dus kan de webserver daar geen gebruik van maken. We hebben het veranderd naar "8080", waarna hij werkte.
Op wat kleine syntax foutjes na zijn we geen problemen tegengekomen. Wat we wel raar vonden is dat er nergens aangegeven is op welke pin de led is aangesloten, maar toch ging de led steeds aan en uit.
Je maakt verbinding met de webserver in je browser. Voordat je verbinding maakt moet eerst weten wat het IP adress is van je ESP32. Dat kun je weten door zelf het boot.py bestand te runnen en de eerste reeks met cijfers en punten te noteren. Waarschijnlijk begint het met 192.168.. Nu kun je je browser openen en het volgende invullen:
https://[IP-Adress]:[poort]
als het goed is maak je nu verbinding met de webserver en zie je het volgende:

Als je op de knop drukt zal je zien dat het led lampje aan en uit zal gaan. En zie je ook in de terminal van je IDE de requests staan met het IP adress van het apparaat waarmee met de website verbonden bent.
