[TUTO] Application web dynamique

Proposer ou rechercher un tutoriel concernant le Raspberry Pi

Modérateur : Francois

destroyedlolo
Raspinaute
Messages : 1585
Enregistré le : dim. 10 mai 2015 18:44
Localisation : Dans la campagne à côté d'Annecy
Contact :

Re: [TUTO] Application web dynamique

Message par destroyedlolo » ven. 12 oct. 2018 09:49

adelantejm a écrit :
ven. 12 oct. 2018 09:22
Oui pour ouvrir un sujet, mais lequel ?
Mon projet n'a rien de bien innovant. Il correspond à mes besoins et c'est tout.
Ben il est déjà plus avancé que ce que malheureusement ce que nous voyons passer habituellement (sans doute une des raisons pour laquelle je suis moins présent).
Maintenant, je ne suis pas modo, et ce n'est pas mon forum. Cependant, je pense que tu pourrais continuer sur le sujet que tu avais ouvert (le C et le WiFi) soit tout regrouper dans un nouveau sujet dans la catégorie chauffage. M'enfin, je dis ca, hein :)
adelantejm a écrit :
ven. 12 oct. 2018 09:22
Merci pour "shm" cela semble bien correspondre à mes besoins en restant assez simple. La question que je me pose c'est : est-ce que ça fonctionne pour 2 programmes différents?
Comme il s'agit "d'ouverture de fichier" ça devrait ?
Ben ... c'est le but :mrgreen: :mrgreen: Après, comme tu peux le voir dans la doc, il te suffit de mettre les droits qui vont bien si tu souhaites plus de sécurité.
Attention : t'as 2 facons de gérer les shm, soit en mode fichier (open et consort), soit avec mmap(). La seconde étant la plus simple pour ce que tu veux faire.
Mais a nouveau, pense aux acces concurrent : d'ou sémaphore.
adelantejm a écrit :
ven. 12 oct. 2018 09:22
Quant à "boost.asio" c'est surement beaucoup mieux mais il me faudrait des cours particuliers : je comprends vite mais il faut m'expliquer longtemps ...
Heu ... C'est bien quand tu as des projets complexes ou nécessitant des fonctionnalités avancées ... ce qui ne me semble pas le cas ici. Perso, j'évite autant que faire se peu ce genre de librairies C++ car ca fait exploser les temps de compilation (mais bon, on s'en fou un peu vu la puissance de nos machines) et fait des exécutables énormes ...
L'utilisation des sockets n'a rien de compliquée, loin de là, est en standard dans le système sans rien devoir ajouter et surtout, la facon de faire est plus ou moins réutilisable quelque soit le média que tu utilises.
  • BananaPI : Gentoo, disque SATA de 2 To
  • Domotique : 1-wire, TéléInfo, Tablette passée sous Gentoo, ESP8266
  • Multimedia par DNLA
  • Et pleins d'idées ... et bien sûr, pas assez de temps.
Un descriptif de ma domotique 100% fait maison.

Bud Spencer
Raspinaute
Messages : 1089
Enregistré le : lun. 15 août 2016 21:38

Re: [TUTO] Application web dynamique

Message par Bud Spencer » ven. 12 oct. 2018 16:12

adelantejm a écrit :
ven. 12 oct. 2018 09:22
Oui pour ouvrir un sujet, mais lequel ?
Mon projet n'a rien de bien innovant. Il correspond à mes besoins et c'est tout.
La seule particularité c'est peut-être de vouloir limiter les outils au C++ et à ses librairies.
Je ne vois pas où est le problème. Tu sais on fait tous des projets qui correspondent a nos besoins.Suffit juste d’ouvrir un post avec l'idée de ton projet dans la rubrique c/c++ .

Comme je suis bonne poire, et pour rester dans le sujet, et que ça peut intéresser d’autres personnes aussi, je vais quand même te faire un petit cadeau.
Voila un petit serveur tcp écrit en javascript pour nodejs et qui permet de faire du multi-client avec un seul process mono-thread et cerise sur le gâteau, il est 100% non bloquant. Ça veut juste dire qu’il ni a aucune question à se poser pour savoir comment échanger entre thread ou process et ça inclut bien entendu toutes les i/o de toutes les fonctions que tu pourrais rajouter dans le programme. Bon ça reste très simpliste comme truc. A chaque fois qu’un client connecté envois quelques chose, le serveur le renvoi à tous les clients (ce qui fait partie des spécificités de tes besoins si je me souviens bien). Je te précise qu’il ni a rien à compiler et que c’est portable tel quel win/linux/mac sans aucune modif.
Tu demanderas à quelqu’un sur le forum c/c++ de t’écrire un truc équivalent uniquement avec les lib standard, comme ça tu pourras vite comparer la quantité de code nécessaire (compte pas trop dessus quand même ;-) )

