Comment sécuriser mon serveur Web ESP8266 Arduino

Bonjour,

J’ai personnalisé un PGM Arduino serveur Web pour esp8266 (voir PJ) et je cherche
depuis un moment comment je peux sécuriser l’accès par mot de passe?

Est ce au niveau HTML? en ajoutant du Javascript?

Merci pour votre aide

serveur_avec_page_web.ino (6.91 KB)

Tout simplement ajouter un formulaire HTML avec deux camps identifiant / password et un bouton OK.
Les exemples ne manquent pas :
https://tttapa.github.io/ESP8266/Chap10%20-%20Simple%20Web%20Server.html

Tu devrais utiliser la classe ESP8266WebServer, cela te simplifierait la vie et rendrait le code moins monobloc.

@+

Un grand Merci!

J'ai testé votre PGM et il fonctionne parfaitement.
Franchement j'ai passé pas mal de temps à chercher sur le web mais sans succès...

Etant débutant arduino, maintenant je vais tenté de placer un bouton pour piloter une led :confused:

Merci pour votre aide

Bonne continuation.
@+

Bonjour,

J’ai refais un PGM qui intègre le pgm “Allumer et éteindre une LED via Wi-Fi” et le pgm sécuirsé.

J’ai mis un bouton:
server.send(200, “text/html”, “<form action=”/LED" method=“POST”><input type=“submit” value=“Toggle LED”>");

dans la fonction void handleLogin().

je l’ai flashé , la connexion est Ok et après le Login j’arrive bien à mon bouton mais si je clik rien ne se passe et je reviens au login…

J’ai contrôlé plusieurs fois mon PGM, tenté des modifs mais rien à faire!

Peux tu jeter un oeil et me conseiller?

j"ai mis mon pgm en PJ.

Merci

J'ai trouvé la solution en bossant JS

Merci! :slight_smile:

Partage ta solution, elle dépannera peut-être quelqu'un un jour...

Bonjour,
Voilà le code qui me permet de sécuriser ma page Web:

//=============================================== Demande mot de passe ===================================================================
void handleRoot() { // Lorsque l’URI / est demandé, envoyez une page Web avec un bouton pour basculer le voyant.
//server.send(200, “text/html”, “<form action=”/login" method=“POST”><input type=“text” name=“username” placeholder=“Username”>
<input type=“password” name=“password” placeholder=“Password”>
<input type=“submit” value=“Login”>");

// server.send(200, “text/html”, “<form action=”/login" method=“POST”>

<input type=“text” name=“username” >

<input type=“submit” value=“Login”>");
//}
String MdPWeb = “\r\n”;
MdPWeb += “\r\n”;
MdPWeb += “”;
MdPWeb += "

";
MdPWeb += "<font face=“Comic Sans MS” size=“6” color=#FF9933>robot Curiosity chez Nanard ";
MdPWeb += "

";
MdPWeb += “<font face=“Comic Sans MS” size=“3” color=#009900>Se connecter”;
MdPWeb += "

“;
MdPWeb += “<form action=”/login” method=“POST”><input type=“text” name=“username” >

<input type=“submit” value=“Connexion”>";

// On termine l’écriture de la page Web
MdPWeb += “”;
MdPWeb += "
";

// On envoie la page web MdPWeb
server.send(200, “text/html”, MdPWeb);
}
//========================================================================================================================================
void handleLogin() { // Si une demande POST est faite àl’URI / àla connexion
// if( ! server.hasArg(“username”) || ! server.hasArg(“password”)
// || server.arg(“username”) == NULL || server.arg(“password”) == NULL) { // Si la demande POST ne contient pas de nom d’utilisateur

if( ! server.hasArg(“username”)
|| server.arg(“username”) == NULL) { // Si la demande POST ne contient pas de nom d’utilisateur et de mot de passe

server.send(400, “text/plain”, “400: Saisie invalide…”); // The request is invalid, so send HTTP status 400
return;
}
// if(server.arg(“username”) == “nanard” && server.arg(“password”) == “nanard”) { // Si le nom d’utilisateur et le mot de passe sont corrects

if(server.arg(“username”) == “nanard” ) {
//mem_interrupteur = digitalRead(interrupteur); // lit l’état de la broche en entrée

digitalWrite(led_verte, LOW); // réinit du PIC
delay(1200);
digitalWrite(led_verte, HIGH);
redactionPageWeb(); // j’affiche ma page web

} else {
server.send(401, “text/plain”, “401: Pas autorise!”);
}
}

void handleNotFound(){
server.send(404, “text/plain”, “404: Not found”); // Send HTTP status 404 (Not Found) when there’s no handler for the URI in the request
}

****** désolé pour le retard… et j’espère que cela pourra aider quelqu’un… **********

Bonjour,

je serais ravis de pourvoir avoir ta version final, je rencontre des difficulté sur l’adaptation o mon PGM mais comme je n'ai pas tout ton code je comprend pas ou ça bloque.

