Le navigateur aux commandes de l’Arduino - 2

Bonjour :D .

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

:fleche: Retrouvez les meilleurs cours et tutoriels pour apprendre Arduino

Bonjour,
Pourriez-vous mettre en ligne la version pdf?
Le lien ne fonctionne pas.

D'avance merci,

Thierry Calvet

Citation:

---

Envoyé par naute

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)

Citation:

---

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:

---

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:

---

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

Citation:

---

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:

Citation:

---

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

Citation:

---

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:

---

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:

---

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:

---

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:

---

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:

---

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!

Bonjour :D .

@ThierryCalvet

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

@Jay M

Citation:

---

Envoyé par Jay M

--> 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

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

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:

---

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é :mouarf: .

Citation:

---

Envoyé par Jay M

...ce n'est pas la faute du développeur.

---

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

Citation:

---

Envoyé par Jay M

il faut passer le client par référence -->

Code:

---

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

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

En espérant que ce soit utile

---

Bien sûr :ccool: .

Merci pour vos commentaires,
amicalement,
naute

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:

---

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 !

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:

---

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

Bonsoir

Bien que supporté en C (depuis C99 si je le souviens bien) ce n’est pas le cas en C++ dans la norme: Quand on déclare un tableau sa taille ne doit pas être variable mais une «*constant expression*» . (Cherchez «*variable length array*»)

GCC supporte cependant cela mais ce n’est pas le cas de tous les environnements de compilation. Si vous passez sous l’IDE standard ça devrait compiler

Pour contourner le problème vous pouvez faire un malloc() de la bonne taille et bien sûr faire le free() associé en fin de fonction pour libérer la mémoire. Ça marchera dans ce cas avec tous les compilateurs (s’il y a assez de mémoire disponible bien sûr)

le code compile bien sous l'ide Arduino mais pas visual studio :calim2:

Citation:

---

Envoyé par Baptou88

le code compile bien sous l'ide Arduino mais pas visual studio :calim2:

---

oui donc Visual Studio implémente strictement la norme C++

En fait c'est un point que j'avais relevé quand j'avais lu ce tuto, je le disais dans mes commentaires

Citation:

---

de manière générale, la duplication mémoire dans un buffer n'est pas nécessaire quand vous faites

Code:

---

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.

Code:

---

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:

---

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.

---

bref, vous pouvez vous passer de cette allocation mémoire inutile, remplacez la déclaration et le début de la fonction par

Code:

---

1 2 3

void envoiFichier(EthernetClient& nomClient, const char* fichierEnCours) { if (SD.exists(fichierEnCours)) {....

---

Merci beaucoup pour le retour !
sans avoir vu ton message j'ai modifié la fonction de cette manière :

Code:

---

1 2 3 4 5 6 7 8 9

void envoiFichier(WiFiClient& nomClient, String fichierEnCours) {   /*char tableau[fichierEnCours.length() + 1]; fichierEnCours.toCharArray(tableau, fichierEnCours.length() + 1);*/ if (SD.exists(fichierEnCours/*tableau*/)) { File fichier = SD.open(fichierEnCours/*tableau*/, FILE_READ); while (fichier.available())

---

j'ai remarque que la fonction sd.exists peut accepter en paramètre le nom du fichier en string contrairement à ce que j'ai lu dans ce tuto

Citation:

---

La fonction SD.exists() n’accepte pas d’argument de type String.

---

mais je ne comprend pas encore la différence entre le type char et le type string

Citation:

---

Envoyé par Baptou88

Mais je ne comprend pas encore la différence entre le type char et le type string

---

cf la doc arduino

Citation:

---

Description
Text strings can be represented in two ways. you can use the String data type, which is part of the core as of version 0019, or you can make a string out of an array of type char and null-terminate it. This page described the latter method. For more details on the String object, which gives you more functionality at the cost of more memory, see the String object page.

---

Bonjour :D .

Citation:

---

Envoyé par Baptou88

j'ai remarque que la fonction sd.exists peut accepter en paramètre le nom du fichier en string contrairement à ce que j'ai lu dans ce tuto

---

Je ne sais pas comment tu fais, ou alors je n'ai pas de chance, car voici ce que ça donne chez moi :

Pièce jointe 583361Pièce jointe 583362

Le type char est accepté par la fonction exists() mais pas le type String.

Amicalement,
naute

Citation:

---

Envoyé par naute

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:

---

void envoiFichier(EthernetClient& nomClient, const char* fichierEnCours)

---

et sans le remettre en String

Citation:

---

Envoyé par Jay M

Pour être plus précis c'est uniquement le type (const) char* qui est accepté[/URL]) :)

---

J'aurais effectivement pu écrire :
Pièce jointe 583367
Ça aurait été plus rigoureux.

Citation:

---

Envoyé par Jay M

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 :ptdr: ).

Salut

C’est plus sur la faute de frappe

Citation:

---

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.

merci pour vos message

je viens de faire une petite expérience:

Code:

---

1 2	String fichier = "toto"; if (SD.exists(fichier)) {

---

ce code compile très bien avec la librairie : #include <SD.h> mais pas avec la libraire #include <SdFat.h>

Citation:

---

Envoyé par Baptou88

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:

---

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.

---

Bonjour.

A la fin du paragraphe "III-D. Récapitulation."

Il y a un lien "un lien pour télécharger le sketch complet."

Si je clique sur ce lien il veux associer le lien à "FileZilla.

Je fais ok FileZilla s'ouvre et rien ne se passe.

Pièce jointe 616741

Je suis débutant certainement une fausse manip

Bonne journée

Bonsoir,

Le lien était effectivement erroné. C'est corrigé ;).

:ccool: Merci Jérôme !