servertcp.png
servertcp.png (26.58 Kio) Vu 6083 fois
Voila, c’est tout. Ca ma pris 10 minutes a peine lancement de l'IDE et postage ici compris. Tu peux utiliser de simples sessions telnet pour t’amuser avec ça et voir ce que ça donne.
Le premier ennemi de la connaissance n’est pas l’ignorance, c’est l’illusion de la connaissance (S. Hawking).

adelantejm
Messages : 31
Enregistré le : ven. 5 oct. 2018 09:11

Re: [TUTO] Application web dynamique

Message par adelantejm » dim. 14 oct. 2018 18:36

Oui, c'est bluffant ! En plus le langage et assez clair et sans le connaitre on devine grosso modo ce que ça fait.
Du coup j'ai relu ton tuto depuis le début : il faudra que je prenne le temps de faire les exercices ...
Merci pour ce programme, je pense effectivement qu'il va intéresser du monde.
Je continue donc mon projet sur un autre sujet.
JM

Bud Spencer
Raspinaute
Messages : 1089
Enregistré le : lun. 15 août 2016 21:38

Re: [TUTO] Application web dynamique

Message par Bud Spencer » lun. 15 oct. 2018 19:56

adelantejm a écrit :
dim. 14 oct. 2018 18:36
Du coup j'ai relu ton tuto depuis le début : il faudra que je prenne le temps de faire les exercices …
Si tu finis par t’intéresser à NodeJS et à JavaScript, je te conseil aussi d’en lire d’autre. Sur ce tuto, j’ai surtout insisté sur l’utilisation de socket.io puisque l’idée de départ était de démontrer qu’une appli web pouvait non seulement être ‘self hosted’ tout en étant dynamique en temps réel pour les clients. Mais il ne faut surtout pas non plus penser que NodeJS ne tourne qu’autour de ça. On peu l’utiliser pour n’importe quel type d’application comme par exemple pour faire simplement un serveur tcp …
adelantejm a écrit :
dim. 14 oct. 2018 18:36
Je continue donc mon projet sur un autre sujet.
C’est le mieux à faire si tu utilises un autre langage. Discuter de c ou de c++ sur ce tuto n’a pas trop d’intérêt et les gens susceptibles de te répondre ne viendront pas chercher tes questions ici. En revanche, si tu te plonges dans le Javascript et dans NodeJS, tes questions y seront les bienvenues et je me ferais un plaisir d’essayer d’y répondre (moi au d’autres personnes d’ailleurs).

Aller comme je suis-là, j’en profite pour ajouter une petite leçon vite fait. Ici pas de serveur web ni de socket.io. Juste une petite appli console qui va chercher des données dans une db mysql. Les modules mysql et readline peuvent être installés en side by side comme tous les autres avec une simple commande npm depuis le dir du script.

Code
cp_code.png
cp_code.png (39.7 Kio) Vu 6026 fois
Résult
cp_result.png
cp_result.png (60.07 Kio) Vu 6026 fois
Le premier ennemi de la connaissance n’est pas l’ignorance, c’est l’illusion de la connaissance (S. Hawking).

Bud Spencer
Raspinaute
Messages : 1089
Enregistré le : lun. 15 août 2016 21:38

Re: [TUTO] Application web dynamique

Message par Bud Spencer » ven. 16 nov. 2018 21:37

Aller, comme promis, on se fait un p’tit topo en vrai sur les sondes DHTxx.

Pour ceux qui ne connaissent pas, ce sont des sondes à transfert de données numériques qui permettent des mesures de température et d’humidité. Les 2 modèles connus sont la DHT11 et la DHT22. La DHT11 permet des mesures de température de 0 à 50 °C et de 20 à 100% d’humidité pour un cout inférieur à 5 balles alors que la DHT22 va de -40 à 80 °C et de 0 à 100% d’humidité et est poil plus précise mais elle coute pratiquement le double.

Pour ce premier exemple, j’ai juste trouvé un npm et appliqué à la lettre l’usage. Comme pour moi NodeJs, Npm et la lib bcm2835 sont déjà installés et (presque) à jour (voir dans les pages précédentes du tuto), j’ai juste comme d’hab., créer un dir pour le projet et une fois dedans, j'ai fait un simple $ npm install node-dht-sensor pour installer le ‘driver’ en side-by-side puis créer mon fichier de code.

