Salut !
 
Sur du matos maison (qui est en fonction) à base d'ESP32 je fais ça, dans le JS :
 

if (mdpProvided == MDP)  {
var xhttp = new XMLHttpRequest();
xhttp.open("GET", "Open", true);
xhttp.send();

 
J'ai fait une page web, je me connecte dessus avec mon navigateur, je tape le code et s'il est bon ça lance une fonction (open)
 
Mais du coup je fonctionne comme ça : lors du chargement HTML+CSS+JS j'ai une methode qui va chercher le MDP sur l'ESP.   Et donc le MDP est dans le navigateur, c'est moyen, je préfèrerais envoyer le MDP tapé à l'ESP et check si c'est le bon mot de passe sur l'ESP et non dans le JS du navigateur.
 
Savez vous comment je peux faire ?

Oui là c'est plus que moyen, vu que le MDP est vérifié côté client on peut contourner très facilement.

J'y connais rien en prog web, mais en gros tu pourrais faire un form action="post" etc qui envoye le MDP à l'ESP, ce dernier le vérifie (contre un MDP stocké en dur ou en passant par une fonction de hashage genre SHA256) et retourne soit une page "allez vous en" soit la vraie page au navigateur.

EDIT: POST plutôt que GET pour ne pas avoir le MDP dans l'URL. Bon après je suppose que c'est un système interne non connecté à internet, dans ce cas c'est pas hyper-critique. Dans le cas contraire je déconseille de bricoler soi-même et prendre une solution qui a fait ses preuves!

Ah post plutôt que get, je vais regarder

Non pas de risques de sécurité

Merci !

Je veux dire pas de gros risque nécessitant une solution adaptée comme tu dis

Je crois que j'ai compris ce qu'il faut faire dans le JS :

let xhr = new XMLHttpRequest();
 
let json = JSON.stringify({
  MDP: "John"
});
 
xhr.open("POST", '/submit')
xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
 
xhr.send(json);

Mais du coté C++, sur l'ESP, je fais comment pour récup ma string (mon MDP) ?  J'ai ça actuellement avec les GET

serveur.on("/rescueOpen/submit", HTTP_GET, [](AsyncWebServerRequest *request)
  {
    FaireCeci();
    FaireCela();
    request->send(200);
  });

Edit : j'ai édité comme un cochon

Je connais ni les ESP ni le C++, mais ton code doit utiliser une lib toute faite non? Dans ce cas direction la doc. Je vois HTTP_GET, peut-être il suffit de changer ça en HTTP_POST et ajuster un peu le code pour vérifier le MDP?

Verifier le MDP oui ça c'est pas un problème
 
Pour récup la string avec POST je vais aller voir la doc de la lib effectivement

Ça y est ça marche !  Avec un GET !  (c'était plus simple, en tous cas sur les codes que j'ai lus)
 
Dans le JS :
 

var xhr = new XMLHttpRequest();
xhr.open("GET", "/test?message="+mdpToProvide, true);
xhr.send();

 
et dans le C++
 

const char* PARAM_MESSAGE = "message";
 
serveur.on("/test", HTTP_GET, [](AsyncWebServerRequest *request)
  {
    String MDPProvided;
    if (request->hasParam(PARAM_MESSAGE)) {
        MDPProvided = request->getParam(PARAM_MESSAGE)->value();
        Serial.println("Tentative MDP test" + MDPProvided);
        Blabla;
        request->send(200);
    }
 
  });

Et si le MDP est faux? Il faudrait rajouter un else { Blabla; request->send(code_erreur) }. Je sais plus, je crois que c'est 401 ou 403 le bon code.

Ahh intéressant ça, pour avoir un retour dans le navigateur c'est ça et afficher "Wrong pass" ?
 
Quand j'avais le MDP dans le JS je faisait ça justement mais là je pouvais plus...
 
Je vais voir ça un de ces 4
 
Merci

Oui voila. Je confond toujours HTTP 401 et 403, l'un c'est "access denied" et l'autre "authentification required". A toi de chercher/voir ce qui est correct.

Ca marche !

Faut que je trouve un code pas utilisé, là j'ai mis 300 au pif pour tester et je trouverais dommage d'utiliser un code d'erreur)

Je mets le code C++ en entier :

serveur.on("/open", HTTP_GET, [](AsyncWebServerRequest *request)
  {
    String MDP_provided;
    
    if (request->hasParam(PARAM_MESSAGE)) {
       MDP_provided = request->getParam(PARAM_MESSAGE)->value();
       Serial.println("MDP provided : " + MDP_provided);
      
       if (MDP_provided == pass || MDP_provided == reversePass)  {
         request->send(200);
       }
       else {request->send(300);}
            
    }
 
    if (MDP_provided == pass)  {
      Serial.println("Ouverture web..." );  
      ecran.display1Line("Web Opening..." );
      myServoDriver.open();
    }
 
    else if (MDP_provided == reversePass)  {
      Serial.println("Ouverture rescue web..." );  
      ecran.display1Line("Web Rescue op..." );
      myServoDriver.rescue();
    }
 
  });

et dans le JS

var xhttp = new XMLHttpRequest();
xhttp.open("GET", "/open?message="+mdpToProvide, true);
                       
xhttp.send();
 
mdpToProvide="";
talking.innerHTML = "Sending pass...";
 
xhttp.onload = function() {   // C'est ça qui est appelé après la réception de la réponse.  Sans .onload ça marche pas, le code retourné est toujours 0
    if (xhttp.status === 200)  {
         talking.innerHTML = "Password OK";
         talking.style.backgroundColor = "#00CC00";
     }
     else  {
         talking.innerHTML = "Wrong password";
         talking.style.backgroundColor = "#FF0000";
         console.log("xhttp.status : " + xhttp.status);
     }
}

Bah ils sont pourtant la pour ça non?

Je sais pas, je me dis que c'est pas une erreur, c'est un mdp refusé

J'aurais dû dire status code plutôt que code d'erreur. 200 == tout va bien, 500 == le serveur est HS, ... et 401/403 == mauvais MDP. C'est fait pour.

EDIT: et 418 pour dire que c'est pas le bon pot... (blague pour connaisseurs )

Ah ok merci c'est parfait

Pour info : https://fr.wikipedia.org/wiki/Liste_des_codes_HTTP  

Merci !  C'est donc 401 que je choisi !

Tiens, j'ai un truc bizarre :
 
Mon MDP fait 4 chiffres
 
Si je fais n'importe quoi, y compris 1 seul chiffre sauf le 2 j'ai bien toujours mon 401, parfait
 
Si j'envoie le chiffre 2 j'ai un 300 : choix multiple
 
Si j'envoie n'importe quel autre chiffre j'ai bien le 401
 
 

T'aurais pas un 300 qui traîne encore dans le code pour commencer? Ce que tu peux faire c'est utiliser les outils développeur de ton navigateur aussi pour voir ce qui transite réellement comme requête(s) et/ou débugger le côté client avec la console JS.

Ah mais c'est vrai c'est ce que j'avais mis comme code en premier.  Mais c'est ouf que ça le fasse que avec le chiffre 2
 
Je regarde

J'ai pas de retour "officiel" comme quand j'ai le 401, je suis obligé de l'afficher moi même avec console.log
 

 
2 -> 300
3 -> 401
 
Ca fait pareil quand je tape rien, on dirait que le 2 n'est pas pris en compte, mais dans mon MDP ya un 2 et il fonctionne bien
 
Edit : j'ai 300 null part dans mon code

Tu peux vérifier dans l'onglet réseau si tu as bien une seule requête avec le MDP complet et pas une requête pour chaque chiffre ou ce genre de truc?

Le serveur.on dans le c++ n'est pas appelé
 
C'est complètement ouf
 
Je vais essayer un autre ESP32 identique

Ahhh j'ai regardé dans l'onglet reseau, je vois "disk cache" à chaque fois que je tape 2 ou rien contrairmeent à toutes les autres combinaisons de chiffres
 
Mais je sais pas ce que ça signifie exactement
 

Bon ben ça vient de mes navigateurs, Vivaldi sur PC et Kiwi sur android (2 forks de Chrome)
 
Sur FireFox sur PC ou j'ai que rarement accédé à mon ESP j'ai pas ce comportement
 
Une histoire de cache qui pourait bien fiche le bazar

J'ai vidé le cache du navigateur et ça marche
 
Rat de combat je te dois une fière chandelle encore une fois, merci !

On peut dire que c'était un bug bien caché donc.

 
 
T'assures un max !  
 
Mon pote m'a dit d'ajouter dans les requêtes un param (à coté du MDP donc) , qui sert pas et qui change tout le temps, comme l'heure en millisecondes, pour pas que le nav foute les requêtes en cache !

C'est une possibilité, sinon il me semble qu'il y a un header HTTP "no-cache" ou ce genre de truc. Mais j'y connais rien, le web c'est pas du tout mon truc.