Serveur Web sur ESP32

III - Contrôlez votre ESP32 à partir d'une page Web!

Partie 1


#include <WiFi.h>                       // Utilisation de la librairie WiFi.h

#include <WebServer.h>                  // Utilisation de la librairie WebServer.h


// const char* ssid = "VOTRE_SSID";               // ssid du réseau Wifi

// const char* password = "VOTRE_MOT_DE_PASSE";   // mot de passe du réseau Wifi

const char* ssid = "MaBox-1A2B3C";      // Mettre le ssid de votre réseau Wifi

const char* password = "FoPaRever";     // Mettre le mot de passe de votre réseau Wifi

WebServer server(80);                   // Permet l'affichage de la page d'accueil 

void handleRoot(){                      // Page d'accueil La page HTML est mise dans le String page


//  Syntaxe d'écriture pour être compatible avec le C++ / Arduino

// String page = " xxxxxxxx ";

// page += " xxxxx ";

// etc ...


  String page = "<!DOCTYPE html>";       // Début page HTML

    page += "<head>";

    page += "  <title>Serveur ESP32</title>";

    page += "  <meta http-equiv='refresh' content='60' name='viewport' content='width=device-width, initial-scale=1' charset='UTF-8'/>";

    page += "</head>";

    page += "<body lang='fr'>";

    page += "  <h1>Serveur</h1>";

    page += "  <p>Ce serveur est hébergé sur un ESP32</p>";

    page += "  <i>Créé par Tommy/i>";

    page += "</body>";

    page += "</html>";                    // Fin page HTML

    server.send(200, "text/html", page);  // Envoie de la page HTML

}

void handleNotFound(){                    // Page Not found

  server.send(404, "text/plain","404: Not found");

}

void setup() {

  Serial.begin(115200);

  delay(1000);

  Serial.println("\n");

  WiFi.begin(ssid, password);             // Initialisation du Wifi

  Serial.print("Attente de connexion ...");

  while (WiFi.status() != WL_CONNECTED)

  {

    Serial.print(".");

    delay(100);

  }

  Serial.println("\n");                    // Affichage "Connexion établie" et de l'adresse IP

  Serial.println("Connexion etablie !");

  Serial.print("Adresse IP: ");

  Serial.println(WiFi.localIP());

  server.on("/", handleRoot);              // Chargement de la page d'accueil

  server.onNotFound(handleNotFound);       // Chargement de la page "Not found"

  server.begin();                          // Initialisation du serveur web

  Serial.println("Serveur web actif");

}

void loop() {

  server.handleClient();                   // Attente de demande du client

}


Première vidéo: Premiers tests pour bien débuter avec l'ESP32

La vidéo suivante: Tout savoir sur le WiFi avec l'ESP32


Partie 2


// Serveur Web permettant de piloter 3 Diodes électroluminescentes (3 Sorties du GPIO)

// Esp32 - Serveur Web .html

#include <WiFi.h>       // Librairie Wifi.h           https://www.arduino.cc/reference/en/libraries/wifi/

#include <WebServer.h>  // Librairie WebServer.h      https://www.arduinolibraries.info/libraries/wi-fi-web-server


// const char* ssid = "VOTRE_SSID";               // Mettre le ssid de votre réseau Wifi

// const char* password = "VOTRE_MOT_DE_PASSE";   // Mettre le mot de passe de votre réseau Wifi

const char* ssid = "MaBox-1A2B3C";    // ssid du réseau Wifi

const char* password = "FoPaRever";   //mot de passe du réseau Wifi

WebServer server(80);


const int led1 = 4;   // DEL1 sur GPIO4

const int led2 = 16;  // DEL2 sur GPIO16

const int led3 = 17;  // DEL3 sur GPIO17


bool etatLed1 = 0;

bool etatLed2 = 0;

bool etatLed3 = 0;


char texteEtatLed[2][10] = {"Éteinte","Allumée"};  // Affichage Éteinte ou Allumée

String _bssid;

void handleRoot(){                         // Début de la page html

  String page = "<!DOCTYPE html>";         // La page html est contenue dans la variable page (String)

    page += "<html lang='fr'>";

    page += "<head>";

    page += "<meta http-equiv='refresh' content='60' name='viewport' content='width=device-width, initial-scale=1' charset='UTF-8'/>";    

    page += "<title>Serveur ESP32</title>";

    page += "</head>";

    page += "<body>";

    page += "<div>";    

    page += " <p>État de la DEL1: "; page += texteEtatLed[etatLed1]; page += "</p>";

    page += " <p> <button onclick=\"window.location.href = '/on1';\"> ON </button> <button onclick=\"window.location.href = '/off1';\"> Off </button> </p> ";

    page += " <p>État de la DEL2: "; page += texteEtatLed[etatLed2]; page += "</p>";

    page += " <p><button onclick= \"window.location.href = '/on2';\"> ON </button> <button onclick=\"window.location.href = '/off2';\"> Off </button> </p> ";

    page += " <p>État de la DEL3: "; page += texteEtatLed[etatLed3]; page += "</p>";

    page += " <p><button onclick= \"window.location.href = '/on3';\"> ON </button> <button onclick=\"window.location.href = '/off3';\"> Off </button> </p> ";

    page += " <p>Ce serveur est hébergé sur un ESP32</p>";

    page += " <p>DEL1 ---> GPIO" + String(led1) + " | DEL2 ---> GPIO" + String(led2) + " | DEL3 ---> GPIO" + String(led3)+ "</p>";

    page += " <i>Créé par <a href='http://blewando.fr/act/sin/027/' target='_blank'>blewando.fr</a> </i>";         

    page += "</div>";

    page += "</body>";

    page += "</html>";                       // Fin de la page HTML

    server.setContentLength(page.length());  // Permet l'affichage plus rapide après chaque clic sur les boutons

    server.send(200, "text/html", page);

}