A titre d’info : NodeJs v8.9.4 , Npm 5.8.0 , BCM2835 1.53, Codage avec Visual Studio 2017 15.8.7 en link SMB (Samba 4.5.12-Debian) avec le PI et commande SSH depuis une console PowerShell 5.1.17134.407


Pour le cablage et le code, j’ai juste fait un copier/coller de l’exemple donné sur la page du npm (en changeant 22 par 11 puisque j’utilise là une DHT11) et voilà le résultat :
dht_0.png
dht_0.png (17.15 Kio) Vu 5851 fois
dht_1.png
dht_1.png (7.38 Kio) Vu 5851 fois
Perso, je n’avais jamais utilisé ces sondes et pourtant la mise en œuvre de l’une d’elle avec NodeJS ne m’a pas pris plus de 10 minutes câblage compris. En fait je me rend compte que ce qu’il y a de plus long quand j’expérimente un truc sur le pi, c’est de vous l’expliquer :lol:

Petite modif. du code pour test lecture toutes les 10 secondes et ajouter l’heure :
dht_2.png
dht_2.png (32.72 Kio) Vu 5851 fois
C’est joli hein :mrgreen:
Dans la prochaine on remplacera la console ssh par une page web :o
Le premier ennemi de la connaissance n’est pas l’ignorance, c’est l’illusion de la connaissance (S. Hawking).

Bud Spencer
Raspinaute
Messages : 1089
Enregistré le : lun. 15 août 2016 21:38

Re: [TUTO] Application web dynamique

Message par Bud Spencer » dim. 18 nov. 2018 11:52

Aller on poursuit l’aventure DHTxx.

Pour cette session, on va juste ajouter les fonctionnalités ‘serveur web’ a notre script. Je ne reviens pas la dessus. C’est exactement le même concept, la même arborescence et les mêmes modules que j’ai utilisé depuis le début du tuto.
dhtx_server.png
dhtx_server.png (57.42 Kio) Vu 5833 fois
On retrouve donc les déclarations et le paramétrage du serveur web, la déclaration du ‘driver’ pour les sondes dht et la declaration d’une structure json (vide pour l’instant) que Je l’ais appelée dht11.
J’ai ensuite modifié la fonction de lecture pour stocker les résultats dans ma structure dth11 au lieu de les sortir de console et ajouté une ligne pour pousser chaque résultat de lecture vers tous les clients connectés au socket.io (ligne35).
J’ai ensuite ajouté une route (‘/json’) pour créer un webservice REST de type GET (ça coute rien et ça peut servir) et une route ‘/’ qui servira la page web par défaut (index.html). La ligne 40 fait une première lecture pour donner des valeurs à dht11. La ligne 41 est un timer qui appel la fonction de lecture de la sonde toutes les 5 seconde et la ligne 42 démarre le serveur web.
Le premier ennemi de la connaissance n’est pas l’ignorance, c’est l’illusion de la connaissance (S. Hawking).

Bud Spencer
Raspinaute
Messages : 1089
Enregistré le : lun. 15 août 2016 21:38

Re: [TUTO] Application web dynamique

Message par Bud Spencer » dim. 18 nov. 2018 12:02

Pour le client, on peut faire une page très simple. Il suffit juste de définir la connexion au socket.io et une fonction qui va mettre à jour les valeurs sur la page à chaque réception de ‘dht11’ sur le socket.io.
dhtxx_simple_client.png
dhtxx_simple_client.png (43.95 Kio) Vu 5832 fois
On peut aussi se la peter graphical. Voilà un petit exemple de vue qui n’est rien d’autre qu’une adaptation de la vue de la leçon n° 4.
dhtxx_graphical.png
dhtxx_graphical.png (105.38 Kio) Vu 5832 fois
Le premier ennemi de la connaissance n’est pas l’ignorance, c’est l’illusion de la connaissance (S. Hawking).

Bud Spencer
Raspinaute
Messages : 1089
Enregistré le : lun. 15 août 2016 21:38

Re: [TUTO] Application web dynamique

Message par Bud Spencer » sam. 24 nov. 2018 20:46