merci d'avance si tu souhaite partager.

bonne journée

Il te suffit de partir d'un exemple WebServer.

Cette ligne permet de brancher handleRoot() sur l'URL "/" :

  server.on("/", handleRoot);

Il suffit ensuite de remplacer la fonction handleRoot() de l'exemple par celle de nanard_baudon et d'ajouter la fonction handleLogin().
Ajoute aussi :

  server.on("/", handleRoot);        // code existant
  server.on("/login", handleLogin);

Mon problème est que j'utilise un shield ethernet sur un mega et non un ESP8266 , ma librairie me pose donc problème car les commande ne sont pas géré de la même façon.

Voilà donc ou ça bloque !

Je reste preneur d'une solution d'adaptation avec la librairie ethernet.h

Merci à vous.

comme je n'ai pas tout ton code je comprend pas ou ça bloque

Il ne sera donc d'aucune utilité d'avoir le code ESP8266 complet.
Autant partir d'un exemple de la librairie Ethernet (WebServer).

Les exemples ne manquent pas.

Mon code actuel fonctionne bien, je cherche juste a y intégrer une d’identification.

J’ai testé hier mais l’erreur serveur.send remonte (forcement)

Je suis parti de cette exemple,

    /*
 * Written By   : Usman Ali Butt
 * Date         : 12/23/2018
 * Property off : www.microcontroller-project.com
 */

#include <SPI.h>        //Libraries required to communicate with the arduino ethernet shield
#include <Ethernet.h>

int fan = 4;            //Fan connected to pin#4 of arduino

int pos = 0; 
byte mac[] = { 0xDE, 0xAD, 0xBE, 0x3F, 0xFE, 0xED };   //physical mac address
byte ip[] = { 192,168,56,100 };                        //ip in lan (that's what you need to use in your browser. ("192.168.56.100")
//byte gateway[] = { 192, 168, 1, 1 };                   // internet access via router
//byte subnet[] = { 255, 255, 255, 0 };                  //subnet mask
EthernetServer server(80);                             //Server port    
 
String readString;            //HTTP request read

void setup() {
 // Open serial monitor and wait for port to open
  Serial.begin(9600);
   while (!Serial) {
    ; // wait for serial port to connect. Needed for Leonardo only
  }
  
  pinMode(fan, OUTPUT);   // Fan pin declared output

  // start the Ethernet connection and the server:
  Ethernet.begin(mac, ip);    //Begin Ethernet shield
  server.begin();             //Start Server
  Serial.print("server is at ");          
  Serial.println(Ethernet.localIP());    //Locate the IP assigned to arduino
}


