WebServer avec ESP32 /micropython

 WebServer avec ESP32 /micropython


Bonjour a tous je vous présente aujourd'hui un projet assez facile a faire mais surtout très intéressant pour l'incorporer a tous les projets que vous feriez dans un futur. Alors passons aux explications.

Tout d'abord on va voir les objets qu'on doit utiliser, bon ce n'est pas complique dans ce projet on doit juste avoir un ESP32, mais si vous avez un ESP8266 ceci marchera toujours mais faites attention a la compatibilité du code :)

Dans ce tutoriel on verra comment faire un Serveur Web depuis notre ESP32 qui sera disponible dans notre réseau LAN, le serveur on peut le personnaliser comme si c'était un site web normale je vous pose ici un exemple de site web :

Dans cet exemple c'est tout simplement 3 buttons qui ne font rien, si vous voulez me demander comment faire pour interagir avec l'ESP32 depuis un serveur Web n'hésitez pas a me demander en commentaires et je ferais un article a ce sujet.

Pour ce projet on aura pas besoin d'une librairie spécifique juste un module qui est déjà inclus dans Micropython, le module "socket" avec ce module on pourra faire plein de chose vous verrez.

Tout d'abord dans votre code vous devez l'import :

import socket

Suite a ça vous affectez une variable pour pouvoir utiliser le module socket a votre propre liberté dans cet exemple j'utiliserais la variable "s" :

s = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
s.setsockopt(socket.SOL_SOCKET, socket.SO_REUSEADDR, 1)
s.bind(('',80))
s.listen(5)

Les deux dernières lignes de code commencent le serveur dans le port 80 du ESP32, et laisse juste 5 appareils différents de se connecter dans le serveur. Oui que 5, vous ne pourrez pas faire un WebSite internationale avec un ESP32 :)

Suite a ça on devra coder notre page HTML car sinon on aura que une page blanche ou même pire, pas de page, on fait ça de suite :

def web_page():
       
    html_page = """
<html>  
    <head>  
        <meta name="viewport" content="width=device-width, initial-scale=1">  
    </head>  
    <body>  
       <center><h2>ESP32 Web Server</h2></center>  
       <center>  
        <form>  
           <button type='submit' name="TEXTE" value='1'> Joyeux noel </button>  
           <button type='submit' name="TEXTE" value='0'> Feliz Navidad </button>
           <button type='submit' name="TEXTE" value='2'> Happy Birthday </button>
        </form>  
   </center>
    </body>  
</html>     """  
    return html_page

Ceci est l'HTML de la page Web, vous devez incorporer comme il est dans votre code python, et oui c'est compatible ne vous inquiétez pas. Sentez vous libre a le modifier comme vous voulez la partie "name" et "value" vous pouvez les supprimer car elles ne servent a pas grande chose dans ce cas mais je les utiliserais pour afficher dans la page de commandes dans l'ESP32, vous verrez.

La vous avez le site web, bon tout ceci ne suffit pas il faut commencer un site web, et comment on le fait? Je vous montre de suite :

while True:
    # Socket accept()
    conn, addr = s.accept()
    print("Got connection from %s" % str(addr))
   
    # Socket receive()
    request=conn.recv(1024)
    print("")
    print("")
    print("Content %s" % str(request))

    # Socket send()
    request = str(request)
    texte1 = request.find('/?TEXTE=1')
    texte2 = request.find('/?TEXTE=0')
    texte3 = request.find('/?TEXTE=2')
   
    if texte1 == 6:
        print('Texte 1 en marche')
        print(str(texte1))

    elif texte2 == 6:
        print('Texte 2 en marche')
        print(str(texte2))
     
    elif texte3 == 6:
        print('Texte 2 en marche')
        print(str(texte2))

    response = web_page()
    conn.send('HTTP/1.1 200 OK\n')
    conn.send('Content-Type: text/html\n')
    conn.send('Connection: close\n\n')
    conn.sendall(response)
   
    # Socket close()
    conn.close()

C'est assez abstrait comme code je sais, on décrite ça ensemble. En générale ce code crée une boucle while qui envoie en continue la page web a notre navigateur, quand on clique sur un bouton, on va envoyer une "value" soir 1,0 ou 2 ceci seront des message qui seront affiches dans la page de commandes de notre ESP32, si vous avez rien compris, n'hésitez pas a poser des questions en commentaires.

Bon voila la vous avez un site web qui fonctionne a la perfection et on verra dans des futurs articles comment ceci on peut l'intégrer a tous nos projets.

Je vous souhaite une agréable journée.



Commentaires