Au cours des dernières années, l'ESP8266 a été une star grandissante parmi les projets liés à l'Internet des objets ou au WiFi. C’est un module WiFi extrêmement économique qui, moyennant un petit effort supplémentaire, peut être programmé pour construire un serveur web autonome. À quel point cela est cool!
"},{"id":"text-2","type":"text","heading":"","plain_text":"Qu'est-ce qu'un serveur Web et comment ça marche?\nLe serveur Web est un endroit qui stocke, traite et fournit des pages Web aux clients Web. Le client Web n'est rien d'autre qu'un navigateur Web sur nos ordinateurs portables et nos smartphones. La communication entre le client et le serveur s'effectue à l'aide d'un protocole spécial appelé HTTP (Hypertext Transfer Protocol).","html":"Qu'est-ce qu'un serveur Web et comment ça marche?\nLe serveur Web est un endroit qui stocke, traite et fournit des pages Web aux clients Web. Le client Web n'est rien d'autre qu'un navigateur Web sur nos ordinateurs portables et nos smartphones. La communication entre le client et le serveur s'effectue à l'aide d'un protocole spécial appelé HTTP (Hypertext Transfer Protocol).
"},{"id":"text-3","type":"text","heading":"","plain_text":"Dans ce protocole, un client initie la communication en faisant une demande pour une page Web spécifique via HTTP et le serveur répond avec le contenu de cette page Web ou un message d'erreur s'il ne peut pas le faire (comme avec la célèbre erreur 404). Les pages fournies par un serveur sont principalement des documents HTML.","html":"Dans ce protocole, un client initie la communication en faisant une demande pour une page Web spécifique via HTTP et le serveur répond avec le contenu de cette page Web ou un message d'erreur s'il ne peut pas le faire (comme avec la célèbre erreur 404). Les pages fournies par un serveur sont principalement des documents HTML.
"},{"id":"text-4","type":"text","heading":"","plain_text":"ESP8266 Modes de fonctionnement\nL’une des fonctionnalités les plus intéressantes de l’ESP8266 est qu’il ne peut pas uniquement se connecter à un réseau WiFi existant et agir en tant que serveur Web, il peut également configurer son propre réseau, ce qui permet aux autres appareils de s'y connecter directement et d'accéder aux pages Web. Cela est possible car l'ESP8266 peut fonctionner dans trois modes différents: mode Station, mode Soft Access Point, et les deux en même temps. Cela offre la possibilité de construire des réseaux maillés.\nMode Station (STA)\nL’ESP8266 qui se connecte à un réseau WiFi existant (créé par votre routeur sans fil) est appelé Gare (STA)","html":"ESP8266 Modes de fonctionnement\nL’une des fonctionnalités les plus intéressantes de l’ESP8266 est qu’il ne peut pas uniquement se connecter à un réseau WiFi existant et agir en tant que serveur Web, il peut également configurer son propre réseau, ce qui permet aux autres appareils de s'y connecter directement et d'accéder aux pages Web. Cela est possible car l'ESP8266 peut fonctionner dans trois modes différents: mode Station, mode Soft Access Point, et les deux en même temps. Cela offre la possibilité de construire des réseaux maillés.\nMode Station (STA)\nL’ESP8266 qui se connecte à un réseau WiFi existant (créé par votre routeur sans fil) est appelé Gare (STA)
"},{"id":"text-5","type":"text","heading":"","plain_text":"En mode STA, l'ESP8266 obtient l'IP du routeur sans fil auquel il est connecté. Avec cette adresse IP, il peut configurer un serveur Web et livrer des pages Web à tous les appareils connectés sous des systèmes existants Réseau WiFi.\nMode point d'accès logiciel (AP)\nL’ESP8266 qui crée son propre réseau WiFi et joue le rôle de concentrateur (tout comme un routeur WiFi) pour une ou plusieurs stations est appelé Point d'accès (AP). Contrairement au routeur WiFi, il n’a pas d’interface avec un réseau câblé. Donc, ce mode de fonctionnement s'appelle Point d'accès souple (soft-AP). De plus, le nombre maximal de stations pouvant s'y connecter est limité à cinq.","html":"En mode STA, l'ESP8266 obtient l'IP du routeur sans fil auquel il est connecté. Avec cette adresse IP, il peut configurer un serveur Web et livrer des pages Web à tous les appareils connectés sous des systèmes existants Réseau WiFi.\nMode point d'accès logiciel (AP)\nL’ESP8266 qui crée son propre réseau WiFi et joue le rôle de concentrateur (tout comme un routeur WiFi) pour une ou plusieurs stations est appelé Point d'accès (AP). Contrairement au routeur WiFi, il n’a pas d’interface avec un réseau câblé. Donc, ce mode de fonctionnement s'appelle Point d'accès souple (soft-AP). De plus, le nombre maximal de stations pouvant s'y connecter est limité à cinq.
"},{"id":"text-6","type":"text","heading":"","plain_text":"En mode AP, ESP8266 crée un nouveau réseau Wi-Fi et lui attribue le nom SSID (nom du réseau) et l'adresse IP. Avec cette adresse IP, il peut fournir des pages Web à tous les appareils connectés sous son propre réseau.\nCâblage – Connexion des voyants à l'ESP8266 NodeMCU\nMaintenant que nous connaissons les bases du fonctionnement du serveur Web et des modes dans lesquels l’ESP8266 peut créer un serveur Web, il est temps de connecter des voyants à l’ESP8266 NodeMCU que nous souhaitons contrôler via WiFi.\nCommencez par placer le NodeMCU sur votre planche à pain, en veillant à ce que chaque côté de la carte se trouve sur un côté distinct de la planche à pain. Ensuite, connectez deux voyants numériques GPIO D6 et D7 via une résistance de limitation de courant de 220Ω.\nLorsque vous avez terminé, vous devriez avoir quelque chose qui ressemble à l'illustration ci-dessous.\nCâblage des voyants sur l'ESP8266 NodeMCU\nConcept derrière le contrôle du serveur Web ESP8266\nAlors, vous vous demandez peut-être «Comment vais-je contrôler les choses à partir d’un serveur Web qui traite et ne livre que des pages Web?». Vous devez ensuite comprendre ce qui se passe dans l’arrière-plan.\nLorsque vous tapez une URL dans un navigateur Web et appuyez sur ENTRÉE, le navigateur envoie une demande HTTP (demande a.k.a. GET) à un serveur Web. C’est un travail de serveur Web de traiter cette demande en faisant quelque chose. Vous avez peut-être déjà compris que nous allons contrôler certaines choses en accédant à une URL spécifique. Par exemple, supposons que nous ayons entré une URL du type http://192.168.1.1/conduit sur dans un navigateur. Le navigateur envoie ensuite une requête HTTP à l'ESP8266 pour traiter cette requête. Lorsque l'ESP8266 lit cette demande, il sait que l'utilisateur souhaite allumer le voyant. Ainsi, il allume le voyant et envoie une page Web dynamique à un navigateur affichant Statut de la LED: ON Aussi facile que la tarte!\nESP8266 en tant que serveur HTTP utilisant le mode Point d'accès WiFi (AP)\nPassons maintenant aux choses intéressantes!\nComme le suggère l'en-tête, cet exemple montre comment transformer l'ESP8266 en point d'accès et servir des pages Web à tout client connecté. Pour commencer, branchez votre ESP8266 NodeMCU sur votre ordinateur et essayez l’esquisse; et ensuite nous allons le disséquer de manière assez détaillée.","html":"En mode AP, ESP8266 crée un nouveau réseau Wi-Fi et lui attribue le nom SSID (nom du réseau) et l'adresse IP. Avec cette adresse IP, il peut fournir des pages Web à tous les appareils connectés sous son propre réseau.\nCâblage – Connexion des voyants à l'ESP8266 NodeMCU\nMaintenant que nous connaissons les bases du fonctionnement du serveur Web et des modes dans lesquels l’ESP8266 peut créer un serveur Web, il est temps de connecter des voyants à l’ESP8266 NodeMCU que nous souhaitons contrôler via WiFi.\nCommencez par placer le NodeMCU sur votre planche à pain, en veillant à ce que chaque côté de la carte se trouve sur un côté distinct de la planche à pain. Ensuite, connectez deux voyants numériques GPIO D6 et D7 via une résistance de limitation de courant de 220Ω.\nLorsque vous avez terminé, vous devriez avoir quelque chose qui ressemble à l'illustration ci-dessous.\nCâblage des voyants sur l'ESP8266 NodeMCU\nConcept derrière le contrôle du serveur Web ESP8266\nAlors, vous vous demandez peut-être «Comment vais-je contrôler les choses à partir d’un serveur Web qui traite et ne livre que des pages Web?». Vous devez ensuite comprendre ce qui se passe dans l’arrière-plan.\nLorsque vous tapez une URL dans un navigateur Web et appuyez sur ENTRÉE, le navigateur envoie une demande HTTP (demande a.k.a. GET) à un serveur Web. C’est un travail de serveur Web de traiter cette demande en faisant quelque chose. Vous avez peut-être déjà compris que nous allons contrôler certaines choses en accédant à une URL spécifique. Par exemple, supposons que nous ayons entré une URL du type http://192.168.1.1/conduit sur dans un navigateur. Le navigateur envoie ensuite une requête HTTP à l'ESP8266 pour traiter cette requête. Lorsque l'ESP8266 lit cette demande, il sait que l'utilisateur souhaite allumer le voyant. Ainsi, il allume le voyant et envoie une page Web dynamique à un navigateur affichant Statut de la LED: ON Aussi facile que la tarte!\nESP8266 en tant que serveur HTTP utilisant le mode Point d'accès WiFi (AP)\nPassons maintenant aux choses intéressantes!\nComme le suggère l'en-tête, cet exemple montre comment transformer l'ESP8266 en point d'accès et servir des pages Web à tout client connecté. Pour commencer, branchez votre ESP8266 NodeMCU sur votre ordinateur et essayez l’esquisse; et ensuite nous allons le disséquer de manière assez détaillée.
"},{"id":"text-7","type":"text","heading":"","plain_text":"#comprendre","html":"#comprendre
"},{"id":"text-8","type":"text","heading":"","plain_text":"#comprendre","html":"#comprendre
"},{"id":"text-9","type":"text","heading":"","plain_text":"const carboniser* ssid = "NodeMCU"; \nconst carboniser* mot de passe = "12345678";","html":"const carboniser* ssid = "NodeMCU"; \nconst carboniser* mot de passe = "12345678";
"},{"id":"text-10","type":"text","heading":"","plain_text":"Adresse IP local_ip(192,168,1,1)\nAdresse IP passerelle(192,168,1,1)\nAdresse IP sous-réseau(255,255,255,0)","html":"Adresse IP local_ip(192,168,1,1)\nAdresse IP passerelle(192,168,1,1)\nAdresse IP sous-réseau(255,255,255,0)
"},{"id":"text-11","type":"text","heading":"","plain_text":"ESP8266WebServer serveur(80)","html":"ESP8266WebServer serveur(80)
"},{"id":"text-12","type":"text","heading":"","plain_text":"uint8_t LED1pin = D7;\nbool LED1status = LOW;","html":"uint8_t LED1pin = D7;\nbool LED1status = LOW;
"},{"id":"text-13","type":"text","heading":"","plain_text":"uint8_t LED2pin = D6;\nbool LED2status = LOW;","html":"uint8_t LED2pin = D6;\nbool LED2status = LOW;
"},{"id":"text-14","type":"text","heading":"","plain_text":"vide installer() \n En série.commencer(115200)\n pinMode(LED1pin, OUTPUT);\n pinMode(LED2pin, OUTPUT);","html":"vide installer() \n En série.commencer(115200)\n pinMode(LED1pin, OUTPUT);\n pinMode(LED2pin, OUTPUT);
"},{"id":"text-15","type":"text","heading":"","plain_text":" Wifi.softAP(ssid, mot de passe);\n Wifi.softAPConfig(local_ip, passerelle, sous-réseau);\n retard(100)\n \n serveur.sur("/", handle_OnConnect);\n serveur.sur("/ led1on", handle_led1on);\n serveur.sur("/ led1off", handle_led1off);\n serveur.sur("/ led2on", handle_led2on);\n serveur.sur("/ led2off", handle_led2off);\n serveur.onNotFound(handle_NotFound);\n \n serveur.commencer();\n En série.imprimer("Le serveur HTTP a commencé")","html":"Wifi.softAP(ssid, mot de passe);\n Wifi.softAPConfig(local_ip, passerelle, sous-réseau);\n retard(100)\n \n serveur.sur("/", handle_OnConnect);\n serveur.sur("/ led1on", handle_led1on);\n serveur.sur("/ led1off", handle_led1off);\n serveur.sur("/ led2on", handle_led2on);\n serveur.sur("/ led2off", handle_led2off);\n serveur.onNotFound(handle_NotFound);\n \n serveur.commencer();\n En série.imprimer("Le serveur HTTP a commencé")
"},{"id":"text-16","type":"text","heading":"","plain_text":"vide boucle() \n serveur.handleClient();\n si(LED1status)\n digitalWrite(LED1pin, HIGH);\n autre\n digitalWrite(LED1pin, BAS);\n \n si(LED2status)\n digitalWrite(LED2pin, HAUT);\n autre\n digitalWrite(LED2pin, BAS);","html":"vide boucle() \n serveur.handleClient();\n si(LED1status)\n digitalWrite(LED1pin, HIGH);\n autre\n digitalWrite(LED1pin, BAS);\n \n si(LED2status)\n digitalWrite(LED2pin, HAUT);\n autre\n digitalWrite(LED2pin, BAS);
"},{"id":"text-17","type":"text","heading":"","plain_text":"vide handle_OnConnect() \n LED1status = LOW;\n LED2status = LOW;\n En série.imprimer("Statut GPIO7: OFF","html":"vide handle_OnConnect() \n LED1status = LOW;\n LED2status = LOW;\n En série.imprimer("Statut GPIO7: OFF
"},{"id":"text-18","type":"text","heading":"","plain_text":"vide handle_led1on() \n LED1status = HIGH;\n En série.imprimer("Statut GPIO7: ON")\n serveur.envoyer(200, "text / html", SendHTML(true, LED2status));","html":"vide handle_led1on() \n LED1status = HIGH;\n En série.imprimer("Statut GPIO7: ON")\n serveur.envoyer(200, "text / html", SendHTML(true, LED2status));
"},{"id":"text-19","type":"text","heading":"","plain_text":"vide handle_led1off() \n LED1status = LOW;\n En série.imprimer("Statut GPIO7: OFF")\n serveur.envoyer(200, "text / html", SendHTML(false, LED2status));","html":"vide handle_led1off() \n LED1status = LOW;\n En série.imprimer("Statut GPIO7: OFF")\n serveur.envoyer(200, "text / html", SendHTML(false, LED2status));
"},{"id":"text-20","type":"text","heading":"","plain_text":"vide handle_led2on() \n LED2status = HIGH;\n En série.imprimer("Statut GPIO6: ON")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, true));","html":"vide handle_led2on() \n LED2status = HIGH;\n En série.imprimer("Statut GPIO6: ON")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, true));
"},{"id":"text-21","type":"text","heading":"","plain_text":"vide handle_led2off() \n LED2status = LOW;\n En série.imprimer("Statut GPIO6: OFF")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, false));","html":"vide handle_led2off() \n LED2status = LOW;\n En série.imprimer("Statut GPIO6: OFF")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, false));
"},{"id":"text-22","type":"text","heading":"","plain_text":"vide handle_NotFound() \n serveur.envoyer(404, "texte simple", "Pas trouvé")","html":"vide handle_NotFound() \n serveur.envoyer(404, "texte simple", "Pas trouvé")
"},{"id":"text-23","type":"text","heading":"","plain_text":"Chaîne SendHTML(uint8_t led1stat, uint8_t led2stat) \n String ptr = " n ";\n ptr + =" n ";\n ptr + ="Contrôle LED n ";\n ptr + =" n ";\n ptr + =" n ";\n ptr + =" n ";\n ptr + ="Serveur Web ESP8266 n ";\n ptr + ="Utilisation du mode Point d'accès n ";\n \n si(led1stat)\n ptr + ="Statut LED1: alluméDE n ";\n autre\n ptr + ="LED1 Statut: OFFSUR n ";","html":"Chaîne SendHTML(uint8_t led1stat, uint8_t led2stat) \n String ptr = " n ";\n ptr + =" n ";\n ptr + ="Contrôle LED n ";\n ptr + =" n ";\n ptr + =" n ";\n ptr + =" n ";\n ptr + ="Serveur Web ESP8266 n ";\n ptr + ="Utilisation du mode Point d'accès n ";\n \n si(led1stat)\n ptr + ="Statut LED1: alluméDE n ";\n autre\n ptr + ="LED1 Statut: OFFSUR n ";
"},{"id":"text-24","type":"text","heading":"","plain_text":"si(led2stat)\n ptr + ="Statut LED2: alluméDE n ";\n autre\n ptr + ="LED2 Statut: OFFSUR n ";","html":"si(led2stat)\n ptr + ="Statut LED2: alluméDE n ";\n autre\n ptr + ="LED2 Statut: OFFSUR n ";
"},{"id":"text-25","type":"text","heading":"","plain_text":" ptr + =" n ";\n ptr + =" n ";\n revenir ptr;","html":"ptr + =" n ";\n ptr + =" n ";\n revenir ptr;
"},{"id":"text-26","type":"text","heading":"","plain_text":"Accéder au serveur Web en mode AP\nAprès avoir téléchargé l'esquisse, ouvrez le moniteur série à une vitesse de transmission de 115200 bauds. Appuyez ensuite sur le bouton RESET de l'ESP8266. Si tout va bien, ça va montrer Serveur HTTP démarré message.","html":"Accéder au serveur Web en mode AP\nAprès avoir téléchargé l'esquisse, ouvrez le moniteur série à une vitesse de transmission de 115200 bauds. Appuyez ensuite sur le bouton RESET de l'ESP8266. Si tout va bien, ça va montrer Serveur HTTP démarré message.
"},{"id":"text-27","type":"text","heading":"","plain_text":"Ensuite, recherchez tout périphérique que vous pouvez connecter à un réseau WiFi – téléphone, ordinateur portable, etc. Et recherchez un réseau appelé NodeMCU. Rejoindre le réseau avec mot de passe 123456789.","html":"Ensuite, recherchez tout périphérique que vous pouvez connecter à un réseau WiFi – téléphone, ordinateur portable, etc. Et recherchez un réseau appelé NodeMCU. Rejoindre le réseau avec mot de passe 123456789.
"},{"id":"text-28","type":"text","heading":"","plain_text":"Après vous être connecté à votre réseau NodeMCU AP, chargez un navigateur et pointez-le sur 192.168.1.1. Le NodeMCU devrait afficher une page Web indiquant l’état actuel des voyants et deux boutons pour les contrôler. Si vous regardez simultanément le moniteur série, vous pouvez voir l’état des broches GPIO de NodeMCU.","html":"Après vous être connecté à votre réseau NodeMCU AP, chargez un navigateur et pointez-le sur 192.168.1.1. Le NodeMCU devrait afficher une page Web indiquant l’état actuel des voyants et deux boutons pour les contrôler. Si vous regardez simultanément le moniteur série, vous pouvez voir l’état des broches GPIO de NodeMCU.
"},{"id":"text-29","type":"text","heading":"","plain_text":"Maintenant, cliquez sur le bouton pour allumer LED1 tout en gardant un œil sur l'URL. Une fois que vous avez cliqué sur le bouton, l’ESP8266 reçoit une demande de / led1on URL Il allume ensuite la LED1 et alimente une page Web dont le statut de la LED est mis à jour. Il imprime également l’état de la broche GPIO sur le moniteur série.","html":"Maintenant, cliquez sur le bouton pour allumer LED1 tout en gardant un œil sur l'URL. Une fois que vous avez cliqué sur le bouton, l’ESP8266 reçoit une demande de / led1on URL Il allume ensuite la LED1 et alimente une page Web dont le statut de la LED est mis à jour. Il imprime également l’état de la broche GPIO sur le moniteur série.
"},{"id":"text-30","type":"text","heading":"","plain_text":"Vous pouvez tester le bouton LED2 et vérifier qu’il fonctionne de la même manière.\nExaminons maintenant le code de plus près pour voir comment il fonctionne, afin que vous puissiez le modifier pour répondre à vos besoins.\nExplication détaillée du code\nL'esquisse commence par inclure la bibliothèque ESP8266WiFi.h. Cette bibliothèque fournit les méthodes WiFi spécifiques à ESP8266 que nous appelons pour se connecter au réseau. Ensuite, nous incluons également la bibliothèque ESP8266WebServer.h, qui propose certaines méthodes qui nous aideront à configurer un serveur et à gérer les demandes HTTP entrantes sans avoir à s’inquiéter des détails de mise en œuvre de bas niveau.","html":"Vous pouvez tester le bouton LED2 et vérifier qu’il fonctionne de la même manière.\nExaminons maintenant le code de plus près pour voir comment il fonctionne, afin que vous puissiez le modifier pour répondre à vos besoins.\nExplication détaillée du code\nL'esquisse commence par inclure la bibliothèque ESP8266WiFi.h. Cette bibliothèque fournit les méthodes WiFi spécifiques à ESP8266 que nous appelons pour se connecter au réseau. Ensuite, nous incluons également la bibliothèque ESP8266WebServer.h, qui propose certaines méthodes qui nous aideront à configurer un serveur et à gérer les demandes HTTP entrantes sans avoir à s’inquiéter des détails de mise en œuvre de bas niveau.
"},{"id":"text-31","type":"text","heading":"","plain_text":"#comprendre","html":"#comprendre
"},{"id":"text-32","type":"text","heading":"","plain_text":"#comprendre","html":"#comprendre
"},{"id":"text-33","type":"text","heading":"","plain_text":"Comme nous configurons l’ESP8266 NodeMCU en mode Point d’accès, un réseau WiFi sera créé. Par conséquent, nous devons définir son SSID, son mot de passe, son adresse IP, son masque de sous-réseau IP et sa passerelle IP.","html":"Comme nous configurons l’ESP8266 NodeMCU en mode Point d’accès, un réseau WiFi sera créé. Par conséquent, nous devons définir son SSID, son mot de passe, son adresse IP, son masque de sous-réseau IP et sa passerelle IP.
"},{"id":"text-34","type":"text","heading":"","plain_text":"const carboniser* ssid = "NodeMCU"; \nconst carboniser* mot de passe = "12345678";","html":"const carboniser* ssid = "NodeMCU"; \nconst carboniser* mot de passe = "12345678";
"},{"id":"text-35","type":"text","heading":"","plain_text":"Adresse IP local_ip(192,168,1,1)\nAdresse IP passerelle(192,168,1,1)\nAdresse IP sous-réseau(255,255,255,0)","html":"Adresse IP local_ip(192,168,1,1)\nAdresse IP passerelle(192,168,1,1)\nAdresse IP sous-réseau(255,255,255,0)
"},{"id":"text-36","type":"text","heading":"","plain_text":"Ensuite, nous déclarons un objet de la bibliothèque ESP8266WebServer afin de pouvoir accéder à ses fonctions. Le constructeur de cet objet prend le port (où le serveur écoutera) en tant que paramètre. Comme 80 est le port par défaut pour HTTP, nous utiliserons cette valeur. Vous pouvez maintenant accéder au serveur sans avoir besoin de spécifier le port dans l'URL.","html":"Ensuite, nous déclarons un objet de la bibliothèque ESP8266WebServer afin de pouvoir accéder à ses fonctions. Le constructeur de cet objet prend le port (où le serveur écoutera) en tant que paramètre. Comme 80 est le port par défaut pour HTTP, nous utiliserons cette valeur. Vous pouvez maintenant accéder au serveur sans avoir besoin de spécifier le port dans l'URL.
"},{"id":"text-37","type":"text","heading":"","plain_text":"ESP8266WebServer serveur(80)","html":"ESP8266WebServer serveur(80)
"},{"id":"text-38","type":"text","heading":"","plain_text":"Ensuite, nous déclarons les broches GPIO de NodeMCU auxquelles les voyants sont connectés et leur état initial.","html":"Ensuite, nous déclarons les broches GPIO de NodeMCU auxquelles les voyants sont connectés et leur état initial.
"},{"id":"text-39","type":"text","heading":"","plain_text":"uint8_t LED1pin = D7;\nbool LED1status = LOW;","html":"uint8_t LED1pin = D7;\nbool LED1status = LOW;
"},{"id":"text-40","type":"text","heading":"","plain_text":"uint8_t LED2pin = D6;\nbool LED2status = LOW;","html":"uint8_t LED2pin = D6;\nbool LED2status = LOW;
"},{"id":"text-41","type":"text","heading":"","plain_text":"Dans la fonction Setup ()\nNous configurons notre serveur HTTP avant de l'exécuter. Tout d'abord, nous ouvrons une connexion série à des fins de débogage et définissons les ports GPIO sur OUTPUT.","html":"Dans la fonction Setup ()\nNous configurons notre serveur HTTP avant de l'exécuter. Tout d'abord, nous ouvrons une connexion série à des fins de débogage et définissons les ports GPIO sur OUTPUT.
"},{"id":"text-42","type":"text","heading":"","plain_text":"En série.commencer(115200)\npinMode(LED1pin, OUTPUT);\npinMode(LED2pin, OUTPUT);","html":"En série.commencer(115200)\npinMode(LED1pin, OUTPUT);\npinMode(LED2pin, OUTPUT);
"},{"id":"text-43","type":"text","heading":"","plain_text":"Ensuite, nous avons configuré un point d'accès logiciel pour établir un réseau Wi-Fi en prouvant le SSID, le mot de passe, l'adresse IP, le masque de sous-réseau IP et la passerelle IP.","html":"Ensuite, nous avons configuré un point d'accès logiciel pour établir un réseau Wi-Fi en prouvant le SSID, le mot de passe, l'adresse IP, le masque de sous-réseau IP et la passerelle IP.
"},{"id":"text-44","type":"text","heading":"","plain_text":"Wifi.softAP(ssid, mot de passe);\nWifi.softAPConfig(local_ip, passerelle, sous-réseau);\nretard(100)","html":"Wifi.softAP(ssid, mot de passe);\nWifi.softAPConfig(local_ip, passerelle, sous-réseau);\nretard(100)
"},{"id":"text-45","type":"text","heading":"","plain_text":"Afin de gérer les requêtes HTTP entrantes, nous devons spécifier le code à exécuter lorsqu'une URL particulière est atteinte. Pour ce faire, nous utilisons la méthode. Cette méthode prend deux paramètres. Le premier est un chemin d'URL et le second est le nom de la fonction que nous voulons exécuter lorsque cette URL est atteinte.\nPar exemple, la première ligne de l'extrait de code ci-dessous indique que lorsqu'un serveur reçoit une requête HTTP à la racine (/) chemin, il déclenchera le handle_OnConnect () une fonction. Notez que l'URL spécifiée est un chemin relatif.\nDe même, nous devons spécifier 4 URL supplémentaires pour gérer deux états de 2 LED.","html":"Afin de gérer les requêtes HTTP entrantes, nous devons spécifier le code à exécuter lorsqu'une URL particulière est atteinte. Pour ce faire, nous utilisons la méthode. Cette méthode prend deux paramètres. Le premier est un chemin d'URL et le second est le nom de la fonction que nous voulons exécuter lorsque cette URL est atteinte.\nPar exemple, la première ligne de l'extrait de code ci-dessous indique que lorsqu'un serveur reçoit une requête HTTP à la racine (/) chemin, il déclenchera le handle_OnConnect () une fonction. Notez que l'URL spécifiée est un chemin relatif.\nDe même, nous devons spécifier 4 URL supplémentaires pour gérer deux états de 2 LED.
"},{"id":"text-46","type":"text","heading":"","plain_text":"serveur.sur("/", handle_OnConnect);\nserveur.sur("/ led1on", handle_led1on);\nserveur.sur("/ led1off", handle_led1off);\nserveur.sur("/ led2on", handle_led2on);\nserveur.sur("/ led2off", handle_led2off);","html":"serveur.sur("/", handle_OnConnect);\nserveur.sur("/ led1on", handle_led1on);\nserveur.sur("/ led1off", handle_led1off);\nserveur.sur("/ led2on", handle_led2on);\nserveur.sur("/ led2off", handle_led2off);
"},{"id":"text-47","type":"text","heading":"","plain_text":"Nous n'avons pas spécifié ce que le serveur devrait faire si le client demande une URL autre que celle spécifiée avec server.on () . Il devrait répondre avec un statut HTTP 404 (non trouvé) et un message pour l'utilisateur. Nous mettons cela dans une fonction aussi, et utilisons server.onNotFound () pour lui dire qu'il doit l'exécuter lorsqu'il reçoit une demande pour un URI non spécifié avec server.on","html":"Nous n'avons pas spécifié ce que le serveur devrait faire si le client demande une URL autre que celle spécifiée avec server.on () . Il devrait répondre avec un statut HTTP 404 (non trouvé) et un message pour l'utilisateur. Nous mettons cela dans une fonction aussi, et utilisons server.onNotFound () pour lui dire qu'il doit l'exécuter lorsqu'il reçoit une demande pour un URI non spécifié avec server.on
"},{"id":"text-48","type":"text","heading":"","plain_text":"serveur.onNotFound(handle_NotFound);","html":"serveur.onNotFound(handle_NotFound);
"},{"id":"text-49","type":"text","heading":"","plain_text":"Maintenant, pour démarrer notre serveur, nous appelons la méthode begin sur l’objet serveur.","html":"Maintenant, pour démarrer notre serveur, nous appelons la méthode begin sur l’objet serveur.
"},{"id":"text-50","type":"text","heading":"","plain_text":"serveur.commencer();\nEn série.imprimer("Le serveur HTTP a commencé")","html":"serveur.commencer();\nEn série.imprimer("Le serveur HTTP a commencé")
"},{"id":"text-51","type":"text","heading":"","plain_text":"Boucle intérieure ()\nPour gérer les requêtes HTTP entrantes réelles, nous devons appeler le handleClient () méthode sur l'objet serveur. Nous changeons également l'état de la LED selon la demande.","html":"Boucle intérieure ()\nPour gérer les requêtes HTTP entrantes réelles, nous devons appeler le handleClient () méthode sur l'objet serveur. Nous changeons également l'état de la LED selon la demande.
"},{"id":"text-52","type":"text","heading":"","plain_text":"vide boucle() \n serveur.handleClient();\n si(LED1status)\n digitalWrite(LED1pin, HIGH);\n autre\n digitalWrite(LED1pin, BAS);\n \n si(LED2status)\n digitalWrite(LED2pin, HAUT);\n autre\n digitalWrite(LED2pin, BAS);","html":"vide boucle() \n serveur.handleClient();\n si(LED1status)\n digitalWrite(LED1pin, HIGH);\n autre\n digitalWrite(LED1pin, BAS);\n \n si(LED2status)\n digitalWrite(LED2pin, HAUT);\n autre\n digitalWrite(LED2pin, BAS);
"},{"id":"text-53","type":"text","heading":"","plain_text":"Ensuite, nous devons créer une fonction que nous avons attachée à l’URL racine (/) avec server.on. Rappelles toi? Au début de cette fonction, nous définissons l’état des deux voyants sur LOW (état initial des voyants) et l’imprimons sur un moniteur série. Afin de répondre à la requête HTTP, nous utilisons la méthode send. Bien que la méthode puisse être appelée avec un jeu d'arguments différent, sa forme la plus simple consiste en le code de réponse HTTP, le type de contenu et le contenu.\nDans notre cas, nous envoyons le code 200 (un des codes d’état HTTP), qui correspond à la D'accord réponse. Ensuite, nous spécifions le type de contenu comme "text / html", et finalement nous appelons SendHTML () fonction personnalisée qui crée une page HTML dynamique contenant l’état des voyants.","html":"Ensuite, nous devons créer une fonction que nous avons attachée à l’URL racine (/) avec server.on. Rappelles toi? Au début de cette fonction, nous définissons l’état des deux voyants sur LOW (état initial des voyants) et l’imprimons sur un moniteur série. Afin de répondre à la requête HTTP, nous utilisons la méthode send. Bien que la méthode puisse être appelée avec un jeu d'arguments différent, sa forme la plus simple consiste en le code de réponse HTTP, le type de contenu et le contenu.\nDans notre cas, nous envoyons le code 200 (un des codes d’état HTTP), qui correspond à la D'accord réponse. Ensuite, nous spécifions le type de contenu comme "text / html", et finalement nous appelons SendHTML () fonction personnalisée qui crée une page HTML dynamique contenant l’état des voyants.
"},{"id":"text-54","type":"text","heading":"","plain_text":"vide handle_OnConnect()","html":"vide handle_OnConnect()
"},{"id":"text-55","type":"text","heading":"","plain_text":" LED1status = LOW;\n LED2status = LOW;\n En série.imprimer("Statut GPIO7: OFF","html":"LED1status = LOW;\n LED2status = LOW;\n En série.imprimer("Statut GPIO7: OFF
"},{"id":"text-56","type":"text","heading":"","plain_text":"De même, nous devons créer quatre fonctions pour gérer les demandes de LED On / Off et la page 404 Error.","html":"De même, nous devons créer quatre fonctions pour gérer les demandes de LED On / Off et la page 404 Error.
"},{"id":"text-57","type":"text","heading":"","plain_text":"vide handle_led1on() \n LED1status = HIGH;\n En série.imprimer("Statut GPIO7: ON")\n serveur.envoyer(200, "text / html", SendHTML(true, LED2status));","html":"vide handle_led1on() \n LED1status = HIGH;\n En série.imprimer("Statut GPIO7: ON")\n serveur.envoyer(200, "text / html", SendHTML(true, LED2status));
"},{"id":"text-58","type":"text","heading":"","plain_text":"vide handle_led1off() \n LED1status = LOW;\n En série.imprimer("Statut GPIO7: OFF")\n serveur.envoyer(200, "text / html", SendHTML(false, LED2status));","html":"vide handle_led1off() \n LED1status = LOW;\n En série.imprimer("Statut GPIO7: OFF")\n serveur.envoyer(200, "text / html", SendHTML(false, LED2status));
"},{"id":"text-59","type":"text","heading":"","plain_text":"vide handle_led2on() \n LED2status = HIGH;\n En série.imprimer("Statut GPIO6: ON")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, true));","html":"vide handle_led2on() \n LED2status = HIGH;\n En série.imprimer("Statut GPIO6: ON")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, true));
"},{"id":"text-60","type":"text","heading":"","plain_text":"vide handle_led2off() \n LED2status = LOW;\n En série.imprimer("Statut GPIO6: OFF")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, false));","html":"vide handle_led2off() \n LED2status = LOW;\n En série.imprimer("Statut GPIO6: OFF")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, false));
"},{"id":"text-61","type":"text","heading":"","plain_text":"vide handle_NotFound() \n serveur.envoyer(404, "texte simple", "Pas trouvé")","html":"vide handle_NotFound() \n serveur.envoyer(404, "texte simple", "Pas trouvé")
"},{"id":"text-62","type":"text","heading":"","plain_text":"Affichage de la page Web HTML\nSendHTML () Cette fonction est chargée de générer une page Web chaque fois que le serveur Web ESP8266 reçoit une demande d’un client Web. Il concatène simplement le code HTML dans une grosse chaîne et retourne à la server.send () fonction nous avons discuté plus tôt. La fonction prend le statut des voyants en tant que paramètre pour générer dynamiquement le contenu HTML.\nLe premier texte que vous devriez toujours envoyer est le déclaration qui indique que nous envoyons du code HTML.","html":"Affichage de la page Web HTML\nSendHTML () Cette fonction est chargée de générer une page Web chaque fois que le serveur Web ESP8266 reçoit une demande d’un client Web. Il concatène simplement le code HTML dans une grosse chaîne et retourne à la server.send () fonction nous avons discuté plus tôt. La fonction prend le statut des voyants en tant que paramètre pour générer dynamiquement le contenu HTML.\nLe premier texte que vous devriez toujours envoyer est le déclaration qui indique que nous envoyons du code HTML.
"},{"id":"text-63","type":"text","heading":"","plain_text":"Chaîne SendHTML(uint8_t led1stat, uint8_t led2stat) {\nString ptr = " n ";","html":"Chaîne SendHTML(uint8_t led1stat, uint8_t led2stat) {\nString ptr = " n ";
"},{"id":"text-64","type":"text","heading":"","plain_text":"Ensuite, le L'élément viewport rend la page Web réactive dans n'importe quel navigateur Web. Alors que title tag définit le titre de la page.","html":"Ensuite, le L'élément viewport rend la page Web réactive dans n'importe quel navigateur Web. Alors que title tag définit le titre de la page.
"},{"id":"text-65","type":"text","heading":"","plain_text":"ptr + =" n ";\nptr + ="Contrôle LED n ";","html":"ptr + =" n ";\nptr + ="Contrôle LED n ";
"},{"id":"text-66","type":"text","heading":"","plain_text":"Styliser la page Web\nEnsuite, nous avons du style CSS pour styliser les boutons et l’apparence de la page Web. Nous choisissons la police Helvetica, définissons le contenu à afficher en tant que bloc en ligne et aligné au centre.","html":"Styliser la page Web\nEnsuite, nous avons du style CSS pour styliser les boutons et l’apparence de la page Web. Nous choisissons la police Helvetica, définissons le contenu à afficher en tant que bloc en ligne et aligné au centre.
"},{"id":"text-67","type":"text","heading":"","plain_text":"ptr + =" n ";\n ptr + =" n ";\n ptr + =" n ";\n ptr + ="Serveur Web ESP8266 n ";\n ptr + ="Utilisation du mode station (STA) n ";\n \n si(led1stat)\n ptr + ="Statut LED1: alluméDE n ";\n autre\n ptr + ="LED1 Statut: OFFSUR n ";","html":"ptr + =" n ";\n ptr + =" n ";\n ptr + =" n ";\n ptr + ="Serveur Web ESP8266 n ";\n ptr + ="Utilisation du mode station (STA) n ";\n \n si(led1stat)\n ptr + ="Statut LED1: alluméDE n ";\n autre\n ptr + ="LED1 Statut: OFFSUR n ";
"},{"id":"text-68","type":"text","heading":"","plain_text":"si(led2stat)\n ptr + ="Statut LED2: alluméDE n ";\n autre\n ptr + ="LED2 Statut: OFFSUR n ";","html":"si(led2stat)\n ptr + ="Statut LED2: alluméDE n ";\n autre\n ptr + ="LED2 Statut: OFFSUR n ";
"},{"id":"text-69","type":"text","heading":"","plain_text":" ptr + =" n ";\n ptr + =" n ";\n revenir ptr;","html":"ptr + =" n ";\n ptr + =" n ";\n revenir ptr;
"},{"id":"text-70","type":"text","heading":"","plain_text":"Accéder au serveur Web en mode STA\nAprès avoir téléchargé l'esquisse, ouvrez le moniteur série à une vitesse de transmission de 115200 bauds. Appuyez ensuite sur le bouton RESET de l'ESP8266. Si tout va bien, l’adresse IP dynamique obtenue à partir de votre routeur sera affichée. Serveur HTTP démarré message.","html":"Accéder au serveur Web en mode STA\nAprès avoir téléchargé l'esquisse, ouvrez le moniteur série à une vitesse de transmission de 115200 bauds. Appuyez ensuite sur le bouton RESET de l'ESP8266. Si tout va bien, l’adresse IP dynamique obtenue à partir de votre routeur sera affichée. Serveur HTTP démarré message.
"},{"id":"text-71","type":"text","heading":"","plain_text":"Ensuite, chargez un navigateur et pointez-le sur l'adresse IP indiquée sur le moniteur série. Le NodeMCU devrait afficher une page Web indiquant l’état actuel des voyants et deux boutons pour les contrôler. Si vous regardez simultanément le moniteur série, vous pouvez voir l’état des broches GPIO de NodeMCU.","html":"Ensuite, chargez un navigateur et pointez-le sur l'adresse IP indiquée sur le moniteur série. Le NodeMCU devrait afficher une page Web indiquant l’état actuel des voyants et deux boutons pour les contrôler. Si vous regardez simultanément le moniteur série, vous pouvez voir l’état des broches GPIO de NodeMCU.
"},{"id":"text-72","type":"text","heading":"","plain_text":"Maintenant, cliquez sur le bouton pour allumer LED1 tout en gardant un œil sur l'URL. Une fois que vous avez cliqué sur le bouton, l’ESP8266 reçoit une demande de / led1on URL Il allume ensuite la LED1 et alimente une page Web dont le statut de la LED est mis à jour. Il imprime également l’état de la broche GPIO sur le moniteur série.","html":"Maintenant, cliquez sur le bouton pour allumer LED1 tout en gardant un œil sur l'URL. Une fois que vous avez cliqué sur le bouton, l’ESP8266 reçoit une demande de / led1on URL Il allume ensuite la LED1 et alimente une page Web dont le statut de la LED est mis à jour. Il imprime également l’état de la broche GPIO sur le moniteur série.
"},{"id":"text-73","type":"text","heading":"","plain_text":"Vous pouvez tester le bouton LED2 et vérifier qu’il fonctionne de la même manière.\nExplication du code\nSi vous observez ce code avec le code précédent, la seule différence est que nous ne définissons pas le point d'accès logiciel, mais que nous rejoignons un réseau existant à l'aide de WiFi.begin () une fonction.","html":"Vous pouvez tester le bouton LED2 et vérifier qu’il fonctionne de la même manière.\nExplication du code\nSi vous observez ce code avec le code précédent, la seule différence est que nous ne définissons pas le point d'accès logiciel, mais que nous rejoignons un réseau existant à l'aide de WiFi.begin () une fonction.
"},{"id":"text-74","type":"text","heading":"","plain_text":"Wifi.commencer(ssid, mot de passe);","html":"Wifi.commencer(ssid, mot de passe);
"},{"id":"text-75","type":"text","heading":"","plain_text":"Bien que l’ESP8266 tente de se connecter au réseau, nous pouvons vérifier l’état de la connectivité avec État WiFi () une fonction","html":"Bien que l’ESP8266 tente de se connecter au réseau, nous pouvons vérifier l’état de la connectivité avec État WiFi () une fonction
"},{"id":"text-76","type":"text","heading":"","plain_text":"tandis que (Wifi.statut()! = WL_CONNECTED) \n retard(1000)\n En série.impression(".")\n ","html":"tandis que (Wifi.statut()! = WL_CONNECTED) \n retard(1000)\n En série.impression(".")\n
"},{"id":"text-77","type":"text","heading":"","plain_text":"Juste pour votre information, cette fonction renvoie les états suivants:","html":"Juste pour votre information, cette fonction renvoie les états suivants:
"},{"id":"text-78","type":"text","heading":"","plain_text":"WL_CONNECTED: attribué lors de la connexion à un réseau Wi-Fi\nWL_NO_SHIELD: attribué quand aucun bouclier Wi-Fi n'est présent\nWL_IDLE_STATUS: un statut temporaire attribué lors de l'appel de WiFi.Begin () et reste actif jusqu'à l'expiration du nombre de tentatives (entraînant WL_CONNECT_FAILED) ou jusqu'à ce qu'une connexion soit établie (entraînant WL_CONNECTED)\nWL_NO_SSID_AVAIL: assigné quand aucun SSID n'est disponible\nWL_SCAN_COMPLETED: assigné à la fin de l'analyse des réseaux\nWL_CONNECT_FAILED: assigné quand la connexion échoue pour toutes les tentatives\nWL_CONNECTION_LOST: assigné quand la connexion est perdue\nWL_DISCONNECTED: assigné quand déconnecté d'un réseau","html":"WL_CONNECTED: attribué lors de la connexion à un réseau Wi-Fi\nWL_NO_SHIELD: attribué quand aucun bouclier Wi-Fi n'est présent\nWL_IDLE_STATUS: un statut temporaire attribué lors de l'appel de WiFi.Begin () et reste actif jusqu'à l'expiration du nombre de tentatives (entraînant WL_CONNECT_FAILED) ou jusqu'à ce qu'une connexion soit établie (entraînant WL_CONNECTED)\nWL_NO_SSID_AVAIL: assigné quand aucun SSID n'est disponible\nWL_SCAN_COMPLETED: assigné à la fin de l'analyse des réseaux\nWL_CONNECT_FAILED: assigné quand la connexion échoue pour toutes les tentatives\nWL_CONNECTION_LOST: assigné quand la connexion est perdue\nWL_DISCONNECTED: assigné quand déconnecté d'un réseau
"},{"id":"text-79","type":"text","heading":"","plain_text":"Une fois que l’ESP8266 est connecté au réseau, l’esquisse imprime l’adresse IP attribuée à l’ESP8266 en affichant WiFi.localIP () valeur sur le moniteur série.","html":"Une fois que l’ESP8266 est connecté au réseau, l’esquisse imprime l’adresse IP attribuée à l’ESP8266 en affichant WiFi.localIP () valeur sur le moniteur série.
"},{"id":"text-80","type":"text","heading":"","plain_text":"En série.imprimer("")\nEn série.imprimer("WiFi connecté ..!")\nEn série.impression("Vous avez une adresse IP:") En série.imprimer(Wifi.localIP());","html":"En série.imprimer("")\nEn série.imprimer("WiFi connecté ..!")\nEn série.impression("Vous avez une adresse IP:") En série.imprimer(Wifi.localIP());
"},{"id":"text-81","type":"text","heading":"","plain_text":"La seule différence entre les modes AP et STA est que l'un crée le réseau et l'autre se joint au réseau existant. Ainsi, le reste du code permettant de gérer les demandes HTTP et de servir une page Web en mode STA est identique à celui du mode AP expliqué ci-dessus. Ceci comprend:","html":"La seule différence entre les modes AP et STA est que l'un crée le réseau et l'autre se joint au réseau existant. Ainsi, le reste du code permettant de gérer les demandes HTTP et de servir une page Web en mode STA est identique à celui du mode AP expliqué ci-dessus. Ceci comprend:
"},{"id":"text-82","type":"text","heading":"","plain_text":"Déclaration des broches GPIO de NodeMCU auxquelles des voyants sont connectés\nDéfinir plusieurs méthodes server.on () pour gérer les requêtes HTTP entrantes\nDéfinition de la méthode server.onNotFound () pour gérer l'erreur HTTP 404\nCréation de fonctions personnalisées exécutées lorsque des URL spécifiques sont touchées\nCréation de page HTML\nStyliser la page Web\nCréation de boutons et affichage de leur statut","html":"Déclaration des broches GPIO de NodeMCU auxquelles des voyants sont connectés\nDéfinir plusieurs méthodes server.on () pour gérer les requêtes HTTP entrantes\nDéfinition de la méthode server.onNotFound () pour gérer l'erreur HTTP 404\nCréation de fonctions personnalisées exécutées lorsque des URL spécifiques sont touchées\nCréation de page HTML\nStyliser la page Web\nCréation de boutons et affichage de leur statut
"},{"id":"text-83","type":"text","heading":"","plain_text":"Click to rate this post!\n \n [Total: 0 Average: 0]","html":"Click to rate this post!\n \n [Total: 0 Average: 0]
"}],"sections":[{"id":"text-1","heading":"Text","content":"Au cours des dernières années, l'ESP8266 a été une star grandissante parmi les projets liés à l'Internet des objets ou au WiFi. C’est un module WiFi extrêmement économique qui, moyennant un petit effort supplémentaire, peut être programmé pour construire un serveur web autonome. À quel point cela est cool!"},{"id":"text-2","heading":"Text","content":"Qu'est-ce qu'un serveur Web et comment ça marche?\nLe serveur Web est un endroit qui stocke, traite et fournit des pages Web aux clients Web. Le client Web n'est rien d'autre qu'un navigateur Web sur nos ordinateurs portables et nos smartphones. La communication entre le client et le serveur s'effectue à l'aide d'un protocole spécial appelé HTTP (Hypertext Transfer Protocol)."},{"id":"text-3","heading":"Text","content":"Dans ce protocole, un client initie la communication en faisant une demande pour une page Web spécifique via HTTP et le serveur répond avec le contenu de cette page Web ou un message d'erreur s'il ne peut pas le faire (comme avec la célèbre erreur 404). Les pages fournies par un serveur sont principalement des documents HTML."},{"id":"text-4","heading":"Text","content":"ESP8266 Modes de fonctionnement\nL’une des fonctionnalités les plus intéressantes de l’ESP8266 est qu’il ne peut pas uniquement se connecter à un réseau WiFi existant et agir en tant que serveur Web, il peut également configurer son propre réseau, ce qui permet aux autres appareils de s'y connecter directement et d'accéder aux pages Web. Cela est possible car l'ESP8266 peut fonctionner dans trois modes différents: mode Station, mode Soft Access Point, et les deux en même temps. Cela offre la possibilité de construire des réseaux maillés.\nMode Station (STA)\nL’ESP8266 qui se connecte à un réseau WiFi existant (créé par votre routeur sans fil) est appelé Gare (STA)"},{"id":"text-5","heading":"Text","content":"En mode STA, l'ESP8266 obtient l'IP du routeur sans fil auquel il est connecté. Avec cette adresse IP, il peut configurer un serveur Web et livrer des pages Web à tous les appareils connectés sous des systèmes existants Réseau WiFi.\nMode point d'accès logiciel (AP)\nL’ESP8266 qui crée son propre réseau WiFi et joue le rôle de concentrateur (tout comme un routeur WiFi) pour une ou plusieurs stations est appelé Point d'accès (AP). Contrairement au routeur WiFi, il n’a pas d’interface avec un réseau câblé. Donc, ce mode de fonctionnement s'appelle Point d'accès souple (soft-AP). De plus, le nombre maximal de stations pouvant s'y connecter est limité à cinq."},{"id":"text-6","heading":"Text","content":"En mode AP, ESP8266 crée un nouveau réseau Wi-Fi et lui attribue le nom SSID (nom du réseau) et l'adresse IP. Avec cette adresse IP, il peut fournir des pages Web à tous les appareils connectés sous son propre réseau.\nCâblage – Connexion des voyants à l'ESP8266 NodeMCU\nMaintenant que nous connaissons les bases du fonctionnement du serveur Web et des modes dans lesquels l’ESP8266 peut créer un serveur Web, il est temps de connecter des voyants à l’ESP8266 NodeMCU que nous souhaitons contrôler via WiFi.\nCommencez par placer le NodeMCU sur votre planche à pain, en veillant à ce que chaque côté de la carte se trouve sur un côté distinct de la planche à pain. Ensuite, connectez deux voyants numériques GPIO D6 et D7 via une résistance de limitation de courant de 220Ω.\nLorsque vous avez terminé, vous devriez avoir quelque chose qui ressemble à l'illustration ci-dessous.\nCâblage des voyants sur l'ESP8266 NodeMCU\nConcept derrière le contrôle du serveur Web ESP8266\nAlors, vous vous demandez peut-être «Comment vais-je contrôler les choses à partir d’un serveur Web qui traite et ne livre que des pages Web?». Vous devez ensuite comprendre ce qui se passe dans l’arrière-plan.\nLorsque vous tapez une URL dans un navigateur Web et appuyez sur ENTRÉE, le navigateur envoie une demande HTTP (demande a.k.a. GET) à un serveur Web. C’est un travail de serveur Web de traiter cette demande en faisant quelque chose. Vous avez peut-être déjà compris que nous allons contrôler certaines choses en accédant à une URL spécifique. Par exemple, supposons que nous ayons entré une URL du type http://192.168.1.1/conduit sur dans un navigateur. Le navigateur envoie ensuite une requête HTTP à l'ESP8266 pour traiter cette requête. Lorsque l'ESP8266 lit cette demande, il sait que l'utilisateur souhaite allumer le voyant. Ainsi, il allume le voyant et envoie une page Web dynamique à un navigateur affichant Statut de la LED: ON Aussi facile que la tarte!\nESP8266 en tant que serveur HTTP utilisant le mode Point d'accès WiFi (AP)\nPassons maintenant aux choses intéressantes!\nComme le suggère l'en-tête, cet exemple montre comment transformer l'ESP8266 en point d'accès et servir des pages Web à tout client connecté. Pour commencer, branchez votre ESP8266 NodeMCU sur votre ordinateur et essayez l’esquisse; et ensuite nous allons le disséquer de manière assez détaillée."},{"id":"text-7","heading":"Text","content":"#comprendre"},{"id":"text-8","heading":"Text","content":"#comprendre"},{"id":"text-9","heading":"Text","content":"const carboniser* ssid = "NodeMCU"; \nconst carboniser* mot de passe = "12345678";"},{"id":"text-10","heading":"Text","content":"Adresse IP local_ip(192,168,1,1)\nAdresse IP passerelle(192,168,1,1)\nAdresse IP sous-réseau(255,255,255,0)"},{"id":"text-11","heading":"Text","content":"ESP8266WebServer serveur(80)"},{"id":"text-12","heading":"Text","content":"uint8_t LED1pin = D7;\nbool LED1status = LOW;"},{"id":"text-13","heading":"Text","content":"uint8_t LED2pin = D6;\nbool LED2status = LOW;"},{"id":"text-14","heading":"Text","content":"vide installer() \n En série.commencer(115200)\n pinMode(LED1pin, OUTPUT);\n pinMode(LED2pin, OUTPUT);"},{"id":"text-15","heading":"Text","content":" Wifi.softAP(ssid, mot de passe);\n Wifi.softAPConfig(local_ip, passerelle, sous-réseau);\n retard(100)\n \n serveur.sur("/", handle_OnConnect);\n serveur.sur("/ led1on", handle_led1on);\n serveur.sur("/ led1off", handle_led1off);\n serveur.sur("/ led2on", handle_led2on);\n serveur.sur("/ led2off", handle_led2off);\n serveur.onNotFound(handle_NotFound);\n \n serveur.commencer();\n En série.imprimer("Le serveur HTTP a commencé")"},{"id":"text-16","heading":"Text","content":"vide boucle() \n serveur.handleClient();\n si(LED1status)\n digitalWrite(LED1pin, HIGH);\n autre\n digitalWrite(LED1pin, BAS);\n \n si(LED2status)\n digitalWrite(LED2pin, HAUT);\n autre\n digitalWrite(LED2pin, BAS);"},{"id":"text-17","heading":"Text","content":"vide handle_OnConnect() \n LED1status = LOW;\n LED2status = LOW;\n En série.imprimer("Statut GPIO7: OFF"},{"id":"text-18","heading":"Text","content":"vide handle_led1on() \n LED1status = HIGH;\n En série.imprimer("Statut GPIO7: ON")\n serveur.envoyer(200, "text / html", SendHTML(true, LED2status));"},{"id":"text-19","heading":"Text","content":"vide handle_led1off() \n LED1status = LOW;\n En série.imprimer("Statut GPIO7: OFF")\n serveur.envoyer(200, "text / html", SendHTML(false, LED2status));"},{"id":"text-20","heading":"Text","content":"vide handle_led2on() \n LED2status = HIGH;\n En série.imprimer("Statut GPIO6: ON")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, true));"},{"id":"text-21","heading":"Text","content":"vide handle_led2off() \n LED2status = LOW;\n En série.imprimer("Statut GPIO6: OFF")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, false));"},{"id":"text-22","heading":"Text","content":"vide handle_NotFound() \n serveur.envoyer(404, "texte simple", "Pas trouvé")"},{"id":"text-23","heading":"Text","content":"Chaîne SendHTML(uint8_t led1stat, uint8_t led2stat) \n String ptr = " n ";\n ptr + =" n ";\n ptr + ="Contrôle LED n ";\n ptr + =" n ";\n ptr + =" n ";\n ptr + =" n ";\n ptr + ="Serveur Web ESP8266 n ";\n ptr + ="Utilisation du mode Point d'accès n ";\n \n si(led1stat)\n ptr + ="Statut LED1: alluméDE n ";\n autre\n ptr + ="LED1 Statut: OFFSUR n ";"},{"id":"text-24","heading":"Text","content":"si(led2stat)\n ptr + ="Statut LED2: alluméDE n ";\n autre\n ptr + ="LED2 Statut: OFFSUR n ";"},{"id":"text-25","heading":"Text","content":" ptr + =" n ";\n ptr + =" n ";\n revenir ptr;"},{"id":"text-26","heading":"Text","content":"Accéder au serveur Web en mode AP\nAprès avoir téléchargé l'esquisse, ouvrez le moniteur série à une vitesse de transmission de 115200 bauds. Appuyez ensuite sur le bouton RESET de l'ESP8266. Si tout va bien, ça va montrer Serveur HTTP démarré message."},{"id":"text-27","heading":"Text","content":"Ensuite, recherchez tout périphérique que vous pouvez connecter à un réseau WiFi – téléphone, ordinateur portable, etc. Et recherchez un réseau appelé NodeMCU. Rejoindre le réseau avec mot de passe 123456789."},{"id":"text-28","heading":"Text","content":"Après vous être connecté à votre réseau NodeMCU AP, chargez un navigateur et pointez-le sur 192.168.1.1. Le NodeMCU devrait afficher une page Web indiquant l’état actuel des voyants et deux boutons pour les contrôler. Si vous regardez simultanément le moniteur série, vous pouvez voir l’état des broches GPIO de NodeMCU."},{"id":"text-29","heading":"Text","content":"Maintenant, cliquez sur le bouton pour allumer LED1 tout en gardant un œil sur l'URL. Une fois que vous avez cliqué sur le bouton, l’ESP8266 reçoit une demande de / led1on URL Il allume ensuite la LED1 et alimente une page Web dont le statut de la LED est mis à jour. Il imprime également l’état de la broche GPIO sur le moniteur série."},{"id":"text-30","heading":"Text","content":"Vous pouvez tester le bouton LED2 et vérifier qu’il fonctionne de la même manière.\nExaminons maintenant le code de plus près pour voir comment il fonctionne, afin que vous puissiez le modifier pour répondre à vos besoins.\nExplication détaillée du code\nL'esquisse commence par inclure la bibliothèque ESP8266WiFi.h. Cette bibliothèque fournit les méthodes WiFi spécifiques à ESP8266 que nous appelons pour se connecter au réseau. Ensuite, nous incluons également la bibliothèque ESP8266WebServer.h, qui propose certaines méthodes qui nous aideront à configurer un serveur et à gérer les demandes HTTP entrantes sans avoir à s’inquiéter des détails de mise en œuvre de bas niveau."},{"id":"text-31","heading":"Text","content":"#comprendre"},{"id":"text-32","heading":"Text","content":"#comprendre"},{"id":"text-33","heading":"Text","content":"Comme nous configurons l’ESP8266 NodeMCU en mode Point d’accès, un réseau WiFi sera créé. Par conséquent, nous devons définir son SSID, son mot de passe, son adresse IP, son masque de sous-réseau IP et sa passerelle IP."},{"id":"text-34","heading":"Text","content":"const carboniser* ssid = "NodeMCU"; \nconst carboniser* mot de passe = "12345678";"},{"id":"text-35","heading":"Text","content":"Adresse IP local_ip(192,168,1,1)\nAdresse IP passerelle(192,168,1,1)\nAdresse IP sous-réseau(255,255,255,0)"},{"id":"text-36","heading":"Text","content":"Ensuite, nous déclarons un objet de la bibliothèque ESP8266WebServer afin de pouvoir accéder à ses fonctions. Le constructeur de cet objet prend le port (où le serveur écoutera) en tant que paramètre. Comme 80 est le port par défaut pour HTTP, nous utiliserons cette valeur. Vous pouvez maintenant accéder au serveur sans avoir besoin de spécifier le port dans l'URL."},{"id":"text-37","heading":"Text","content":"ESP8266WebServer serveur(80)"},{"id":"text-38","heading":"Text","content":"Ensuite, nous déclarons les broches GPIO de NodeMCU auxquelles les voyants sont connectés et leur état initial."},{"id":"text-39","heading":"Text","content":"uint8_t LED1pin = D7;\nbool LED1status = LOW;"},{"id":"text-40","heading":"Text","content":"uint8_t LED2pin = D6;\nbool LED2status = LOW;"},{"id":"text-41","heading":"Text","content":"Dans la fonction Setup ()\nNous configurons notre serveur HTTP avant de l'exécuter. Tout d'abord, nous ouvrons une connexion série à des fins de débogage et définissons les ports GPIO sur OUTPUT."},{"id":"text-42","heading":"Text","content":"En série.commencer(115200)\npinMode(LED1pin, OUTPUT);\npinMode(LED2pin, OUTPUT);"},{"id":"text-43","heading":"Text","content":"Ensuite, nous avons configuré un point d'accès logiciel pour établir un réseau Wi-Fi en prouvant le SSID, le mot de passe, l'adresse IP, le masque de sous-réseau IP et la passerelle IP."},{"id":"text-44","heading":"Text","content":"Wifi.softAP(ssid, mot de passe);\nWifi.softAPConfig(local_ip, passerelle, sous-réseau);\nretard(100)"},{"id":"text-45","heading":"Text","content":"Afin de gérer les requêtes HTTP entrantes, nous devons spécifier le code à exécuter lorsqu'une URL particulière est atteinte. Pour ce faire, nous utilisons la méthode. Cette méthode prend deux paramètres. Le premier est un chemin d'URL et le second est le nom de la fonction que nous voulons exécuter lorsque cette URL est atteinte.\nPar exemple, la première ligne de l'extrait de code ci-dessous indique que lorsqu'un serveur reçoit une requête HTTP à la racine (/) chemin, il déclenchera le handle_OnConnect () une fonction. Notez que l'URL spécifiée est un chemin relatif.\nDe même, nous devons spécifier 4 URL supplémentaires pour gérer deux états de 2 LED."},{"id":"text-46","heading":"Text","content":"serveur.sur("/", handle_OnConnect);\nserveur.sur("/ led1on", handle_led1on);\nserveur.sur("/ led1off", handle_led1off);\nserveur.sur("/ led2on", handle_led2on);\nserveur.sur("/ led2off", handle_led2off);"},{"id":"text-47","heading":"Text","content":"Nous n'avons pas spécifié ce que le serveur devrait faire si le client demande une URL autre que celle spécifiée avec server.on () . Il devrait répondre avec un statut HTTP 404 (non trouvé) et un message pour l'utilisateur. Nous mettons cela dans une fonction aussi, et utilisons server.onNotFound () pour lui dire qu'il doit l'exécuter lorsqu'il reçoit une demande pour un URI non spécifié avec server.on"},{"id":"text-48","heading":"Text","content":"serveur.onNotFound(handle_NotFound);"},{"id":"text-49","heading":"Text","content":"Maintenant, pour démarrer notre serveur, nous appelons la méthode begin sur l’objet serveur."},{"id":"text-50","heading":"Text","content":"serveur.commencer();\nEn série.imprimer("Le serveur HTTP a commencé")"},{"id":"text-51","heading":"Text","content":"Boucle intérieure ()\nPour gérer les requêtes HTTP entrantes réelles, nous devons appeler le handleClient () méthode sur l'objet serveur. Nous changeons également l'état de la LED selon la demande."},{"id":"text-52","heading":"Text","content":"vide boucle() \n serveur.handleClient();\n si(LED1status)\n digitalWrite(LED1pin, HIGH);\n autre\n digitalWrite(LED1pin, BAS);\n \n si(LED2status)\n digitalWrite(LED2pin, HAUT);\n autre\n digitalWrite(LED2pin, BAS);"},{"id":"text-53","heading":"Text","content":"Ensuite, nous devons créer une fonction que nous avons attachée à l’URL racine (/) avec server.on. Rappelles toi? Au début de cette fonction, nous définissons l’état des deux voyants sur LOW (état initial des voyants) et l’imprimons sur un moniteur série. Afin de répondre à la requête HTTP, nous utilisons la méthode send. Bien que la méthode puisse être appelée avec un jeu d'arguments différent, sa forme la plus simple consiste en le code de réponse HTTP, le type de contenu et le contenu.\nDans notre cas, nous envoyons le code 200 (un des codes d’état HTTP), qui correspond à la D'accord réponse. Ensuite, nous spécifions le type de contenu comme "text / html", et finalement nous appelons SendHTML () fonction personnalisée qui crée une page HTML dynamique contenant l’état des voyants."},{"id":"text-54","heading":"Text","content":"vide handle_OnConnect()"},{"id":"text-55","heading":"Text","content":" LED1status = LOW;\n LED2status = LOW;\n En série.imprimer("Statut GPIO7: OFF"},{"id":"text-56","heading":"Text","content":"De même, nous devons créer quatre fonctions pour gérer les demandes de LED On / Off et la page 404 Error."},{"id":"text-57","heading":"Text","content":"vide handle_led1on() \n LED1status = HIGH;\n En série.imprimer("Statut GPIO7: ON")\n serveur.envoyer(200, "text / html", SendHTML(true, LED2status));"},{"id":"text-58","heading":"Text","content":"vide handle_led1off() \n LED1status = LOW;\n En série.imprimer("Statut GPIO7: OFF")\n serveur.envoyer(200, "text / html", SendHTML(false, LED2status));"},{"id":"text-59","heading":"Text","content":"vide handle_led2on() \n LED2status = HIGH;\n En série.imprimer("Statut GPIO6: ON")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, true));"},{"id":"text-60","heading":"Text","content":"vide handle_led2off() \n LED2status = LOW;\n En série.imprimer("Statut GPIO6: OFF")\n serveur.envoyer(200, "text / html", SendHTML(LED1status, false));"},{"id":"text-61","heading":"Text","content":"vide handle_NotFound() \n serveur.envoyer(404, "texte simple", "Pas trouvé")"},{"id":"text-62","heading":"Text","content":"Affichage de la page Web HTML\nSendHTML () Cette fonction est chargée de générer une page Web chaque fois que le serveur Web ESP8266 reçoit une demande d’un client Web. Il concatène simplement le code HTML dans une grosse chaîne et retourne à la server.send () fonction nous avons discuté plus tôt. La fonction prend le statut des voyants en tant que paramètre pour générer dynamiquement le contenu HTML.\nLe premier texte que vous devriez toujours envoyer est le déclaration qui indique que nous envoyons du code HTML."},{"id":"text-63","heading":"Text","content":"Chaîne SendHTML(uint8_t led1stat, uint8_t led2stat) {\nString ptr = " n ";"},{"id":"text-64","heading":"Text","content":"Ensuite, le L'élément viewport rend la page Web réactive dans n'importe quel navigateur Web. Alors que title tag définit le titre de la page."},{"id":"text-65","heading":"Text","content":"ptr + =" n ";\nptr + ="Contrôle LED n ";"},{"id":"text-66","heading":"Text","content":"Styliser la page Web\nEnsuite, nous avons du style CSS pour styliser les boutons et l’apparence de la page Web. Nous choisissons la police Helvetica, définissons le contenu à afficher en tant que bloc en ligne et aligné au centre."},{"id":"text-67","heading":"Text","content":"ptr + =" n ";\n ptr + =" n ";\n ptr + =" n ";\n ptr + ="Serveur Web ESP8266 n ";\n ptr + ="Utilisation du mode station (STA) n ";\n \n si(led1stat)\n ptr + ="Statut LED1: alluméDE n ";\n autre\n ptr + ="LED1 Statut: OFFSUR n ";"},{"id":"text-68","heading":"Text","content":"si(led2stat)\n ptr + ="Statut LED2: alluméDE n ";\n autre\n ptr + ="LED2 Statut: OFFSUR n ";"},{"id":"text-69","heading":"Text","content":" ptr + =" n ";\n ptr + =" n ";\n revenir ptr;"},{"id":"text-70","heading":"Text","content":"Accéder au serveur Web en mode STA\nAprès avoir téléchargé l'esquisse, ouvrez le moniteur série à une vitesse de transmission de 115200 bauds. Appuyez ensuite sur le bouton RESET de l'ESP8266. Si tout va bien, l’adresse IP dynamique obtenue à partir de votre routeur sera affichée. Serveur HTTP démarré message."},{"id":"text-71","heading":"Text","content":"Ensuite, chargez un navigateur et pointez-le sur l'adresse IP indiquée sur le moniteur série. Le NodeMCU devrait afficher une page Web indiquant l’état actuel des voyants et deux boutons pour les contrôler. Si vous regardez simultanément le moniteur série, vous pouvez voir l’état des broches GPIO de NodeMCU."},{"id":"text-72","heading":"Text","content":"Maintenant, cliquez sur le bouton pour allumer LED1 tout en gardant un œil sur l'URL. Une fois que vous avez cliqué sur le bouton, l’ESP8266 reçoit une demande de / led1on URL Il allume ensuite la LED1 et alimente une page Web dont le statut de la LED est mis à jour. Il imprime également l’état de la broche GPIO sur le moniteur série."},{"id":"text-73","heading":"Text","content":"Vous pouvez tester le bouton LED2 et vérifier qu’il fonctionne de la même manière.\nExplication du code\nSi vous observez ce code avec le code précédent, la seule différence est que nous ne définissons pas le point d'accès logiciel, mais que nous rejoignons un réseau existant à l'aide de WiFi.begin () une fonction."},{"id":"text-74","heading":"Text","content":"Wifi.commencer(ssid, mot de passe);"},{"id":"text-75","heading":"Text","content":"Bien que l’ESP8266 tente de se connecter au réseau, nous pouvons vérifier l’état de la connectivité avec État WiFi () une fonction"},{"id":"text-76","heading":"Text","content":"tandis que (Wifi.statut()! = WL_CONNECTED) \n retard(1000)\n En série.impression(".")\n "},{"id":"text-77","heading":"Text","content":"Juste pour votre information, cette fonction renvoie les états suivants:"},{"id":"text-78","heading":"Text","content":"WL_CONNECTED: attribué lors de la connexion à un réseau Wi-Fi\nWL_NO_SHIELD: attribué quand aucun bouclier Wi-Fi n'est présent\nWL_IDLE_STATUS: un statut temporaire attribué lors de l'appel de WiFi.Begin () et reste actif jusqu'à l'expiration du nombre de tentatives (entraînant WL_CONNECT_FAILED) ou jusqu'à ce qu'une connexion soit établie (entraînant WL_CONNECTED)\nWL_NO_SSID_AVAIL: assigné quand aucun SSID n'est disponible\nWL_SCAN_COMPLETED: assigné à la fin de l'analyse des réseaux\nWL_CONNECT_FAILED: assigné quand la connexion échoue pour toutes les tentatives\nWL_CONNECTION_LOST: assigné quand la connexion est perdue\nWL_DISCONNECTED: assigné quand déconnecté d'un réseau"},{"id":"text-79","heading":"Text","content":"Une fois que l’ESP8266 est connecté au réseau, l’esquisse imprime l’adresse IP attribuée à l’ESP8266 en affichant WiFi.localIP () valeur sur le moniteur série."},{"id":"text-80","heading":"Text","content":"En série.imprimer("")\nEn série.imprimer("WiFi connecté ..!")\nEn série.impression("Vous avez une adresse IP:") En série.imprimer(Wifi.localIP());"},{"id":"text-81","heading":"Text","content":"La seule différence entre les modes AP et STA est que l'un crée le réseau et l'autre se joint au réseau existant. Ainsi, le reste du code permettant de gérer les demandes HTTP et de servir une page Web en mode STA est identique à celui du mode AP expliqué ci-dessus. Ceci comprend:"},{"id":"text-82","heading":"Text","content":"Déclaration des broches GPIO de NodeMCU auxquelles des voyants sont connectés\nDéfinir plusieurs méthodes server.on () pour gérer les requêtes HTTP entrantes\nDéfinition de la méthode server.onNotFound () pour gérer l'erreur HTTP 404\nCréation de fonctions personnalisées exécutées lorsque des URL spécifiques sont touchées\nCréation de page HTML\nStyliser la page Web\nCréation de boutons et affichage de leur statut"},{"id":"text-83","heading":"Text","content":"Click to rate this post!\n \n [Total: 0 Average: 0]"}],"media":{"primary_image":"https://tutos-gameserver.fr/wp-content/uploads/2019/09/Creating-Simple-ESP8266-Webserver-in-Arduino-IDe-using-Access-Poin-Station-mode.jpg"},"relations":[{"rel":"canonical","href":"https://tutos-gameserver.fr/2019/09/24/creer-un-serveur-web-esp8266-nodemcu-simple-dans-lide-arduino-bien-choisir-son-serveur-d-impression/"},{"rel":"alternate","href":"https://tutos-gameserver.fr/2019/09/24/creer-un-serveur-web-esp8266-nodemcu-simple-dans-lide-arduino-bien-choisir-son-serveur-d-impression/llm","type":"text/html"},{"rel":"alternate","href":"https://tutos-gameserver.fr/2019/09/24/creer-un-serveur-web-esp8266-nodemcu-simple-dans-lide-arduino-bien-choisir-son-serveur-d-impression/llm.json","type":"application/json"},{"rel":"llm-manifest","href":"https://tutos-gameserver.fr/llm-endpoints-manifest.json","type":"application/json"}],"http_headers":{"X-LLM-Friendly":"1","X-LLM-Schema":"1.1.0","Content-Security-Policy":"default-src 'none'; img-src * data:; style-src 'unsafe-inline'"},"license":"CC BY-ND 4.0","attribution_required":true,"allow_cors":false}