Bonjour,
Après de nombreux ratée, ma partie programme est terminé.
J'ai donc commencé à faire une page Web avec WebServer.h
Le seul truc qui me manque c'est quand les fins de course sont activés.
Je veut que sur ma page internet on voie que la porte est soit fermer soit ouverte.
Merci d'avance pour votre aide
thing.cpp (7.57 KB)
Faites en sorte que la page web appelle de temps en temps (automatiquement) votre arduino pour mettre à jour l’information
C'est pas vraiment le résultat que je cherche.
Je cherche à ce que dans mes fonctions fin de course, il y est une fonction qui change l'url de mon WebServer
simonlere:
il y ait une fonction qui change l'url de mon WebServer
ça veut dire quoi concrètement ?
vous dites précédemment
Je veux que sur ma page internet on voit que la porte est soit fermée soit ouverte
Donc si vous voulez que la page se mette à jour, il faut que le navigateur web fasse une demande. Le Web est en mode "déconnecté" , votre Arduino n'a aucun moyen de parler à la page web. C'est au navigateur de prendre l'initiative de demander au serveur s'il y a un truc à changer
Si je comprend bien il faudrait que sur partie HTML, il y est une fonction qui aille chercher si les fins de courses sont activés?
Pour préciser ce que je recherche, je veut que quand mes fins de course sont activées, ma mage se mette à jour avec de nouvelle information.
(par exemple on appuie le bouton OUVERTURE, il deviens alors rouge (l'url devient IP/motor?ouverture=on), lorsque mon fins de course ouverture soit activé, je veut que la page retourne à son état initial, dans ce cas là /motor?ouverture=off)
Oui il faut que la page rappelle le serveur web pour lui demander si quelque chose a changé
Bonjour,
Effectivement c'est le fonctionnement normale de la plus par des applications client/serveur.
Je ne connait pas votre application mais pour info, le rafraichissement automatique d'une pages est possible coté navigateur, si le code de la page comporte la bonne information.
<meta http-equiv="refresh" content="30;url=index.html">
Lorsque le serveur envoie la page initial, le navigateur interprète cette ligne et demandera au serveur la page contenue dans le paramètre "url", cet url peut être la même que celle affiché initialement ou une autre.
Bonne journée.
<meta http-equiv="refresh" content="30;url=index.html">
Je suis sur Visual Studio code, cette ligne n'est pas reconnu, pourtant je l'insère au début de mon String HTML.
Y'aurais t'il une autre manière?
Montrez nous comment en terme de code... (il faut que ce soit envoyé à votre navigateur. Donc ça doit juste faire partie du HTML, on le met souvent dans le header )
Voici le code qui définie le HTML
void handleRoot() {
//Robojax.com ESP32 Relay Motor Control
String HTML ="<!DOCTYPE html>";
HTML += "<html>\n<head>\t\n<title>Porte Poulailler</title>\t\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\t<style>\nhtml,body{\t\nwidth:100%;`\nheight:100%;\nmargin:0}\n*{box-sizing:border-box}\n.colorAll{\n\tbackground-color:#90ee90}\n.colorBtn{\n\tbackground-color:#add8e6}\n.angleButtdon,a{\n\tfont-size:30px;\nborder:1px solid #ccc;\ndisplay:table-caption;\npadding:7px 10px;\ntext-decoration:none;\ncursor:pointer;\npadding:5px 6px 7px 10px}a{\n\tdisplay:block}\n.btn{\n\tmargin:5px;\nborder:none;\ndisplay:inline-block;\nvertical-align:middle;\ntext-align:center;\nwhite-space:nowrap}\n";
HTML +="</style>\n\n</head>\n\n<body>\n<h1>Porte Poulailler </h1>\n";
if(dirStatus ==2){
HTML +="\n\t<h2><span style=\"background-color: #FFFF00\">Porte en fermeture...</span></h2>\n";
}else if(dirStatus ==1){
HTML +="\n<h2><span style=\"background-color: #FFFF00\">Porte en ouverture...</span></h2>\n";
}else{
HTML +="\n<h2><span style=\"background-color: #FFFF00\">Moteur eteint</span></h2>\n";
}
if(statusPorte ==1){
HTML +="\n\t<h2><span style=\"background-color: #FFFF00\">";
HTML += argId2[1];
HTML += "</span></h2>\n";
} else if(statusPorte ==2) {
HTML +="\n\t<h2><span style=\"background-color: #FFFF00\">";
HTML += argId2[0];
HTML += "</span></h2>\n";
}
if(dirStatus ==1){
HTML += "<div class=\"btn\">\n\t\t<a class=\"angleButton\" style=\"background-color:#f56464\" href=\"/motor?";
HTML += argId[0];
HTML += "=off\">";
HTML +=buttonTitle1[0]; //motor ON title
}else{
HTML += "<div class=\"btn\">\n\t\t<a class=\"angleButton \" style=\"background-color:#90ee90\" href=\"/motor?";
HTML += argId[0];
HTML += "=on\">";
HTML +=buttonTitle2[0];//motor OFF title
}
HTML +="</a>\n</div>\n\n";
if(dirStatus ==2){
HTML +=" <div class=\"btn\">\n<a class=\"angleButton\" style=\"background-color:#f56464\" href=\"/motor?";
HTML += argId[1];
HTML += "=off\">";
HTML +=buttonTitle1[1]; //motor ON title
}else{
HTML +=" <div class=\"btn\">\n<a class=\"angleButton \" style=\"background-color:#90ee90\" href=\"/motor?";
HTML += argId[1];
HTML += "=on\">";
HTML +=buttonTitle2[1];//motor OFF title
}
HTML +="</a>\n</div>\n";
HTML +="\n</body>\n</html>\n";
server.send(200, "text/html", HTML);
}//handleRoot()
void handleNotFound() {
String message = "File Not Found";
message += "URI: ";
message += server.uri();
message += "\n Method: ";
message += (server.method() == HTTP_GET) ? "GET" : "POST";
message += "\n Arguments: ";
message += server.args();
message += "\n";
for (uint8_t i = 0; i < server.args(); i++) {
message += " " + server.argName(i) + ": " + server.arg(i) + "\n";
}
server.send(404, "text/plain", message);
}
void Arret(){
digitalWrite(Pin1, LOW);
digitalWrite(Pin2, LOW);
digitalWrite(Pin3, LOW);
digitalWrite(Pin4, LOW);
}
void etatCourseFermer(){
fDCFermer = digitalRead(finDeCourseFermer);
if (fDCFermer == HIGH) // Changement d'état du fin de course haut (front montant ou descendant)
{
Serial.println("Porte fermée !"); // Affichage sur le moniteur série du texte
statusPorte = 1;
pinMode(Pin1, INPUT);//define pin for ULN2003 in1
pinMode(Pin2, INPUT);//define pin for ULN2003 in2
pinMode(Pin3, INPUT);//define pin for ULN2003 in3
pinMode(Pin4, INPUT);//define pin for ULN2003 in4
Arret();
} else {
pinMode(Pin1, OUTPUT);//define pin for ULN2003 in1
pinMode(Pin2, OUTPUT);//define pin for ULN2003 in2
pinMode(Pin3, OUTPUT);//define pin for ULN2003 in3
pinMode(Pin4, OUTPUT);//define pin for ULN2003 in4
}
}
void etatCourseOuverte(){
fDCOuvert = digitalRead(finDeCourseOuverte);
if (fDCOuvert == HIGH){
Serial.println("Porte ouverte !");
statusPorte = 2;
pinMode(Pin1, INPUT);//define pin for ULN2003 in1
pinMode(Pin2, INPUT);//define pin for ULN2003 in2
pinMode(Pin3, INPUT);//define pin for ULN2003 in3
pinMode(Pin4, INPUT);//define pin for ULN2003 in4
Arret();
} else {
pinMode(Pin1, OUTPUT);//define pin for ULN2003 in1
pinMode(Pin2, OUTPUT);//define pin for ULN2003 in2
pinMode(Pin3, OUTPUT);//define pin for ULN2003 in3
pinMode(Pin4, OUTPUT);//define pin for ULN2003 in4
}
}
void motorControl() {
if(server.arg(argId[0]) == "on")
{
pinMode(Pin1, OUTPUT);//define pin for ULN2003 in1
pinMode(Pin2, OUTPUT);//define pin for ULN2003 in2
pinMode(Pin3, OUTPUT);//define pin for ULN2003 in3
pinMode(Pin4, OUTPUT);//define pin for ULN2003 in4
dirStatus = 1;// CCW
}else if(server.arg(argId[0]) == "off"){
dirStatus = 3; // motor OFF
}else if(server.arg(argId[1]) == "on"){
pinMode(Pin1, OUTPUT);//define pin for ULN2003 in1
pinMode(Pin2, OUTPUT);//define pin for ULN2003 in2
pinMode(Pin3, OUTPUT);//define pin for ULN2003 in3
pinMode(Pin4, OUTPUT);//define pin for ULN2003 in4
dirStatus = 2; // CW
}else if(server.arg(argId[1]) == "off"){
dirStatus = 3; // motor OFF
}
handleRoot();
}//motorControl end
void driveStepper(int c)
{
digitalWrite(Pin1, pole1[c]);
digitalWrite(Pin2, pole2[c]);
digitalWrite(Pin3, pole3[c]);
digitalWrite(Pin4, pole4[c]);
}//driveStepper end here
Pour moi cette ligne doit se trouvé entre les balise et ce sont des paramètres de de la balise
A votre place, je découperais justement ces 2 lignes qui ne sont pas très lisible et bien séparé les différentes commande HTML.
Le compilateur ne vérifiera pas la syntaxe du HTML pour lui ce n'est que du string et il est facile d'y laisser une erreur.
HTML += "<html>\n<head>\t\n<title>Porte Poulailler</title>\t\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\t<style>\nhtml,body{\t\nwidth:100%;`\nheight:100%;\nmargin:0}\n*{box-sizing:border-box}\n.colorAll{\n\tbackground-color:#90ee90}\n.colorBtn{\n\tbackground-color:#add8e6}\n.angleButtdon,a{\n\tfont-size:30px;\nborder:1px solid #ccc;\ndisplay:table-caption;\npadding:7px 10px;\ntext-decoration:none;\ncursor:pointer;\npadding:5px 6px 7px 10px}a{\n\tdisplay:block}\n.btn{\n\tmargin:5px;\nborder:none;\ndisplay:inline-block;\nvertical-align:middle;\ntext-align:center;\nwhite-space:nowrap}\n";
HTML +="</style>\n\n</head>\n\n<body>\n<h1>Porte Poulailler </h1>\n";
J'ai essayer de l'inclure ici
HTML += "\n\t\nPorte Poulailler\t\n";
HTML += "<meta name="viewport" content="width=device-width, initial-scale=1">\t\nhtml,body{\t\nwidth:100%;`\nheight:100%;\nmargin:0}\n*{box-sizing:border-box}\n.colorAll{\n\tbackground-color:#90ee90}\n.colorBtn{\n\tbackground-color:#add8e6}\n.angleButtdon,a{\n\tfont-size:30px;\nborder:1px solid #ccc;\ndisplay:table-caption;\npadding:7px 10px;\ntext-decoration:none;\ncursor:pointer;\npadding:5px 6px 7px 10px}a{\n\tdisplay:block}\n.btn{\n\tmargin:5px;\nborder:none;\ndisplay:inline-block;\nvertical-align:middle;\ntext-align:center;\nwhite-space:nowrap}\n";
HTML += "";
HTML +="\n\n\n\n\n
Les " doivent être précédés de \ :
HTML += "<meta http-equiv=\"refresh\" content=\"30;url=index.html\">";
Salut,
Il y a un problème avec les balises .
Une balise META ne peu pas être incluse dans une balise STYLE.
Lorsque je vous proposais de clarifier votre code, je parlais de ceci :
HTML += "<html>\n";
HTML += "<head>\n";
HTML += "<title>Porte Poulailler</title>\n";
HTML += "<meta http-equiv=\"refresh\" content=\"30;url=index.html\">\n";
HTML += "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n";
HTML += "<style>"
HTML += "html,body{\t\nwidth:100%;`\nheight:100%;\nmargin:0}\n*{box-sizing:border-box}\n.colorAll{\n\tbackground-color:#90ee90}\n.colorBtn{\n\tbackground-color:#add8e6}\n.angleButtdon,a{\n\tfont-size:30px;\nborder:1px solid #ccc;\ndisplay:table-caption;\npadding:7px 10px;\ntext-decoration:none;\ncursor:pointer;\npadding:5px 6px 7px 10px}a{\n\tdisplay:block}\n.btn{\n\tmargin:5px;\nborder:none;\ndisplay:inline-block;\nvertical-align:middle;\ntext-align:center;\nwhite-space:nowrap}";
HTML += "</style>\n";
HTML += "</head>\n";
HTML +="<body>\n";
HTML +="<h1>Porte Poulailler </h1>\n";
HTML +="</body>\n";
De cette façon vous visualisé correctement les balises, c'est une reprise vite fait de la mise en forme de cotre code, je ne garanti pas que cela fonctionne.
Second point : A vérifier mais je suis pratiquement certain que les retours a la ligne ( \n ) ne sont pas utiles, précisément a cause de la présence des balises.
Je vous recommande également la lecture de ce topo dont je me sert de temps en temps : Balises HTML
Re-bonjour, merci pour toutes vos réponses, j'ai tout installer, cependant pendant la phase de test j'ai remarquer que mon moteur avait du mal à faire bouger la porte, j'ai donc remplacer l'alimentation 5V part du 12V cela à marcher pour l'ouverture de la porte mais pas pour la fermeture.
Je ne vois pas dans le code ce qui pourrait faire ralentir le moteur.
Voici donc le code à nouveau
#include <Arduino.h>
#include <Adafruit_BusIO_Register.h>
#include <Adafruit_I2CDevice.h>
#include <WiFi.h>
#include <WiFiClient.h>
#include <WebServer.h>
#include <ESPmDNS.h>
#include <DHT.h>
#include <ESPAsyncWebServer.h>
int Pin1 = 13;//IN1 is connected to 13
int Pin2 = 12;//IN2 is connected to 12
int Pin3 = 14;//IN3 is connected to 14
int Pin4 = 27;//IN4 is connected to 27
int finDeCourseOuverte = 26;
int finDeCourseFermer = 25;
int fDCOuvert = 0;
int fDCFermer = 0;
boolean porteOuverte = false; // Déclaration variable Fin de Course Haut
boolean porteFermer = false; // Déclaration variable Fin de Course Bas
int pole1[] ={0,0,0,0, 0,1,1,1, 0};//pole1, 8 step values
int pole2[] ={0,0,0,1, 1,1,0,0, 0};//pole2, 8 step values
int pole3[] ={0,1,1,1, 0,0,0,0, 0};//pole3, 8 step values
int pole4[] ={1,1,0,0, 0,0,0,1, 0};//pole4, 8 step values
int statusPorte = 0;
int poleStep = 0;
int dirStatus = 3;// stores direction status 3= stop (do not change)
String buttonTitle1[] ={"OUVERTURE", "FERMETURE"};
String buttonTitle2[] ={"OUVERTURE", "FERMETURE"};
const String argId[] ={"ouverture", "fermeture"};
const String argId2[] ={"Porte ouverte!","Porte fermer!"};
const char *ssid = "XXX";
const char *password = "XXX";
WebServer server(80);
void handleRoot() {
//Robojax.com ESP32 Relay Motor Control
String HTML ="<!DOCTYPE html>";
HTML += "<html>\n";
HTML += "<head>\n";
HTML += "<title>Porte Poulailler</title>\n";
HTML += "<meta http-equiv=\"refresh\" content=\"25;url=motor?\">\n";
HTML += "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n";
HTML += "<style>";
HTML += "html,body{\t\nwidth:100%;`\nheight:100%;\nmargin:0}\n*{box-sizing:border-box}\n.colorAll{\n\tbackground-color:#90ee90}\n.colorBtn{\n\tbackground-color:#add8e6}\n.angleButtdon,a{\n\tfont-size:30px;\nborder:1px solid #ccc;\ndisplay:table-caption;\npadding:7px 10px;\ntext-decoration:none;\ncursor:pointer;\npadding:5px 6px 7px 10px}a{\n\tdisplay:block}\n.btn{\n\tmargin:5px;\nborder:none;\ndisplay:inline-block;\nvertical-align:middle;\ntext-align:center;\nwhite-space:nowrap}";
HTML += "</style>\n";
HTML += "</head>\n";
HTML +="<body>\n";
HTML +="<h1>Porte Poulailler </h1>\n";
if(dirStatus ==2){
HTML +="\n\t<h2><span style=\"background-color: #FFFF00\">Porte en fermeture...</span></h2>\n";
}else if(dirStatus ==1){
HTML +="\n<h2><span style=\"background-color: #FFFF00\">Porte en ouverture...</span></h2>\n";
}else{
HTML +="\n<h2><span style=\"background-color: #FFFF00\">Moteur eteint</span></h2>\n";
}
if(statusPorte ==1){
HTML +="\n\t<h2><span style=\"background-color: #FFFF00\">";
HTML += argId2[1];
HTML += "</span></h2>\n";
} else if(statusPorte ==2) {
HTML +="\n\t<h2><span style=\"background-color: #FFFF00\">";
HTML += argId2[0];
HTML += "</span></h2>\n";
}
if(dirStatus ==1){
HTML += "<div class=\"btn\">\n\t\t<a class=\"angleButton\" style=\"background-color:#f56464\" href=\"/motor?";
HTML += argId[0];
HTML += "=off\">";
HTML +=buttonTitle1[0]; //motor ON title
}else{
HTML += "<div class=\"btn\">\n\t\t<a class=\"angleButton \" style=\"background-color:#90ee90\" href=\"/motor?";
HTML += argId[0];
HTML += "=on\">";
HTML +=buttonTitle2[0];//motor OFF title
}
HTML +="</a>\n</div>\n\n";
if(dirStatus ==2){
HTML +=" <div class=\"btn\">\n<a class=\"angleButton\" style=\"background-color:#f56464\" href=\"/motor?";
HTML += argId[1];
HTML += "=off\">";
HTML +=buttonTitle1[1]; //motor ON title
}else{
HTML +=" <div class=\"btn\">\n<a class=\"angleButton \" style=\"background-color:#90ee90\" href=\"/motor?";
HTML += argId[1];
HTML += "=on\">";
HTML +=buttonTitle2[1];//motor OFF title
}
HTML +="</a>\n</div>\n";
HTML +="\n</body>\n</html>\n";
server.send(200, "text/html", HTML);
}//handleRoot()
void handleNotFound() {
String message = "File Not Found";
message += "URI: ";
message += server.uri();
message += "\n Method: ";
message += (server.method() == HTTP_GET) ? "GET" : "POST";
message += "\n Arguments: ";
message += server.args();
message += "\n";
for (uint8_t i = 0; i < server.args(); i++) {
message += " " + server.argName(i) + ": " + server.arg(i) + "\n";
}
server.send(404, "text/plain", message);
}
void Arret(){
digitalWrite(Pin1, LOW);
digitalWrite(Pin2, LOW);
digitalWrite(Pin3, LOW);
digitalWrite(Pin4, LOW);
}
void etatCourseFermer(){
fDCFermer = digitalRead(finDeCourseFermer);
if (fDCFermer == HIGH) // Changement d'état du fin de course haut (front montant ou descendant)
{
Serial.println("Porte fermée !"); // Affichage sur le moniteur série du texte
statusPorte = 1;
pinMode(Pin1, INPUT);//define pin for ULN2003 in1
pinMode(Pin2, INPUT);//define pin for ULN2003 in2
pinMode(Pin3, INPUT);//define pin for ULN2003 in3
pinMode(Pin4, INPUT);//define pin for ULN2003 in4
Arret();
} else {
pinMode(Pin1, OUTPUT);//define pin for ULN2003 in1
pinMode(Pin2, OUTPUT);//define pin for ULN2003 in2
pinMode(Pin3, OUTPUT);//define pin for ULN2003 in3
pinMode(Pin4, OUTPUT);//define pin for ULN2003 in4
}
}
void etatCourseOuverte(){
fDCOuvert = digitalRead(finDeCourseOuverte);
if (fDCOuvert == HIGH){
Serial.println("Porte ouverte !");
statusPorte = 2;
pinMode(Pin1, INPUT);//define pin for ULN2003 in1
pinMode(Pin2, INPUT);//define pin for ULN2003 in2
pinMode(Pin3, INPUT);//define pin for ULN2003 in3
pinMode(Pin4, INPUT);//define pin for ULN2003 in4
Arret();
} else {
pinMode(Pin1, OUTPUT);//define pin for ULN2003 in1
pinMode(Pin2, OUTPUT);//define pin for ULN2003 in2
pinMode(Pin3, OUTPUT);//define pin for ULN2003 in3
pinMode(Pin4, OUTPUT);//define pin for ULN2003 in4
}
}
void motorControl() {
if(server.arg(argId[0]) == "on")
{
pinMode(Pin1, OUTPUT);//define pin for ULN2003 in1
pinMode(Pin2, OUTPUT);//define pin for ULN2003 in2
pinMode(Pin3, OUTPUT);//define pin for ULN2003 in3
pinMode(Pin4, OUTPUT);//define pin for ULN2003 in4
dirStatus = 1;// CCW
}else if(server.arg(argId[0]) == "off"){
dirStatus = 3; // motor OFF
}else if(server.arg(argId[1]) == "on"){
pinMode(Pin1, OUTPUT);//define pin for ULN2003 in1
pinMode(Pin2, OUTPUT);//define pin for ULN2003 in2
pinMode(Pin3, OUTPUT);//define pin for ULN2003 in3
pinMode(Pin4, OUTPUT);//define pin for ULN2003 in4
dirStatus = 2; // CW
}else if(server.arg(argId[1]) == "off"){
dirStatus = 3; // motor OFF
}
handleRoot();
}//motorControl end
void driveStepper(int c)
{
digitalWrite(Pin1, pole1[c]);
digitalWrite(Pin2, pole2[c]);
digitalWrite(Pin3, pole3[c]);
digitalWrite(Pin4, pole4[c]);
}//driveStepper end here
void setup(void) {
//Robojax.com 28BYJ-48 Steper Motor Control
pinMode(Pin1, OUTPUT);//define pin for ULN2003 in1
pinMode(Pin2, OUTPUT);//define pin for ULN2003 in2
pinMode(Pin3, OUTPUT);//define pin for ULN2003 in3
pinMode(Pin4, OUTPUT);//define pin for ULN2003 in4
pinMode(finDeCourseFermer, INPUT);
pinMode(finDeCourseOuverte, INPUT);
Serial.begin(115200);//initialize the serial monitor
//Robojax.com 28BYJ-48 Steper Motor Control
WiFi.mode(WIFI_STA);
WiFi.begin(ssid, password);
Serial.println("");
// Wait for connection
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println("");
Serial.print("Connected to ");
Serial.println(ssid);
Serial.print("IP address: http://");
Serial.println(WiFi.localIP());
//multicast DNS //Robojax.com 28BYJ-48 Steper Motor Control
server.on("/", handleRoot);
server.on("/motor", HTTP_GET, motorControl);
server.onNotFound(handleNotFound);
server.begin();
Serial.println("HTTP server started");
}//end of setup
void loop(void) {
//Robojax.com 28BYJ-48 Steper Motor Control
server.handleClient();
if(dirStatus ==1){
poleStep--;
driveStepper(poleStep);
etatCourseOuverte();
}else if(dirStatus ==2){
poleStep++;
driveStepper(poleStep);
etatCourseFermer();
}else{
statusPorte = 0;
driveStepper(8);
}
if(poleStep>7){
poleStep=0;
}
if(poleStep<0){
poleStep=7;
}
delay(1);
//Robojax.com 28BYJ-48 Steper Motor Control
}//end of loop