IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)

Vous êtes nouveau sur Developpez.com ? Créez votre compte ou connectez-vous afin de pouvoir participer !

Vous devez avoir un compte Developpez.com et être connecté pour pouvoir participer aux discussions.

Vous n'avez pas encore de compte Developpez.com ? Créez-en un en quelques instants, c'est entièrement gratuit !

Si vous disposez déjà d'un compte et qu'il est bien activé, connectez-vous à l'aide du formulaire ci-dessous.

Identifiez-vous
Identifiant
Mot de passe
Mot de passe oublié ?
Créer un compte

L'inscription est gratuite et ne vous prendra que quelques instants !

Je m'inscris !

Le navigateur aux commandes de l'Arduino - Partie 2 : mettre en place les mécanismes pour envoyer au navigateur des fichiers (HTML, CSS...) écrits sur une carte microSD,
Un tutoriel d'Hervé Troadec

Le , par naute

0PARTAGES

13  0 
Bonjour .

J'ai le plaisir de vous annoncer la mise en ligne du tutoriel :

Le navigateur aux commandes de l’Arduino - 2

dont l'objet est de mettre en place les mécanismes permettant d'envoyer au navigateur des fichiers (HTML, CSS...) écrits sur une carte microSD.

Ce tutoriel fait suite au tutoriel Le navigateur aux commandes de l’Arduino. La troisième et dernière partie, consacrée à la gestion des requêtes avec AJAX est en cours de finalisation.

J'espère que ce tutoriel pourra vous être utile et je vous en souhaite une bonne lecture.

Amicalement,
naute

Retrouvez les meilleurs cours et tutoriels pour apprendre Arduino

Une erreur dans cette actualité ? Signalez-nous-la !

Avatar de Jay M
Expert confirmé https://www.developpez.com
Le 30/03/2020 à 12:03
Citation Envoyé par naute Voir le message
J'ai le plaisir de vous annoncer la mise en ligne du tutoriel :
Merci pour cela. Quelques commentaires constructifs (éventuellement ) sur des points de détails (ou pas)

Comme vous pouvez le constater, j’ai légèrement remanié ce code pour le rendre plus lisible, notamment en ajoutant les indentations. Je peux à présent le faire sans soucis, car ce code ne sera plus intégré au sketch Arduino, et donc, la place qu’il occupe ne sera plus un problème.
--> comme vous le dites plus loin, il faudra quand même un jour ou l'autre émettre ce texte vers un client. Moins on aura d'octets à envoyer, plus rapide sera la transmission. Alors bien qu'en théorie c'est sympa d'avoir un fichier HTML lisible et bien indenté, en pratique il vaudrait mieux le stocker le plus compact possible.