Aller, pour l’fun, on se fait une petite variante DHTxx vite fait. Ce n’est plus le PI qui connecte la sonde, mais un esp (Perso, j'ai utilisé le premier qui me tombait sous la main , soit un esp12 Lolin). Bon l’esp, c’est bien, mais on en a vite fait le tour. Si on veut se faire une vraie domotique temps réel avec plein de capteurs de partout, ça ne le fait pas vraiment, pour ne pas dire pas du tout. Par contre pour s’éviter de tirer des bouts de fils partout dans la maison, ça devient tout de suite vachement plus intéressant. Ça suppose évidement que l’on ait un reseau wifi qui couvre sa cabane (Si on n’a pas ça, faut commencer par y penser avant de penser domotique :lol: …).

L’idée du jour, c’est donc de dire que la sonde n’est plus connectée au PI, mais à un esp(8266 ou autre). Autre subtilité pour changer un peu, ici ce n’est pas l’application nodejs qui sera maitre de la lecture de la sonde mais l’esp lui meme. Pour faire simple avec l’exemple, j’ai juste utilisé l'esp avec un firmeware nodemcu (suffisant et très facile pour ce genre de truc). En fait, en ce qui concerne le tuto à proprement parler, on se fout pas mal que ce soit un esp, un autre pi ou n’importe quel autre système qui lise la sonde. Ce qui nous importe, c’est qu’il soit capable de le faire et qu'il puisse transmettre ses données via une requête http de type ‘post’. Voilà l’exemple des fichiers init.lua et main.lua que j’ai scripté vite fait pour l’esp avec mes petits doigts mignons et boudinés. A chacun d'adapter suivant les besoin.
dhtlua.png
dhtlua.png (44.77 Kio) Vu 5768 fois
Coté application nodeJS, pas grand-chose à changer. J’ai viré l’include du ‘driver’ qui ne sert plus a rien et supprimé la fonction read() ainsi que son timer. Ensuite, j’ai ajouté un nouveau npm qui s’appelle body-parser (npm install body-parser) et qui va nous permettre ici d’extraire facilement les données des requêtes post. Pour finir, j’ai ajouté une route ‘post’. Coté client, rien ne change.
dht_esp_nodejs.png
dht_esp_nodejs.png (49.99 Kio) Vu 5768 fois
Au final, toutes les 10 secondes, l’esp lit la sonde dht11 et envois le résultat en wifi sur le reseau en direction de l’adresse du pi via une simple requête http de type ‘post’. A chaque réception de donnée, le pi retransmet les valeurs à tous ses clients connectés au socket.io.
Pour résumer le truc :
Leçon précédente : DHT11<->Pi_GPIO<-App NodeJ-Socket.IO->Clients Web temps réel
Cette leçon : DHT11<->Esp->Wifi<->App NodeJS-Socket.IO->Clients Web temps réel

Facile non ? ;)
Le premier ennemi de la connaissance n’est pas l’ignorance, c’est l’illusion de la connaissance (S. Hawking).

Fred59
Messages : 14
Enregistré le : lun. 26 nov. 2018 20:26

Re: [TUTO] Application web dynamique

Message par Fred59 » lun. 26 nov. 2018 20:38

Bonjour,

Je reviens tout au début de ce sujet, excusez moi mais je viens d'arrivé.
Je suis à la leçon 6 et problème je travaille sur un raspberry PI3B+ et la bibliothèque wiring ne fonctionne pas.
Lorsque je lance "sudo node myweb.js"
Le Raspi m'insulte:
Unable to determine hardware version. I see: Hardware : BCM2835
- expecting BCM2708 or BCM2709. Please report this to projects@drogon.net

Bon, je recherche un peu sur google est ton ami et paf on me dit qu'il faut utiliser node-wiring-pi ce que je charge vite fait avec "npm install node-wiring-pi" dans le rep du site et en modifiant l'include dans le prog JS.
Le prog se lance mais mystère la page web ne me donne pas toutes les informations, j'ai l'image (le fond de page), le nom des colonnes mais pas d'entrée correspondant au fichier config.
Est ce que quelqu’un a une petite idée?

Merci à tous,
Fréd

Bud Spencer
Raspinaute
Messages : 1089
Enregistré le : lun. 15 août 2016 21:38

Re: [TUTO] Application web dynamique

Message par Bud Spencer » mar. 27 nov. 2018 17:48

Salut Fred.

C'est sans doute juste le problème déjà vu de linkage de socket.io.
J'avais profité de ce problème un petit 'cours' de débug en observant les erreurs coté client.
Tu trouvera plus de détails ici -> https://forums.framboise314.fr/viewtopi ... =40#p22333

Prend aussi le temps de te pencher sur la partie 'mise à jour' de NodeJS et de NPM (je sais plus sur quelles pages du tuto) parce que la distri NodeJS de Raspbian date d'avant Napoléon et forcement Cela a pas mal évolué depui :?
Le premier ennemi de la connaissance n’est pas l’ignorance, c’est l’illusion de la connaissance (S. Hawking).

Répondre

Retourner vers « Tutoriels »