Serveur web; afficher une info sur la première ligne du client

**PhilLU** · 24/11/2021, 16h19

Bonjour,
Mon application est ok, mais je souhaite que l'info affichée sur la première ligne du client soit remplacée par la nouvelle info du serveur, et donc pas ajoutée en seconde ligne et ainsi de suite.
Je souhaite donc remplacer la première ligne par une nouvelle (l'écraser donc)
Je tourne en rond

Qui peut m'aider sur ce point?
D'avance merci

PhilLU

**Jay M** · 24/11/2021, 16h35

quel serveur, quel client, quel afficheur... il nous manque un peu d'info là...

**PhilLU** · 24/11/2021, 18h28

oui, bien sûr:
esp8266 est le serveur programé via Arduino IDE
le client est un navigateur sur windows 10
pas d'afficheur

Merci d'avance ;-)

**f-leb** · 24/11/2021, 20h27

Salut,

Envoyé par PhilLU

Mon application est ok, mais je souhaite que l'info affichée sur la première ligne du client soit remplacée par la nouvelle info du serveur, et donc pas ajoutée en seconde ligne et ainsi de suite.
Je souhaite donc remplacer la première ligne par une nouvelle (l'écraser donc)

La première ligne de la page Web dans le navigateur ? Tu dois modifier le HTML dynamiquement ? Côté client ou serveur ?
Un bout de code ? C'est toujours pas clair...

**Jay M** · 25/11/2021, 15h20

oui on manque d'infos...

mais il n'y a pas de raison (si vous n'avez rien codé pour cela) pour que la page web cumule les anciens messages si vous envoyez simplement un nouveau contenu HTML, elle va se rafraichir

**PhilLU** · 25/11/2021, 16h35

Bonjour,
En fait je n'utilise pas d'HTML mais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
#include <ESP8266WiFi.h>
WiFiClient Client = server.available();
Client.println(webString);

et ce chaque minutes
J'ai tenté un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Client.print('\n' + webString);

et un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

]Client.print('\r'+ webString);

Il semble donc qu'un retour chariot CR via "r" ne soit pas supporté.
La seule solution est le HTML???
Merci pour vos conseils ;-)
PhilLU

**f-leb** · 25/11/2021, 19h47

Si le serveur est un serveur Web et si le client est un navigateur, les messages échangés sont des messages HTTP. Donc les messages renvoyés par le serveur au client comprennent du code HTML/CSS/JavaScript qui peut être interprété par le navigateur pour le rendu de la page.

Voir Débuter avec le module WiFi ESP8266 par exemple.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
// Return the response
  client.println("HTTP/1.1 200 OK");
  client.println("Content-Type: text/html; charset=UTF-8");
  client.println("");
  client.println("<!DOCTYPE HTML>");
  client.println("<html>");
  //etc.

**Jay M** · 25/11/2021, 21h47

Et vous remettez webstring à zéro entre deux appels?

**PhilLU** · 26/11/2021, 16h14

Interressant, maintenant mon navigateur affiche:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8

J'utilise bien

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

#include <ESP8266WiFi.h>

???

**Jay M** · 26/11/2021, 17h36

postez tout le code.

**PhilLU** · 26/11/2021, 17h58