void loop() {


  // Check for client request
  EthernetClient client = server.available();
  
  if (client) {                    //If client request arrived read the request
    while (client.connected()) {   
      if (client.available()) {
        char c = client.read();
     
        if (readString.length() < 100) {  
          readString += c;  
         }

 // Server WEB PAGE if requested by user      
         if (c == '\n') {          
           Serial.println(readString); 
           //html file 
           client.println("HTTP/1.1 200 OK"); 
           client.println("Content-Type: text/html");
           client.println();     
           client.println("<HTML>");
           client.println("<HEAD>");
           client.println("<meta name='apple-mobile-web-app-capable' content='yes' />");
           client.println("<meta name='apple-mobile-web-app-status-bar-style' content='black-translucent' />");
           client.println("<TITLE>Arduino Fan control switch</TITLE>");
           client.println("</HEAD>");
           client.println("<BODY>");
           client.println("<H1>FAN Control</H1>");
           client.println("<hr />");
           client.println("
");  
           client.println("<H2>Fan control with arduino Ethenet shield</H2>");
           client.println("
");  
           //BUTTON FOR FIRST LED
           client.println("<a href=\"/?button1on\"\">Turn On FAN</a>");
           client.println("<a href=\"/?button1off\"\">Turn Off FAN</a>
");   
           //SPACES
           client.println("
");     
           client.println("
"); 
            
           client.println("
"); 
           client.println("</BODY>");
           client.println("</HTML>");
     
           delay(1);
           //stopping client
           client.stop();
           //Translate the user request and check to switch on or off the fan
           if (readString.indexOf("?button1on") >0){
               digitalWrite(fan, HIGH);
           }
           if (readString.indexOf("?button1off") >0){
               digitalWrite(fan, LOW);
           }      
            //clearing string for next read
            readString="";  
           
         }
       }
    }
}
}

Je ne vois pas comment un code serveur ESP8266 pourrait s’adapter directement sur un code basé sur la librairie Ethernet.

Dans l’exemple #11 les réponses sont envoyées avec client.println().

Sur ESP8266 server.send est une fonction plus haut niveau qui se charge d’envoyer les informations telles que “HTTP/1.1 200 OK” et “Content-Type: text/html”, d’où les arguments :

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

Avec la librairie Ethernet tu envoies ces informations toi même :

           client.println("HTTP/1.1 200 OK"); 
           client.println("Content-Type: text/html");
           client.println();     
           client.println("<HTML>");
           client.println("<HEAD>");
           // etc.

Si tu as déjà un code qui fonctionne, tu dois bien avoir quelque part une page affichée en suivant ce principe, non ?

C'est exactement ça et cette page est donc dans ma fonction.

Je voudrais donc créer non plus cette page en premier, mais quand je suis identifié.

Donc pour ce faire :

J'appelle ma fonction - void ident () que je narrive pas a faire puis si l'identification est ok j'appelle ma page sinon la fonction échec.

Je ne vois pas comment écrire ma page identification a partir de l'exemple du dessus pour y intégrer celle de nanard_baudon et avoir donc une identification préalable.

Merci beaucoup de ton aide

Transformer chaque ligne contenant du HTML :

MdPWeb += “<form action=”/login" method=“POST”><input type=“text” name=“username” >

<input type=“submit” value=“Connexion”>";

Comme ceci :

client.println("<form action="/login" method=“POST”><input type=“text” name=“username” >

<input type=“submit” value=“Connexion”>");

C’est ça que tu ne parviens pas à faire ? :confused:

Ok !! Je sors !!!

bonjour,

Bon finalement ça ne fonctionne pas :

server.on("/", HTTP_GET, handleRoot); // function when a client requests URI “/”
server.on("/login", HTTP_POST, handleLogin); // function when a POST request is made to URI “/login”
server.onNotFound(handleNotFound);

ses élément ne sont pas recevable

je lance bien ses 3 fonctions en amont du setup

→ void handleRoot(); // function prototypes for HTTP handlers
→ void handleLogin();
→ void handleNotFound();

j’ai bien reconstruit mes fonctions avec client.println()

void handleRoot()
{

   // écouter les clients entrants
  EthernetClient client = server.available();
  if (client) {
    Serial.println("new client");
    // une demande http se termine par une ligne vide
    boolean currentLineIsBlank = true;
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();
        Serial.write(c);
        // si vous êtes arrivé au bout de la ligne (reçu une nouvelle ligne
        // caractère) et la ligne est vide, la demande http est terminée,
        // afin que vous puissiez envoyer une réponse
      
        if (c == '\n' && currentLineIsBlank) {
          // envoyer un en-tête de réponse http standard
          client.println(F("HTTP/1.1 200 OK"));
          client.println(F("Content-Type: text/html"));
          client.println(F("Connection: close"));  // the connection will be closed after completion of the response
          client.println(F("Refresh: 10"));  // rafraîchir la page automatiquement toutes les 5 secondes
          client.println();
          client.println(F("<!DOCTYPE HTML>"));
          client.println(F("<html>"));

          client.println(F("<body style=\"color: rgb(43, 43, 56); background-color: rgb(174, 231, 249);\">"));
          client.println(F("<center>"));
          client.println(F("<font size=7>"));
          client.println(F("<font color=blue>"));
          client.println(F("<font color=#7401DF>"));
          client.println(F( "<font face=\"Comic Sans MS\" size=\"6\" color=#FF9933><i>Gestion piscine </i></font>"));
          client.println(F("

"));
          client.println(F( "<font face=\"Comic Sans MS\" size=\"3\" color=#009900><i>Se connecter</i></font>"));
          client.println(F( "

")); 
          client.println(F( "<form action=\"/login\" method=\"POST\"><center><input type=\"text\" name=\"username\" >

<input type=\"submit\" value=\"Connexion\"></form>"));

 client.println(F("</font>"));
          client.println(F("</html>"));
          break;
        }
        if (c == '\n') {
          // you're starting a new line
          currentLineIsBlank = true;
        } else if (c != '\r') {
          // you've gotten a character on the current line
          currentLineIsBlank = false;
        }
      }
    }
    // give the web browser time to receive the data
    delay(1);
    // close the connection:
   
  }
}

mais je ne vois pas comment initialiser ses " server.on " avec cette librairie ?

server.on("/", HTTP_GET, handleRoot);        // Call the 'handleRoot' function when a client requests URI "/"
  server.on("/login", HTTP_POST, handleLogin); // Call the 'handleLogin' function when a POST request is made to URI "/login"
  server.onNotFound(handleNotFound);           // When a client requests an unknown URI (i.e. something other than "/"), call function "handleNotFound"

  server.begin();                            // Actually start the server
  Serial.println("HTTP server started");

Merci de ton aide.

Avec 33 posts au compteur tu ignores encore ceci :

Les balises code : avec des , pas avec des <>

hbachetti:
Avec 33 posts au compteur tu ignores encore ceci :

https://forum.arduino.cc/index.php?topic=315372.0

Les balises code : avec des , pas avec des <>

Oups ! Non pas une ignorance juste une erreur !