Dans le code d'exemple de réception
Code : Sélectionner tout
1
2
3
4
5
6
7
8
9
10
11
 while (client.available())
      {
        char carLu = client.read();
        if (carLu != 10)
        {
          reception += carLu;
        }
        else
        {
          break;
        }
il vaut mieux éviter les chiffres magique et remplacer 10 directement par '\n' (et mettre un petit commentaire // a-t-on reçu la fin de ligne.)

Cette réception n'est pas correcte en général. Elle fonctionne car vous avez un peu de chance sur le timing.
Il se pourrait que "client.available()" soit vide mais qu'on n'ait pas encore reçu toute la requête si la connexion ethernet est très lente ou le client pas rapide et donc que vous n'ayez pas encore reçu tout le "GET / HTTP/1.1" dans votre chaîne.

Normalement il faut lire jusqu'à une ligne vide (fin de l'en-tête) ou un timeout éventuellement et pas dépendre de la rapidité de vidage du buffer client par rapport à la rapidité de remplissage.

La documentation Arduino propose
Code : Sélectionner tout
1
2
3
4
5
6
7
8
9
10
11
    // an http request ends with a blank line
    boolean currentLineIsBlank = true;
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();
        Serial.write(c);
        // if you've gotten to the end of the line (received a newline
        // character) and the line is blank, the http request has ended,
        // so you can send a reply
        if (c == '\n' && currentLineIsBlank) {
          ...
Vous pourriez prendre la même approche pour lire jusqu'au '\n'.

Cela dit et en référence à votre premier tuto où vous dites
Pourquoi ce test, alors que la ligne reception += carlu; suffit pour récupérer la chaîne reçue ? En fait, comme nous le verrons ultérieurement, seule la première ligne envoyée par le navigateur du client nous intéresse. Chaque ligne se termine par le caractère de code ASCII 10, appelé caractère de fin de ligne (LF pour Line Feed en anglais). Ce test, qui nous permet de détecter la fin de la première ligne, va donc également nous permettre d’empêcher la récupération des caractères inutiles contenus dans le tampon. Cela permet, d’une part, de gagner du temps, et, d’autre part, de ne stocker dans la variable reception que les renseignements utiles et donc d’éviter d’encombrer pour rien la mémoire vive dont la capacité n’est pas phénoménale
--> A noter que la bibliothèque considère qu'un client est toujours connecté même si on a envoyé close tant qu'on n'a pas vidé son buffer (available() n'est pas nul). Le client n'est pas libéré, j'ai jamais regardé en détail mais il y a peut-être une fuite mémoire si on ne vide pas ce buffer.

Quand vous dites:
Malheureusement, la bibliothèque SdFat ne gère pas la réinscription automatique du lecteur sur le bus SPI lors de la réinsertion de la carte microSD
ce n'est pas la faute du développeur. ça vient du fait que les lecteurs n'ont pas pour la plupart le mécanisme de détection d'éjection. il l'a mentionné ici
There is no reliable way to detect insertion of an SD without a detect switch. Many sockets have pull-ups or other problems so SdFat does not have a function to detect SD insertion
.

Quand vous faites votre fonction accusé de réception
Code : Sélectionner tout
1
2
3
4
5
6
7
8
void arHtml(EthernetClient nomClient, char type)
{
  nomClient.println(F("HTTP/1.1 200 OK"));
  nomClient.print(F("Content-Type: "));
  nomClient.println(type);
  nomClient.println(F("Connection: close"));
  nomClient.println();
}
il faut passer le client par référence -->
Code : Sélectionner tout
 void arHtml(EthernetClient& nomClient, char type)
sinon vous dupliquez l'objet client et il n'est pas prévu pour cela (+impact mémoire).

de manière générale, la duplication mémoire dans un buffer n'est pas nécessaire quand vous faites
Code : Sélectionner tout
1
2
3
4
5
void envoiFichier(EthernetClient nomClient, String fichierEnCours)
{
  char tableau[fichierEnCours.length()+1];
  fichierEnCours.toCharArray(tableau, fichierEnCours.length()+1);
  if (SD.exists(tableau)) {....
Comme la méthode appelée ne modifie pas la cString passée en paramètre, il suffirait de demander la cString sous-jacente à votre String . De plus là encore on ne veut pas dupliquer la mémoire pour le nom du fichier il faut donc passer par référence.

On ferait donc
Code : Sélectionner tout
1
2
3
void envoiFichier(EthernetClient& nomClient, String& fichierEnCours)
{
  if (SD.exists(fichierEnCours.c_str())) {....
MAIS - comme vous appelez ces fonctions directement avec un cString, le plus simple reste de définir le paramètre de la bonne façon:
Code : Sélectionner tout
1
2
3
void envoiFichier(EthernetClient& nomClient,  const char* fichierEnCours)
{
  if (SD.exists(fichierEnCours)) {....
Dans l'absolu on essayerait d'éviter toute la classe String, elle prend aussi plein de place en mémoire (elle vous fait perdre 1.5ko de mémoire flash), et travailler avec des tableaux de caractères. c'est une bonne habitude à prendre sur petits micros-contrôleurs.

En espérant que ce soit utile

bonne journée de confinement à toutes et tous!
2  0 
Avatar de Jay M
Expert confirmé https://www.developpez.com
Le 08/11/2020 à 17:58
Citation Envoyé par naute Voir le message
Le type char est accepté par la fonction exists() mais pas le type String.
Pour être plus précis c'est uniquement le type (const) char* qui est accepté (cf le code)

je pense que Baptou88 a dû tester après avoir changé l'en-tête de la fonction en
Code : Sélectionner tout
void envoiFichier(EthernetClient& nomClient,  const char* fichierEnCours)
et sans le remettre en String
1  0 
Avatar de naute
Rédacteur https://www.developpez.com
Le 08/11/2020 à 19:45
Citation Envoyé par Jay M  Voir le message
Pour être plus précis c'est uniquement le type (const) char* qui est accepté[/URL])

J'aurais effectivement pu écrire :

Ça aurait été plus rigoureux.

Citation Envoyé par Jay M  Voir le message
je pense que Baptou88 a dû tester après avoir changé l'en-tête de la fonction

C'est tout à fait possible. En tout cas, une chose est sûre, exists() n'accepte pas les String (c'est pourtant pas vilain ).
1  0 
Avatar de Jay M
Expert confirmé https://www.developpez.com
Le 08/11/2020 à 20:03
Salut

C’est plus sur la faute de frappe
Le type char est accepté par la fonction exists()
que j’avais réagi (manquait le *) - ensuite qu’on déclare un pointeur (dans ce cas il vaut mieux un const char *) ou un tableau c’est similaire côté encombrement mémoire et le nom du tableau est bien de type char* lors de l’appel de fonction.

La personne qui a écrit SDFat n’a pas voulu encourager sans doute cet usage, et même si vous avez une String nomFichier dans votre code, il suffit d’appeler avec nomFichier.c_str() et ça passe la cSting sous jacente.
1  0 
Avatar de naute
Rédacteur https://www.developpez.com
Le 09/11/2020 à 19:25
Citation Envoyé par Baptou88  Voir le message
ce code compile très bien avec la librairie : #include <SD.h> mais pas avec la libraire #include <SdFat.h>

En effet, ceci parce-que la bibliothèque SD, qui est un sous-ensemble de la bibliothèque SdFat, surcharge la méthode exists() comme suit :
Code c : Sélectionner tout
1
2
3
4
5
6
  
      // Methods to determine if the requested file path exists. 
      boolean exists(const char *filepath); 
      boolean exists(const String &filepath) { 
        return exists(filepath.c_str()); 
      }

ce qui correspond exactement à la proposition de Jay M :

Citation Envoyé par Jay M
si vous avez une String nomFichier dans votre code, il suffit d’appeler avec nomFichier.c_str() et ça passe la cSting sous jacente.

1  0 
Avatar de
https://www.developpez.com
Le 04/04/2022 à 19:45
Bonsoir,

Le lien était effectivement erroné. C'est corrigé .
1  0 
Avatar de ThierryCalvet
Nouveau Candidat au Club https://www.developpez.com
Le 30/03/2020 à 10:52
Bonjour,
Pourriez-vous mettre en ligne la version pdf?
Le lien ne fonctionne pas.

D'avance merci,

Thierry Calvet
0  0 
Avatar de naute
Rédacteur https://www.developpez.com
Le 30/03/2020 à 15:59
Bonjour .

@ThierryCalvet

Les téléchargements sont à présent actifs.

@Jay M
Citation Envoyé par Jay M  Voir le message
--> comme vous le dites plus loin, il faudra quand même un jour ou l'autre émettre ce texte vers un client. Moins on aura d'octets à envoyer, plus rapide sera la transmission. Alors bien qu'en théorie c'est sympa d'avoir un fichier HTML lisible et bien indenté, en pratique il vaudrait mieux le stocker le plus compact possible.

C'est exact, mais c'est également valable pour la plupart des fichiers HTML, écrits par des professionnels, qui circulent sur le Web, et apparemment ça ne pose de problème à personne. En ce qui concerne le tuto, le fichier HTML est tout petit et le gain de temps sera vraisemblablement négligeable, d'autant plus que ce fichier est destiné à n'être chargé qu'une fois par session, comme on le verra dans la troisième partie.

Citation Envoyé par Jay M  Voir le message
il vaut mieux éviter les chiffres magique et remplacer 10 directement par '\n' (et mettre un petit commentaire // a-t-on reçu la fin de ligne.)

Question de point de vue. Pour moi, c'est plutôt le '\n' qui est magique. Le caractère ASCII "10" et sa signification sont, quant à eux, connus de tous les langages de programmation et donc d'un usage universel. Quant aux commentaires, si à l'évidence je suis convaincu de leur utilité dans le code, je trouve plus clair et plus logique, s'agissant d'un tutoriel, de les mettre en dehors.

Citation Envoyé par Jay M  Voir le message
Cette réception n'est pas correcte en général. Elle fonctionne car vous avez un peu de chance sur le timing.
.../...

Ce n'est pas faux, et d'ailleurs, avant je vidais le buffer avec un truc comme ça :
Code arduino : Sélectionner tout
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
  
String reception; 
boolean flag = true; 
while (client.available()) 
{ 
  char carLu = client.read(); 
  if (flag) 
  {   
    if (carLu != 10) 
    { 
      reception += carLu; 
    } 
    else flag = false; 
  } 
}
À force de faire des essais, j'ai fini par me rendre compte que ça ne fonctionnait pas plus mal sans vider le buffer, alors j'ai simplifié .

Citation Envoyé par Jay M  Voir le message
...ce n'est pas la faute du développeur.

Je n'ai bien évidemment jamais voulu dire ça !

Citation Envoyé par Jay M  Voir le message
il faut passer le client par référence -->
Code : Sélectionner tout
 void arHtml(EthernetClient& nomClient, char type)
sinon vous dupliquez l'objet client et il n'est pas prévu pour cela (+impact mémoire).
.../...

Tout à fait exact : je vais envisager une mise à jour.

Citation Envoyé par Jay M  Voir le message
Dans l'absolu on essayerait d'éviter toute la classe String, elle prend aussi plein de place en mémoire (elle vous fait perdre 1.5ko de mémoire flash), et travailler avec des tableaux de caractères. c'est une bonne habitude à prendre sur petits micros-contrôleurs.

Dans la troisième partie, je donne une version qui se passe de la classe String et qui utilise donc les tableaux de caractères. On gagne à peu près 2 Kio de mémoire flash mais on y perd un peu en simplicité. De plus, la mémoire dynamique est impactée, car pour ne pas compliquer encore plus le code avec des réallocations de mémoire, je déclare un tableau de taille fixe, et donc pour être tranquille, supérieur à mes besoins réels. Cela dit, en production, on peut ajuster précisément cette taille.

Citation Envoyé par Jay M  Voir le message
En espérant que ce soit utile

Bien sûr .

Merci pour vos commentaires,
amicalement,
naute
0  0 
Avatar de Jay M
Expert confirmé https://www.developpez.com
Le 30/03/2020 à 16:30
Oui - pour la taille du fichier HTML l'idée était plus de faire la remarque que c'est à prendre en compte. Quand on travaille sur un ordinateur qui a de la mémoire en Giga-octets et une liaison ethernet Gigabit ou 10 Gigabits, on peut se le permettre. Certains serveur web vont même faire le ménage à l'émission pour compresser ce qui est envoyé... mais là on est sur un petit arduino

pour le '\n' OK, chacun son point de vue le votre est tout à fait valide.

Pour le
Code : Sélectionner tout
 while (client.available()) {
ce n'est pas non plus tout à fait correct. Ce qu'il se passe c'est que pendant que vous videz le buffer en appelant client.read(); il se remplit de l'autre côté potentiellement par interruptions. Si vous veniez à vider le buffer plus vite qu'il ne se remplit la condition de votre while devient fausse et vous sortez sans avoir lu le '\n' potentiellement. En pratique ce sera rare mais ça reste un risque, donc le plus simple serait d'itérer sur "tant que je n'ai pas reçu le '\n' alors si un truc est dispo je le lis"

Oui la classe String apporte quelques simplifications mais si on est habitué au fonctions standard, on retrouve assez facilement ses petits et comme vous le dites on gagne pas mal de place Flash.

Merci encore pour le travail !
0  0 
Avatar de Baptou88
Membre du Club https://www.developpez.com
Le 06/11/2020 à 22:25
Bonsoir à tous,

je suis actuellement en train d'implémenter ce tuto pour mon serveur web existant ( Heltec ESP32 Wifi ), mais je ne parvient pas à compiler cette fonction:
Code : Sélectionner tout
1
2
3
4
void envoiFichier(EthernetClient nomClient, String fichierEnCours) 
{ 
  char tableau[fichierEnCours.length()+1]; 
  fichierEnCours.toCharArray(tableau, fichierEnCours.length()+1);
Visual Studio m'indique "l'expression doit avoir une valeur de constante"

Comment remédier à ce problème ?

Cordialement Baptiste
0  0