Final Version - Commande WEB button + WEB SETUP IP

International Français Réalisations et Projets Finis
1

Bonjour,

Voici le projet final : en utilisant les tuto précédant

--> Deux page WEB :

  1. Commande de bouton WEB (en CSS)
  2. Paramétrage IP

--> Fonction Login

Modification :
-Fonction struct pour les parametres IP

-page HTML en PROGMEM avec loader (plus facile a utiliser)

-page setup modification des tableaux ....

-utilisation de sscanf pour la page setup
(pas de texfinder : ne marche pas avec plusieurs pages web)
sscanf(tempon,"ST=%hhu&IP0=%hhu&IP1=%hhu&IP2=%hhu&IP3=%hhu&MSR0=%hhu&MSR1=%hhu&MSR2=%hhu&MSR3=%hhu&GAT0=%hhu&GAT1=%hhu&GAT2=%hhu&GAT3=%hhu", &conf.DHCP, &conf.IP[0], &conf.IP[1], &conf.IP[2], &conf.IP[3], &conf.subnet[0], &conf.subnet[1], &conf.subnet[2], &conf.subnet[3], &conf.gateway[0], &conf.gateway[1], &conf.gateway[2], &conf.gateway[3] );

Attention BUG de l'IDE avec sscanf !! version 1.8.5 ok !

-Sauvegarde en EEPROM de la fonction struct IP

-Reboot de l'arduino dans la nouvelle configuration

Le code testé ok

Log Serial

  • Programme : Serveur WEB Commande Bouton WEB *
  • Login Autentification *
  • Configuation IP WEB Page *
  • Installateur : *

EEPROM Load : OK!
Configuration enregiste en EEPROM :

Etat de la Configuration Réseau de l'Arduino :

  • IP : 192.168.0.90
  • MsR : 255.255.255.0
  • Pass : 192.168.0.254

Mémoire RAM disponible de l'arduino : 724 / 2048

Configuration IP Fixe
TEST : Carte Reseau : OK !
Arduino configure en IP STATC
Lecture des Info de la carte Reseau :
L'adresse IP est :................192.168.0.90
Le Masque de sous reseau est :....255.255.255.0
La Passerelle (gateway) est :.....192.168.0.254

Serveur WEB OK !