void handleOn1(){  // Code pour allumer la DEL1

    etatLed1 = 1;

    digitalWrite(led1, HIGH);

    server.sendHeader("Location","/");

    server.send(303);

    Serial.println("Led1 ON");   // Pour la mise au point  

}


void handleOff1(){   // Code pour éteindre la DEL1

    etatLed1 = 0;

    digitalWrite(led1, LOW);

    server.sendHeader("Location","/");

    server.send(303);

    Serial.println("Led1 Off");  // Pour la mise au point

}


void handleOn2(){  // Code pour allumer la DEL2

    etatLed2 = 1;

    digitalWrite(led2, HIGH);

    server.sendHeader("Location","/");

    server.send(303);

    Serial.println("Led2 ON");   // Pour la mise au point   

}


void handleOff2(){   // Code pour éteindre la DEL2

    etatLed2 = 0;

    digitalWrite(led2, LOW);

    server.sendHeader("Location","/");

    server.send(303);

    Serial.println("Led2 Off");  // Pour la mise au point

}


void handleOn3(){  // Code pour allumer la DEL3

    etatLed3 = 1;

    digitalWrite(led3, HIGH);

    server.sendHeader("Location","/");

    server.send(303);

    Serial.println("Led3 ON");    // Pour la mise au point  

}


void handleOff3(){   // Code pour éteindre la DEL3

    etatLed3 = 0;

    digitalWrite(led3, LOW);

    server.sendHeader("Location","/");

    server.send(303);

    Serial.println("Led3 Off");  // Pour la mise au point

}


void handleNotFound(){   // Page Not found

  server.send(404, "text/plain","404: Not found");

}


void setup() {

  Serial.begin(115200);

  delay(1000);

  Serial.println("\n");

  pinMode(led1, OUTPUT);  // Définition de la  DEL1 en Sortie

  digitalWrite(led1, 0);  // Initialisation de la DEL1 à 0 (éteinte)

  pinMode(led2, OUTPUT);  // Définition de la DEL2 en Sortie

  digitalWrite(led2, 0);  // Initialisation de la DEL2 à 0 (éteinte)

  pinMode(led3, OUTPUT);  // Définition de la DEL13 en  Sortie

  digitalWrite(led3, 0);  // Initialisation de la DEL3 à 0 (éteinte)  

  WiFi.persistent(false);

  WiFi.begin(ssid, password);

  Serial.print("Attente de connexion ...");

  while (WiFi.status() != WL_CONNECTED)

  {

    Serial.print(".");

    delay(250);

  }

  Serial.println("\n");

  Serial.println("Connexion etablie !");

  Serial.print("SSID: ");

  Serial.print(ssid);  

  long rssi = WiFi.RSSI();

  Serial.print(" | RSSI: ");

  Serial.print(rssi);                   // print the received signal strength:

  Serial.print(" | Canal: ");

  Serial.println(WiFi.channel());

  Serial.print("Adresse MAC: ");  

  Serial.println(WiFi.BSSIDstr());      // print the MAC address of the router you're attached to:

  Serial.print("Adresse IP: ");

  Serial.println(WiFi.localIP());

  server.on("/", handleRoot);           // Chargement de la page accueil

  server.on("/on1", handleOn1);         // Chargement du handleOn1  - Allumer la DEL1

  server.on("/off1", handleOff1);       // Chargement du handleOff1 - Éteindre la DEL1

  server.on("/on2", handleOn2);         // Chargement du handleOn2  - Allumer la DEL2

  server.on("/off2", handleOff2);       // Chargement du handleOff2 - Éteindre la DEL2

  server.on("/on3", handleOn3);         // Chargement du handleOn3  - Allumer la DEL3

  server.on("/off3", handleOff3);       // Chargement du handleOff3 - Éteindre la DEL3

  server.onNotFound(handleNotFound);    // Chargement de la page 'Not found'

  server.begin();

  Serial.println("Serveur web actif");

}


void loop() {

  server.handleClient();

}


Serveur_Web_3Boutons_light.ino



Créé avec HelpNDoc Personal Edition: Outil de création d'aide complet