Voici: (appel via 192,168,4,1 sur le client - il faut bien évidement connecté le client au réseau "AC-ESP8266" généré par le serveur

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
 
//////////////////////////////////////
// Version finale pour Access Point //
//   à modifier au niveau du nom    //
// situé en ligne 64                //
//////////////////////////////////////
#include <RTClib.h>
#include <Wire.h>
#include <ESP8266WiFi.h>
//#include <WiFi.h>
#include <strings.h>
 
 
#include "index.h" //Our HTML webpage contents
 
//SSID and Password of your WiFi router
 
 
RTC_DS3231 rtc;
//char t[32];
//int  i = 0;
char DateAndTimeString[20]; 
int Day;
int Month;
int Year;
int Secs;
int Minutes;
int Hours;
String s="";
String webString = "";
String MonTimestamp;
const char *ssid = "AC-ESP8266";
const char *password = "";
IPAddress local_IP(192,168,4,1);
IPAddress gateway(192,168,1,1);
IPAddress subnet(255,255,255,0);
WiFiServer server(80);
 
void setup()
{
  Serial.begin(9600);
  Serial.print("Setting soft-AP configuration ... ");
  Serial.println(WiFi.softAPConfig(local_IP, gateway, subnet) ? "Ready" : "Failed!");
 
  Serial.print("Setting soft-AP ... ");
  Serial.println(WiFi.softAP(ssid,password) ? "Ready" : "Failed!");
  Serial.print("Soft-AP IP address = ");
  Serial.println(WiFi.softAPIP());
 
//------------------------------------------------------------
 
Serial.println("Start Access Point IP");
Serial.println(WiFi.softAPConfig(local_IP, gateway, subnet) ? "Ready" : "Failed!");
Serial.print("Setting soft-AP ... ");
Serial.println(WiFi.softAP(ssid,password) ? "Ready" : "Failed!");
Serial.print("Soft-AP IP address = ");
  Serial.println(WiFi.softAPIP());
 
 
 
 if (! rtc.begin()) {
    Serial.println("Couldn't find RTC");
    while (1);
  }
// rtc.adjust(DateTime(2021, 11, 22, 12, 10, 10));
  if (rtc.lostPower()) {
    Serial.println("RTC lost power, lets set the time!");
    // following line sets the RTC to the date & time this sketch was compiled
    rtc.adjust(DateTime(F(__DATE__), F(__TIME__)));
    // This line sets the RTC with an explicit date & time, for example to set
    // January 21, 2014 at 3am you would call:
    // rtc.adjust(DateTime(2014, 1, 21, 3, 0, 0));
  }
 
//ClientRequest = "";
  Serial.println("Access Point IP");
  Serial.println((WiFi.softAPIP()));
 
  Serial.println("Connected");
//  WiFi.config(staticIP312_10, gateway312_10, subnet312_10); // enlevé
   server.begin();
  Serial.print("Your IP is: ");
  Serial.println((WiFi.softAPIP()));
  Serial.println((WiFi.localIP().toString()));
 
}
 
String print_time(DateTime timestamp) {
  char message[120];
 
  int Year = timestamp.year();
  int Month = timestamp.month();
  int Day = timestamp.day();
  int Hour = timestamp.hour();
  int Minute = timestamp.minute();
  int Second= timestamp.second();
  sprintf(message, "%d%d%d%02d%02d%02d", Year,Month,Day,Hour,Minute,Second);
  return message;
}
 
 
void loop()
{  
  Serial.print("[Server Connected] ");
  Serial.println(WiFi.softAPIP());
  WiFiClient Client = server.available();
//  Serial.print(".");
s = "Louise,";
s = "Louise,"+WiFi.macAddress()+","; 
   if (!Client) {       
      return; }
    while(!Client.available()){  delay(20); }
   /* ClientRequest = (client.readStringUntil('\r'));
    ClientRequest.remove(0, 5);
    ClientRequest.remove(ClientRequest.length()-9,9);
    Serial.print("Vous avez reçu le message suivant: ");
    Serial.println(ClientRequest);*/
 
  if (Client) {
    while (Client.connected()) { 
      if (Client.available()) {
    delay(100);
/*
 Client.println("HTTP/1.1 200 OK");
  Client.println("Content-Type: text/html; charset=UTF-8");
  Client.println("");
  Client.println("<!DOCTYPE HTML>");
  Client.println("<html>");
 */ 
DateTime now = rtc.now();
 // Serial.println(print_time(now));
  MonTimestamp=print_time(now);
 // Serial.println("MonTimestamp: "+MonTimestamp);
 // s=s+print_time(now)+",";
 
 
 
                                   webString = s+print_time(now)+","; // Arduino has a hard time with float to string
 
                               Client.print(webString+'\n');
                               Serial.println("envoyé sur client: "+webString);
  /*  client.println("HTTP/1.1 200 OK");
    client.println("Content-Type: text/html");
    client.println("");
    client.println("<!DOCTYPE HTML>");
    client.println("<html>");
    client.println(webString);
    client.println("</html>");
    */
 
delay(1000);
}
      }
/* Client.flush(); 
  client.stop();
  yield();*/
  //   client.println(i);
delay(10000);
}
}

Merci 1000x

**Jay M** · 26/11/2021, 18h17

qu'est-ce que le code est supposé faire?

**PhilLU** · 26/11/2021, 22h38

But de l'application:
Le serveur et point d'accès (tout deux dans un ESP8266) génère un petit réseau WiFi.
Le but est que ce serveur affiche un nom (ici "Louise"), une virgule, la MAC adres de l'ESP8266, une virgule, puis un timstamp; et ce à chaque cycle soit chaque seconde.
Le problème est que la nouvelle ligne n'écrase pas la précédente, mais vient s'ajouter en dessous de la première ligne.
Le Timestamp reçois le temp actuel via un RTC. Cette partie fonctionne parfaitement.
Merci pour votre aide,

PhilLU

**Jay M** · 27/11/2021, 16h07

commencez par faire ultra simple, un truc comme ça (non testé)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
#include <ESP8266WiFi.h>
const char *ssid = "AC-ESP8266";
WiFiServer server(80);
 
void setup()
{
  Serial.begin(115200);
 
  Serial.begin(115200);
  Serial.print("\n\nSetting soft-AP ... ");
  if (!WiFi.softAP(ssid)) {
    Serial.println("Failed");
    while (true) yield();
  }
  Serial.print("OK.\nSoft-AP IP address = ");
  Serial.println(WiFi.softAPIP());
  server.begin();
  Serial.println("\nReady, awaiting clients");
}
 
void loop()
{
  WiFiClient client = server.available();
  if (client) {
    if (client.connected()) {
      while (client.available()) client.read(); // we don't care about the request
 
      // build the response
      // HTTP headers always start with a response code (e.g. HTTP/1.1 200 OK), then content-type (and other headers) and ends with a blank line
      client.println("HTTP/1.1 200 OK");
      client.println("Content-type:text/html");
      client.println("Connection: close");
      client.println(); // mandatory blank line
 
      // Now comes the HTML content
      client.println("<!DOCTYPE html><html><body>");
      client.print("Louise, ");
      client.print(WiFi.macAddress());
      client.print(", ");
      client.println(millis());           // <=== replace with RTC data
      client.println("</body></html>");
      delay(1);                           // a bit of time to send data out
      client.stop();                      // close the connection
    }
  }
}

ouvrez le moniteur série à 115200 bauds, vous devriez voir un texte comme cela:

Setting soft-AP ... OK.
Soft-AP IP address = 192.168.4.1

Ready, awaiting clients

Connectez votre ordinateur sur le réseau Wi-Fi qui est créé sous le nom AC-ESP8266
Ouvrez un navigateur web et tapez http://192.168.4.1 (ou l'adresse qui est donnée par votre ESP dans le moniteur série)

vous devriez voir affiché "Julie, XX:XX:XX:XX:XX:XX, TTT" ou les XX correspondent à l'adresse MAC de l'ESP et TTT est le nombre de ms depuis le lancement de l'ESP.

Si ça fonctionne comme je le pense, il ne vous reste plus qu'à intégrer votre RTC à la place de millis(). Il suffit de lire l'heure avec un "DateTime now = rtc.now();" et ensuite de faire des print des différents éléments.

à chaque fois que vous ferez un rafraichissement de la page web, une nouvelle requête sera envoyée à l'ESP et vous aurez la nouvelle heure.

**PhilLU** · 27/11/2021, 17h17

Super Jay M,
Merci pour ce coup de main, je sèche là dessus depuis une semaine

PhilLU

**Jay M** · 27/11/2021, 18h44

ça fonctionne?

postez votre code avec l'intégration de la RTC

**PhilLU** · 03/12/2021, 13h14

... en fait , oui et non...

Je résume:
J'ai un ESP32 qui sert de point d'accès et de serveur.
Il génère bien chaque minute, à l'appel par un client ESP32 également (via le navigateur en encodant 192.168.4.1 dans la barre de recherche), comme souhaité, des données: (exemple)
"Francoise,A0:20:A5:0C:4E:65,20211223120633"

le code de cette page est:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<!DOCTYPE html><html><body>
Francoise,A0:20:A5:0C:4E:65,20211223120633
</body></html>

Je souhaite récupérer cette chaine dans un string de ce client ESP32 quand cette requête est envoyée ... (cad via le navigateur en encodant 192.168.4.1 dans la barre de recherche)

Via GET?
Via la lecture caractère par caractère de la ligne (unique)?

Merci pour vos conseils

**Jay M** · 03/12/2021, 19h36

si ce sont 2 Arduino qui discutent entre eux, vous n'êtes pas forcé de passer par HTTP ni d'envoyer un document HTML.

Vous pourriez ouvrir un socket et discuter directement en TCP-IP

sinon il suffit de faire un GET et vous retournez les infos dans un format simple à décoder. pour le mettre dans un buffer, il suffit de lire la réponse requête

**PhilLU** · 06/12/2021, 00h33

Bonsoir,
Merci our la réponse.
C'est concernant justement ce
" il suffit de faire un GET et vous retournez les infos dans un format simple à décoder. pour le mettre dans un buffer, il suffit de lire la réponse requête"
que je suis totalement perdu.
Si je peux vous demander un début de code...?

Merci d'avance,
PhilLu

**Jay M** · 06/12/2021, 14h57

un début de code sur votre client vous faites cela

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
WiFiClient client;
const char* serverIP = "10.0.0.22";
 
void setup() {
  ... // établir la connexion à internet
 
  if (client.connect(serverIP, 80)) {
    client.println("GET / HTTP/1.1");
    client.print("Host: "); client.println(serverIP);
    client.println("Connection: close");
    client.println();
  }
}
 
void loop() {
  while (client.available()) Serial.write((char) client.read());
  if (!client.connected()) {client.stop(); while (true) yield();}
}

à la fin du setup on envoie la requête GET pour l'url / sur le serveur HTTP (port 80) qui répond à l'adresse serverIP (à modifier selon vos besoins)
dans la loop on écoute ce qui revient et on l'imprime. Quand la connection est terminée, on arrête le client (et la loop)

ensuite au lieu d'imprimer il faut sauver ce qui arrive dans un buffer et extraire vos informations

Serveur web; afficher une info sur la première ligne du client

Arduino

Discussions similaires

Partager

Partager