[TUTO] Application web dynamique

Proposer ou rechercher un tutoriel concernant le Raspberry Pi

Modérateur : Francois

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

Re: [TUTO] Application web dynamique

Message par Fred59 » mar. 27 nov. 2018 20:19

Salut Bud,

Merci pour ta réponse rapide.
J'ai lu le post sur le sujet, j'étais passé rapidement sans m'arrêté, erreur. Très instructif.
Par contre je ne comprends pas l'erreur remonté:
Échec du chargement pour l’élément <script> dont la source est « http://192.168.0.38:8080/socketio/socket.io.js ». 192.168.0.38:8080:47:1
TypeError: io is undefined[En savoir plus] 192.168.0.38:8080:51:13
<anonyme>
http://192.168.0.38:8080/:51:13

J'ai edité le package.json et j'ai:
"dependencies": {
"ejs": "^2.5.6",
"express": "^4.15.3",
"jquery": "^3.2.1",
"socket.io": "^2.0.1",
"node-wiring-pi": "^2.2.1 <-- corrigé car avec un PI3 il faut cette dépendance au lieu de wiring-pi

Ma petite modif pour le wiring n'a rien à voir avec l'erreur et puis cela n'est même pas arrivé à celle là!
Tous les répertoires sont dans node_modules.
Pour les mises à jour c'est la dernière distri de rasbian Stretch et j'ai fait un update et upgrade avant de lancer le node.

Encore un petit coup de pouce je pense que je ne suis pas loin.
Merci à toi.

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

Re: [TUTO] Application web dynamique

Message par Fred59 » mar. 27 nov. 2018 20:36

Salut Bud,

Je suis vraiment nul, je lis une ligne sur 2 tout est dans le post.
C'est comme indiqué: un pb de chemin d'accès au .js.

Tout fonctionne correctement.
Merci pour tout. je continu le cours.

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 21:32

C’est juste un problème de path ou d'install de socket.io et tu vas voir que c’est très facile à comprendre et à résoudre. (Pour l’occase, j’ai téléchargé la lecon6 pour etre dans le meme contexte toi).

Dans le code client (index.html), tu as cette ligne :
<script src="/socketio/socket.io.js"></script>
Elle sert tout simplement à faire un ‘include’ du script socket.io.js qui se trouve sur le serveur et que ton client doit telecharger pour l'utiliser

Dans le code serveur (myweb.js) tu as cette ligne :
app.use('/socketio',express.static(__dirname + '/node_modules/socket.io-client/dist/'))
Ca, c’est le path qui correspond au lien symbolique ‘/socketio’ que tu as coté client (__dirname correspond à la racine de ton projet coté serveur).Le rôle de cette ligne, c’est d’une part de simplifier l’écriture du code client et d’autre part, ca évite d’exposer une partie de l’arborescence serveur. Cette ligne n’est pas indispensable, mais si elle n’était pas là, dans le code client, tu serais obligé de remplacer
<script src="/socketio/socket.io.js"></script>
Par
<script src="/node_modules/socket.io-client/dist/socket.io.js"></script>

Ton message d’erreur est très explicite. Le client ne peut pas charger
http://192.168.0.38:8080/socketio/socket.io.js
tout simplement parce que
… racine_du_projet/node_modules/socket.io-client/dist/socket.io.js
n’existe pas coté serveur (problème version ? …).

Quel version de nodejs ($ nodejs –v) et de npm ($ npm –v) tu as ?
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 » mar. 27 nov. 2018 21:35

Bravo \o/ Tu as trouvé le temps que j'écrivais :lol:
Pas grave, ca servira sans doute pour d'autre ;)
Si tu en as le courrage, va au moins jusqu'au datalogger (page 8 ou 9) et essais le. C'est a partir de la que tu vas vraiment saisir tout le potentiel énorme de nodejs et le véritable sens de ce que j'avais appelé 'application web dynamique' dans le titre du tuto.
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 » jeu. 29 nov. 2018 21:37

Aller, comme c’est bientôt noël, on refait un petit coup de sonde DHTxx (bha si :mrgreen: )

SI vous avez tout bien suivi, on avait eu un user qui arrivait à lire sa sonde en python mais il ne savait pas comment faire avec Nodejs. Je l’avais logiquement orienté vers le npm node-dht-sensor et j’avais aussi précisé que s’il préférait garder son python pour les liaisons avec ses périphériques il pouvait le faire aussi très facilement. Donc juste histoire de ne pas rester sur de la théorie kisertarien, je me suis fendu d’une petite pythonnerie d’exemple (un classique avec la lib adafruit) :
dht22_py.png
dht22_py.png (16.25 Kio) Vu 6108 fois
Coté code serveur nodeJS, c’est exactement le meme code qu’en utilisant le npm node-dht-sensor, sauf que j’ai remplacé la ligne :
var sensor = require('node-dht-sensor');
Par :
var spawn = require('child_process').spawn;
pour utiliser un subprocess qui appel le script python pour lire la sonde au lieu de faire appel à node-dht-sensor et j’ai modifié la fonction read en conséquence.
dht22_py_srv.png
dht22_py_srv.png (9.09 Kio) Vu 6108 fois
L’exemple utilise un script python, mais ça pourrait etre un bash, une simple commande, ou un exécutable codé avec n’importe quoi d'autre puisque ce que l’on récupère c’est juste la sortie stdout.
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. 2 déc. 2018 16:44

Juste pour le fun de gribouiller un bout de code rigolo et pour donner une part de réponse a ca :
https://forums.framboise314.fr/viewtopi ... a85#p30132

Cette fois ci on utilise nodejs comme une simple appli client REST pour aller récupérer l’indice UV des jours à venir et on en profite pour switcher une gpio si l’indice est inferieur a une valeur définie pour demain. Il faut bien sûr s’enregistrer sur openweathermap.org pour obtenir une apikey (gratos).

L’exemple dit qu’il y a beaucoup de soleil (13.29) mais c’est normal, ce sont les coordonnée de Tahiti :lol:
sun_js.png
sun_js.png (60.27 Kio) Vu 6078 fois
sun_out.png
sun_out.png (17.9 Kio) Vu 6078 fois
nodeJs v10.14.1,
npm v6.4.1
moment 2.22.2 (npm)
rpio 1.0.11 (npm)
request-promise 4.2.2 (npm)
API openweathermap uvi (https://openweathermap.org/api/uvi)
Info Index UV : https://en.wikipedia.org/wiki/Ultraviolet_index
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 » dim. 2 déc. 2018 18:18

Bonjour,

Je galere sur la gestion des dates dans nodejs.
Je voudrais sur un enregistrement Mysql travailler la donnée TIMESTAMP pour en tirer le mois et l'année.

J'ai charger la dépendance "date-and-time" de npm
initialisé avec: var date = require('date-and-time'); (var ou let je sais pas)
Mais quand je tente les lignes suivante:
var DerniereDate= new Date(MadateFormatTIMESTAMP);
var DernierMois = DerniereDate.getMouth();

je me fais insulté par la console:
/home/pi/myweb/node_modules/mysql/lib/protocol/Parser.js:80
throw err; // Rethrow non-MySQL errors
^
TypeError: date is not a constructor

J'ai cherché sur le forum mais apparemment personne n'a de problème avec les dates....
Je n'y comprends rien, y a t'il quelqu'un qui pourrait m'aider?

Merci, Fréd.

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

Re: [TUTO] Application web dynamique

Message par Fred59 » dim. 2 déc. 2018 18:34

En recherchant sur le web presque toutes l'am avec comme recherche "nodeJS et les date", on ne trouve pratiquement rien... Pénible!
On trouve des infos sur l'objet Date de Javascript mais cela ne fonctionne pas sous nodejs. et ne parlons pas de npm qui n'est fait que pour des initiés et experts.

C'est désespérant.

Merci de me donner une direction car bloquer sur un point aussi insignifiant c'est franchement décourageant.

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 » dim. 2 déc. 2018 20:42

Bha c'est juste que ton 'MadateFormatTIMESTAMP' n'est pas un format valide pour le constructeur de Date()
si tu fais un console.log(MadateFormatTIMESTAMP); ca donne quoi un timestamp unix, un timestamp msql, une date formatée ?

Si ton champs de ta base contient un timestamp unix, il suffit de le multiplier par 1000 pour construire un objet Date() (Javascript compte en ms et non pas en seconde). Il y a juste un subtilité pour les mois ou il faut ajouter 1 a la valeur getMonth() d'une date, mais c'est clairement indiqué dans la doc javascript de Date.getMonth() qui retourne une valeur de 0 à 11
https://www.w3schools.com/jsref/jsref_getmonth.asp
exemple :
datetime_js.png
datetime_js.png (21.78 Kio) Vu 6047 fois
Tous les modèles de paramètres constructeur pour Date() sont indiqué dans la doc javascript et cela fonctionne parfaitement avec nodejs sans aucun npm spécifiques. https://www.w3schools.com/js/js_dates.asp

Il existe aussi des npm ou des script qui permettent de formater l'affichage des dates (j'ai utilisé par exemple 'moment' dans l'exemple du dessus juste histoire de presenter un npm de plus),mais il y a une multitude de façons de parser une date pour en faire son propre format. Le npm date-and-time que tu as cité fonctionne parfaitement aussi :
date-and-time-npm.png
date-and-time-npm.png (20.62 Kio) Vu 6047 fois
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 » mar. 4 déc. 2018 20:18

Super Bud,

Le TIMESTAMP est un retour de query sql.
Je suis passé par la création d'un champ DATE dans ma base. Bon c'est pas du node mais ça marche.
Après dans mon code beaucoup d'erreur de frappe ou de "je sais pas" minuscule / Majuscule ou encore des ; manquant....erreurs de débutant.
Une petite relecture et tout est rentré en ordre de marche.

pour mon info perso quand dans tes posts tu parles de VS tu veux dire Visual Studio?
Moi je code direct sur le RPI avec GEANY et je n'ai pas trouver le moyen d'avoir une aide à l'écriture comme dans VS. Y a t'il un soft sous RASBIAN qui fait de la saisie assistée?

Merci pour le lien W3schools pour la syntaxe.

Bonne soirée.
Fréd

Répondre

Retourner vers « Tutoriels »