Nouveau Client connecte :
header (Reception Navigateur WEB :
GET / HTTP/1.1
Host: 192.168.0.90
Connection: keep-alive
Authorization: Basic dXNlcjpwYXNz
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.112 Safari/537.36
DNT: 1
Accept-Encoding: gzip, deflate, sdch
Accept-Language: fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4

Envoie Page WEB : index.html
Client Deconnecte (Fin boucle)

Nouveau Client connecte :
header (Reception Navigateur WEB :
GET /?BoutonON HTTP/1.1
Host: 192.168.0.90
Connection: keep-alive
Authorization: Basic dXNlcjpwYXNz
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.112 Safari/537.36
DNT: 1
Referer: http://192.168.0.90/
Accept-Encoding: gzip, deflate, sdch
Accept-Language: fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4

Envoie Page WEB : index.html
BoutonON
Client Deconnecte (Fin boucle)

Nouveau Client connecte :
header (Reception Navigateur WEB :
GET /?BoutonOFF HTTP/1.1
Host: 192.168.0.90
Connection: keep-alive
Authorization: Basic dXNlcjpwYXNz
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.112 Safari/537.36
DNT: 1
Referer: http://192.168.0.90/?BoutonON
Accept-Encoding: gzip, deflate, sdch
Accept-Language: fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4

Envoie Page WEB : index.html
BoutonON
BoutonOFF
Client Deconnecte (Fin boucle)

Nouveau Client connecte :
header (Reception Navigateur WEB :
GET /ConfPage.html HTTP/1.1
Host: 192.168.0.90
Connection: keep-alive
Authorization: Basic dXNlcjpwYXNz
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.112 Safari/537.36
DNT: 1
Referer: http://192.168.0.90/?BoutonOFF
Accept-Encoding: gzip, deflate, sdch
Accept-Language: fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4

Envoie Page WEB : ConfigIP.html
Client Deconnecte (Fin boucle)

Nouveau Client connecte :
header (Reception Navigateur WEB :
GET /ConfPage.html?ST=1&IP0=192&IP1=168&IP2=0&IP3=89&MSR0=255&MSR1=255&MSR2=255&MSR3=0&GAT0=192&GAT1=168&GAT2=0&GAT3=254 HTTP/1.1
Host: 192.168.0.90
Connection: keep-alive
Authorization: Basic dXNlcjpwYXNz
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.112 Safari/537.36
DNT: 1
Referer: http://192.168.0.90/ConfPage.html
Accept-Encoding: gzip, d
Envoie Page WEB : ConfigIP.html

Etat de la Configuration Réseau de l'Arduino :

  • IP : 192.168.0.89
  • MsR : 255.255.255.0
  • Pass : 192.168.0.254

Mémoire RAM disponible de l'arduino : 29 / 2048

------------ RESET ARDUINO !!!! -----------
Reboot Now ...⸮

  • Programme : Serveur WEB Commande Bouton WEB *
  • Login Autentification *
  • Configuation IP WEB Page *
  • Installateur : *

EEPROM Load : OK!
Configuration enregiste en EEPROM :

Etat de la Configuration Réseau de l'Arduino :

  • IP : 192.168.0.89
  • MsR : 255.255.255.0
  • Pass : 192.168.0.254

Mémoire RAM disponible de l'arduino : 724 / 2048

Configuration IP Fixe
TEST : Carte Reseau : OK !
Arduino configure en IP STATC
Lecture des Info de la carte Reseau :
L'adresse IP est :................192.168.0.89
Le Masque de sous reseau est :....255.255.255.0
La Passerelle (gateway) est :.....192.168.0.254

Serveur WEB OK !

Photo en PJ

By :)

login 1.jpg
login 1.jpg1284×1000 74.4 KB

Page WEB Commande Bouton WEB index.html.jpg
Page WEB Commande Bouton WEB index.html.jpg1284×1000 83.5 KB

Page WEB Configuration IP RESET Arduino.jpg
Page WEB Configuration IP RESET Arduino.jpg1284×1000 94.6 KB

Page WEB ConfIP.jpg
Page WEB ConfIP.jpg1284×1000 81.5 KB

Prise_IP_SRV_WEB_Ethernet_Login_ConfIP_WEB_BoutonWEB_v7.ino (21.4 KB)

ConfIP_HTML_PROGMEM.h (2.6 KB)

EEPROM_RESET.h (3.58 KB)

index_HTML_PROGMEM.h (2.39 KB)

log serial.txt (6.05 KB)

2

Page Config IP en PROGMEM
Page WEB html en PROGMEM

Setup HTML

/*********************************************************************************************************************/
// Variable PROGMEM --> Page WEB Configuration IP
/*********************************************************************************************************************/
PROGMEM const char page_WEB_ConfigIP[] =
// Entéte de la réponse HTTP     -- Attention remplacer :es " par \" !!!!!
"HTTP/1.1 200 OK\n" 
"Content-Type: text/html\n"
//"Connection: close\n"                        // the connection will be closed after completion of the response
//"Refresh: 5"\n                             // refresh the page automatically every 5 sec
"\n"

// début de la page HTML

"<!DOCTYPE HTML>\n"
"<HTML>\n"
"<HEAD>\n"
"<link rel=\"shortcut icon\" type=\"image/png\" href=\"http://eg.com/favicon.ico\">\n"
"<TITLE>Arduino Configuration IP </TITLE>\n"
"<BODY>\n"
"<H1>Arduino Configuration IP</H1>\n"
"<hr />\n"
"
\n"
"<table>\n"
  "<form>\n"
    "<tr>\n"
      "<td>Mode : </td>\n"
      "<select name=\"ST\">\n"
        "<option value=\"1\"> STATIC </option>\n"
        "<option value=\"2\"> DHCP </option>\n"
      "</select>\n"
    "</tr>\n"
    "<tr>\n"
      "<td>IP : </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"IP0\" value=\"\"> . </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"IP1\" value=\"\"> . </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"IP2\" value=\"\"> . </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"IP3\" value=\"\"></td>\n"
    "</tr>\n"
    "<tr>\n"
      "<td>MsR : </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"MSR0\" value=\"\"> . </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"MSR1\" value=\"\"> . </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"MSR2\" value=\"\"> . </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"MSR3\" value=\"\"></td>\n"
    "</tr>\n"
    "<tr>\n"
      "<td>Passerelle : </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"GAT0\" value=\"\"> . </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"GAT1\" value=\"\"> . </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"GAT2\" value=\"\"> . </td>\n"
      "<td><input type=\"text\" size=\"1\" maxlength=\"3\" name=\"GAT3\" value=\"\"></td>\n"
    "</tr>\n"
    "<tr>\n"
      "<td><input type=\"submit\" value=\" SUBMIT \"></td>\n"
    "</tr>\n"
  "</form>\n"
"</table>\n"
"<hr />\n"
"
\n"
"</BODY>\n"
"</HTML>\n"   ;
// Fin de la page WEB

Page WEB exemple

/*********************************************************************************************************************/
// Variable PROGMEM --> Page WEB index.html (Commande Bouton WEB)
/*********************************************************************************************************************/
PROGMEM const char page_WEB_index_HTML[] =
// Entéte de la réponse HTTP     -- Attention remplacer :es " par \" !!!!!     et le /n c'est le retour chariot


"HTTP/1.1 200 OK\n" 
"Content-Type: text/html\n"
//"Connection: close\n"                        // the connection will be closed after completion of the response
//"Refresh: 5"\n                             // refresh the page automatically every 5 sec
"\n"

// début de la page HTML

"<!DOCTYPE HTML>\n"
"<HTML>\n"
  "<HEAD>\n"
    "<link rel=\"shortcut icon\" type=\"image/png\" href=\"http://eg.com/favicon.ico\"/>\n"

    // CSS
     "<style>" 
     "body{margin:60px 0px;" 
     "padding:0px;text-align:center;}" 
     "h1 {text-align: center;font-family:Arial, \"Trebuchet MS\", Helvetica, sans-serif;}"
     "h2 {text-align: center;font-family:Arial, \"Trebuchet MS\", Helvetica, sans-serif;}"
     "a{text-decoration:none;width:75px;height:50px;"
     "border-color:black;border-top:2px solid;"
     "border-bottom:2px solid;border-right:2px solid;"
     "border-left:2px solid;"
     "border-radius:10px 10px 10px;-o-border-radius:10px 10px 10px;"
     "-webkit-border-radius:10px 10px 10px;font-family:\"Trebuchet MS\",Arial, Helvetica, sans-serif;-moz-border-radius:10px 10px 10px;"
     "background-color:#293F5E;padding:8px;text-align:center;}a:link {color:white;}"      
     "/* unvisited link */"
     "a:visited {color:white;}"  
     "/* visited link */"
     "a:hover {color:white;}"
     "/* mouse over link */"
     "a:active {color:white;}"  
     "/* selected link */"
     "</style>\n"
     

    // FIN CSS
                                                  
    "<TITLE>Arduino WEB</TITLE>\n"
  "</HEAD>\n"
  
  "<BODY>\n"
    "<H1>Arduino Commande Bouton WEB</H1>\n"
    "<hr>\n"
    "
\n"
    "<H2>Selection : </H2>\n"
    "
\n"
    "<a href=\"/?BoutonON\"\">Mise a ON LED</a>\n"
    "<a href=\"/?BoutonOFF\"\">Mise a OFF LED</a>
\n"
    "
\n"
    "
\n"
    "
\n"
    "<hr>\n"
    "
\n"
    "<p><a href=\"ConfPage.html\">Configuration IP</a></p>\n"
    "
\n"
    "<hr>\n"
    "
\n"
  "</BODY>\n"
"</HTML>\n";
3

Fonction :

Parametre IP --> EEPROM

Reset Arduino

EEPROM_RESET.h

/*************************************************************************************************************/
/**************  Sous Programmes et Fonction                                                             ****************/
/*************************************************************************************************************/


/*************************************************************************************************************
* Sous Programme
* Fonction : RESET Arduino
**************************************************************************************************************
* Entree : X
* Sortie : X Reboot Arduino
**************************************************************************************************************/
void ResetNow() {
  Serial.print("Reboot Now .....");
  delay(200);
  wdt_enable(WDTO_15MS);

  while(1)
  {
     Serial.print(".");
  }
}
/*************************************************************************************************************
* Sous Programme
* Fonction : Fonction : Ecrit l'EEPROM
**************************************************************************************************************
* Entree : Configuration (struct conf)
* 
* Sortie : Ecriture en EEPROM
* 
**************************************************************************************************************/
void EEPROM_Save()
{
// Put configuration to EEPROM (EEPROM address: adressBase)
    EEPROM.put(adressBase, conf);
}

/*************************************************************************************************************
* Sous Programme
* Fonction : Memoire RAM Disponible
**************************************************************************************************************
* Entree : X
* Sortie : Info sur la RAM disponible dans l'Arduino
**************************************************************************************************************/
int availableMemory()
{
  int size = 2048;
  byte *buf;
  while ((buf = (byte *) malloc(--size)) == NULL);
  free(buf);
  return size;
}


/*********************************************************************************************************************
* Sous Programme : Info Help
/*********************************************************************************************************************
* Entree : X
* Sortie : Info IP (serial)
/*********************************************************************************************************************/
void InfoIP() 
{
  Serial.println(F("-------------------------------------------------------"));
  Serial.println(F(" Etat de la Configuration Réseau de l'Arduino : "));
  Serial.print(F("   - IP   : "));  Serial.print(conf.IP[0]);    Serial.print(".");  Serial.print(conf.IP[1]); Serial.print(".");  Serial.print(conf.IP[2]);   Serial.print(".");   Serial.println(conf.IP[3]);                       
  Serial.print(F("   - MsR  : "));  Serial.print(conf.subnet[0]);    Serial.print(".");  Serial.print(conf.subnet[1]); Serial.print(".");  Serial.print(conf.subnet[2]);   Serial.print(".");   Serial.println(conf.subnet[3]);                       
  Serial.print(F("   - Pass : "));  Serial.print(conf.gateway[0]);    Serial.print(".");  Serial.print(conf.gateway[1]); Serial.print(".");  Serial.print(conf.gateway[2]);   Serial.print(".");   Serial.println(conf.gateway[3]);                      
  Serial.println();
  Serial.print(F(" Mémoire RAM disponible de l'arduino : "));   Serial.print(availableMemory());   Serial.println(" / 2048");
  Serial.println(F("-------------------------------------------------------"));
  Serial.println();
}