{"id":9476,"date":"2022-07-08T13:04:44","date_gmt":"2022-07-08T11:04:44","guid":{"rendered":"https:\/\/fablab21.fr\/?page_id=1701"},"modified":"2026-10-19T19:00:49","modified_gmt":"2026-10-19T17:00:49","slug":"allumer-une-led-a-partir-dune-page-web","status":"publish","type":"page","link":"https:\/\/www.association-ore.fr\/fr\/tutos\/tutos-arduino\/allumer-une-led-a-partir-dune-page-web\/","title":{"rendered":"Allumer une LED depuis une page Web"},"content":{"rendered":"

Principe du Projet<\/b><\/h2>\n

Contr\u00f4ler une LED depuis une page web avec le microcontr\u00f4leur ESP8266.<\/p>\n\n\n

\"\"\/<\/figure>\n\n\n\n

Outils utilis\u00e9s<\/h2>\n\n\n\n
\"\"\/<\/figure>\n\n\n\n

LED<\/h4>\n\n\n\n
\"\"\/<\/figure>\n\n\n

ESP 8266<\/h4>\n\n

Principe de fonctionnement<\/h2>\n
 <\/div>\n

 La carte NodeMCU ESP8266 contient un module ESP-12E contenant un microprocesseur 32bits. Il int\u00e8gre un \u00e9metteur-r\u00e9cepteur WiFi ce qui lui permet de se connecter \u00e0 des r\u00e9seaux existants ou bien de mettre en place son propre r\u00e9seau.
Le r\u00e9seau WiFi est un r\u00e9seau Radio qui travaille sur les fr\u00e9quences 2,45 GHz et 5 GHz.<\/p>\n\n

Sch\u00e9ma<\/h2>
\u00a0<\/div>
Branchez la led sur l’esp8266<\/b><\/div>

Anode —-(D0)<\/p>

Cathode—-(GND) {une r\u00e9sistance entre le GND et le cathode pour la protection }<\/p>\n\n

\u00a0<\/p>

\u00a0<\/p>

\u00a0<\/p>

\u00a0<\/p>

Pour communiquer sur le r\u00e9seau, il nous faut utiliser un protocole particulier. Ce protocole est int\u00e9gr\u00e9 dans toutes les librairies relatives \u00e0 la communication Wifi.<\/p>

\u00a0<\/p>

  • Il faut connecter le module WiFi au r\u00e9seau<\/li>
  • d\u00e9finir un serveur server<\/li>
  • d\u00e9finir un client client\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 La librairie qui va nous permettre de g\u00e9rer l\u2019\u00e9metteur-r\u00e9cepteur Wifi est la librairie ESP8266WiFi.h. Pour charger le code Arduino dans la carte, vous devez s\u00e9lectionner la bonne carte et le bon port.<\/li><\/ul>

    Dans notre cas, la carte est NodeMCU 1.0 (ESP-12E Module). Nous allons ensuite cr\u00e9er l\u2019interface web de l\u2019ESP8266 dans la fonction web page en HTML.<\/p>

    \u00a0<\/p>

    Utilisez une interface web pour piloter des moteurs ou g\u00e9rer des capteurs branch\u00e9s \u00e0 votre microcontr\u00f4leur ESP8266<\/p>

    \u00a0<\/p>

    Juste \u00e9crivez le nom et le mot de passe de votre connexion r\u00e9seau :\u00a0<\/p>

    \u00a0<\/p>

    • const char* ssid = \u00ab\u00a0………….\u00a0\u00bb;<\/li>
    • const char* password = \u00ab\u00a0\u2026\u2026\u2026\u2026\u2026\u2026\u2026\u2026..\u00a0\u00bb;<\/li>
    • \u00a0<\/li><\/ul>

      A la fin :<\/p>

      \u00a0<\/p>

      \u00a0Copiez l\u2019adresse IP sur Navigator(edge,chrome\u2026\u2026) soit sur votre ordinateur ou t\u00e9l\u00e9phone et je vous laisse contr\u00f4ler la LED (allumer\/\u00e9teindre)<\/p>

      \u00a0<\/p>\n\n\n

      Programme :<\/summary>\n
      #include <ESP8266WiFi.h>\nconst char* ssid = "............";\nconst char* password = ".............";\nint ledPin = 16; \nWiFiServer server(80);\nvoid setup() \n{\u00a0\nSerial.begin(115200);\ndelay(100); \npinMode(ledPin, OUTPUT);\ndigitalWrite(ledPin, LOW);\nSerial.println();\nSerial.print("Connecting to ");\nSerial.println(ssid);\nWiFi.begin(ssid, password);\n\/\/ connection en cours ...\nwhile (WiFi.status() != WL_CONNECTED)\n\u00a0 \u00a0 \u00a0 {\n\u00a0 \u00a0 \u00a0 \u00a0delay(500);\n\u00a0 \u00a0 \u00a0 \u00a0Serial.print(".");\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0}\nSerial.println("WiFi connecter"); \/\/ Wifi connecter\nserver.begin();\nSerial.println("Serveur demarrer !");\nSerial.print("Utiliser cette adresse URL pour la connexion :"); \/\/ Affichage de l'adresse IP\nSerial.print("http:\/\/");\nSerial.print(WiFi.localIP());\nSerial.println("\/");\n}\n\u00a0 \nvoid loop()\n\u00a0 \n{\nWiFiClient client;\nclient = server.available();\/\/ V\u00e9rification si le client est connecter.\nif (!client)\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0{\u00a0\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 return;\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0}\nSerial.println("nouveau client"); \/\/ Attendre si le client envoie des donn\u00e9es ...\nwhile(!client.available())\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0{\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0delay(1);\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0}\nString request = client.readStringUntil('\\r');\nSerial.println(request);\nclient.flush();\nint value = LOW;\nif (request.indexOf("\/LED=ON") != -1)\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0{\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0digitalWrite(ledPin, HIGH); \/\/ allumer la led\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0value = HIGH;\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0}\nif (request.indexOf("\/LED=OFF") != -1)\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0{\n\u00a0 \u00a0 \u00a0 \u00a0 digitalWrite(ledPin, LOW); \/\/ \u00e9teindre la led\n\u00a0 \u00a0 \u00a0 \u00a0value = LOW;\n\u00a0 \u00a0 \u00a0 \u00a0 }\n\/\/ R\u00e9ponse\nclient.println("HTTP\/1.1 200 OK");\nclient.println("Content-Type: text\/html");\nclient.println(""); \nclient.println("<!DOCTYPE HTML>");\nclient.println("<html>");\nclient.print("Etat de la led : ");\nif(value == HIGH)\n\u00a0 \u00a0 \u00a0 \u00a0{\n\u00a0 \u00a0 \u00a0 \u00a0 client.print("On");\n\u00a0 \u00a0 \u00a0 \u00a0 }\u00a0\n\u00a0 \u00a0 \u00a0 \u00a0else\u00a0\n\u00a0 \u00a0 \u00a0 \u00a0{\n\u00a0 \u00a0 \u00a0 \u00a0client.print("Off");\n\u00a0 \u00a0 \u00a0 \u00a0}\nclient.println("<br><br>");\nclient.println("<a href=\\"\/LED=ON\\"\\"><button>Allumer <\/button><\/a>");\nclient.println("<a href=\\"\/LED=OFF\\"\\"><button>Eteindre <\/button><\/a><br \/>"); \nclient.println("<\/html>");\ndelay(1);\nSerial.println("Client deconnecter");\nSerial.println("");\n}<\/code><\/pre>\n<\/details>\n\n\n
      Ce que vous visualisez sur le monitor serial:<\/p>\n\n\n
      \"\"\/<\/figure>\n\n\n
      Vous avez qu’\u00e0 copier l’adresse l’URL dans un navigateur pour pouvoir afficher la page Web et contr\u00f4ler la LED<\/p>\n\n\n
      \"\"\/<\/figure>\n","protected":false},"excerpt":{"rendered":"
      Principe du Projet Contr\u00f4ler une LED depuis une page web avec le microcontr\u00f4leur ESP8266. Outils utilis\u00e9s LED ESP 8266 Principe de fonctionnement    La […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":6311,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-tutoriel","meta":{"footnotes":""},"class_list":["post-9476","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.association-ore.fr\/fr\/wp-json\/wp\/v2\/pages\/9476","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.association-ore.fr\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.association-ore.fr\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.association-ore.fr\/fr\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.association-ore.fr\/fr\/wp-json\/wp\/v2\/comments?post=9476"}],"version-history":[{"count":1,"href":"https:\/\/www.association-ore.fr\/fr\/wp-json\/wp\/v2\/pages\/9476\/revisions"}],"predecessor-version":[{"id":11476,"href":"https:\/\/www.association-ore.fr\/fr\/wp-json\/wp\/v2\/pages\/9476\/revisions\/11476"}],"up":[{"embeddable":true,"href":"https:\/\/www.association-ore.fr\/fr\/wp-json\/wp\/v2\/pages\/6311"}],"wp:attachment":[{"href":"https:\/\/www.association-ore.fr\/fr\/wp-json\/wp\/v2\/media?parent=9476"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}