Boukedir Mohamed Mr. En-nouaary Abdeslam Dahchour Anass Année universitaire : 2021-2022 Encadré par : Mr. En-nouaary Abdeslam Table de matière:
Système temps réel et embarqués : ...................................................................................................1
Introduction ....................................................................................................................................3 Objectif ...........................................................................................................................................3 Outils et logiciels utilisés ..............................................................................................................4 I. Réalisation du TP : Implémentation des solutions..............................................................5 ère a. 1 version de l’application : .............................................................................................5 1. Créer un fichier server.js ..................................................................................................5 2. Exécution de node server.js .............................................................................................5 b. 2eme version de l’application : .............................................................................................5 c. 3eme version de l’application : .............................................................................................6 d. 4eme version de l’application : .............................................................................................6 e. 5eme version de l’application : .............................................................................................6 f. 6eme version de l’application : .............................................................................................7 II. Extensions : Socket.io et Mongo DB ................................................................................8 a. Socket.io :.............................................................................................................................8 b. Complétion de l’application web avec MongoDB :............................................................9 Conclusion....................................................................................................................................... 11
2 Introduction En informatique, on parle d'un système temps réel lorsque ce système est capable de contrôler (ou piloter) un procédé physique à une vitesse adaptée à l'évolution du procédé contrôlé. Les systèmes informatiques temps réel se différencient des autres systèmes informatiques par la prise en compte de contraintes temporelles dont le respect est aussi important que l'exactitude du résultat, autrement dit le système ne doit pas simplement délivrer des résultats exacts, il doit les délivrer dans des délais imposés. Dans ce TP nous essaierons d’exploiter les connaissances acquises dans le cours à travers le développement d’une application temps réel sur web en se basant sur les technologies HTML, HTTP et NODEJS et ses frameworks.
Objectif L’objectif de ce TP est de mettre en pratique certains des concepts discutés dans le cours du Système temps réel et embarqués à l’aide d’une application web. L’application à développer doit permettre à ses utilisateurs d’interagir avec le serveur pour lui demander d’exécuter des requêtes sur son système de fichiers et retourner les résultats en les affichant sur la fenêtre du navigateur client. Pour pouvoir utiliser l’application, un utilisateur doit d’abord s’inscrire auprès du système en introduisant son nom et son prénom et en choisissant un login et un mot de passe pour des fins d’authentification. Les informations saisies par l’utilisateur doivent être inscrites dans une collection en mémoire ou dans une base de données No SQL telle que Mongo DB, ceci en utilisant la plateforme NodeJS pour la mise en place d’un serveur modulaire pour faciliter la maintenance et l’évolution de l’application tout en respectant les consignes indiquées .Les utilisateurs possédant un compte dans le système peuvent accéder à un ensemble de fonctionnalités/services en fournissant l’URI correspondant (login, logout, upload, show, find, …) : Le service login doit servir à ouvrir une session avec le serveur alors que le service logout permet de mettre fin à la session courante. Le service upload doit permettre à l’utilisateur de choisir une image pour son profil et la sauvegarder sur le disque du serveur pour pouvoir la retourner plus tard. Le service show, quant à lui, permet à l’utilisateur de retourner et afficher sur son navigateur la dernière image qu’il a chargée sur le serveur, sinon une image par défaut sur le système de fichiers. Enfin, le service find doit être demandé par l’utilisateur lorsqu’il veut afficher sur son navigateur l’ensemble des fichiers du serveur.
3 Outils et logiciels utilisés
Visual Studio Code : Visual Studio Code est un éditeur
de code extensible développé par Microsoft. Les fonctionnalités incluent la prise en charge du débogage, la mise en évidence de la syntaxe, la complétion intelligente du code, les snippets, la refactorisation du code et Git intégré.
Node.JS : Node.js est une plateforme logicielle libre en
JavaScript, orientée vers les applications réseau évènementielles hautement concurrentes qui doivent pouvoir monter en charge.
MongoDB : Mongo DB est un système de gestion de base
de données orienté documents, répartissable sur un nombre quelconque d'ordinateurs et ne nécessitant pas de schéma prédéfini des données.
JavaScript : JavaScript est un langage de programmation
de scripts principalement employé dans les pages web. Une grande majorité des sites web l'utilisent, et la majorité des navigateurs web disposent d'un moteur JavaScript dédié pour l'interpréter.
HTML5 : HTML5 (HyperText Markup Language 5) est la
dernière révision majeure du HTML (format de données conçu pour représenter les pages web). HTML5 est le langage de balisage conçu pour représenter les pages web.
CSS3 : Les feuilles de style en cascade, CSS, de l'anglais
« Cascading Style Sheets », forment un langage informatique qui décrit la présentation des documents HTML et XML. CSS devient couramment utilisé dans la conception des sites web.
4 I. Réalisation du TP : Implémentation des solutions a. 1 ère version de l’application : 1. Créer un fichier server.js
2. Exécution de node server.js
Si on exécute la commande node server.js dans le terminal, on ouvre le localhost : 8888 et le message Hello world s’affiche comme ci-dessous :
On peut améliorer le code d’avantage si on décompose l’implémentation en deux
modules.
b. 2eme version de l’application :
1. Création des modules : On commence par créer les deux modules index.js et server.js avec le code suggérer afin de rendre notre implémentation modulaire. 2. Exécution : On exécute la commande node index.js comme suit pour lancer le server
Puis on lance le local host et on aboutit au même résultat précèdent.
On peut penser à ajouter un 3eme module pour se charger du routage des requêtes.
5 c. 3eme version de l’application : 1. Création des modules : Dans cette implémentation nous allons donc créer 3 modules : server.js, index.js et router.js contenant le code indiquer.
2. Exécution : On exécute la commande node index.js dans le terminal et on essaie cette fois ci d’envoyer une requête, le console log nous indique que la requête est envoyé.
On peut donc penser à ajouter un 4eme module pour améliorer le code qui va s’occuper du traitement des requêtes spécifiques.
d. 4eme version de l’application :
1. Création des modules : Dans cette implémentation nous allons donc créer un 4eme module «requestHandlers.js» pour traiter les requêtes différemment en s’inspirant du code indiqué.
2. Exécution : On essaie cette fois ci les différentes requêtes que nous avons ajoutées, on appelle « find » par exemple :
e. 5eme version de l’application :
1. Création des modules et exécution : Dans cette version, notre implémentation est améliorée en permettant aux différents modules de retourner leurs résultats au serveur pour qu’il puise les retourner à son tour au client/utilisateur moyennant son objet réponse http. Si on essaie par exemple d’envoyer une requête pour une page non existante le message error not found s’affiche :
6 2. Fonction Start: On change le code de la fonction start pour qu’elle soit ainsi :
On remarque que la page prend du temps pour se charger, et si on demande un
autre service, il faut attendre que le service start s’exécute pour que le 2eme service fonctionne. Nous devons donc tenir en considération l’exécution asynchrone des différents services.
f. 6eme version de l’application :
Pour tenir en compte l’exécution asynchrone des services, nous allons éliminer les valeurs retournées par les fonctions services et nous les remplaçons par des écritures directement dans l’objet réponse HTTP passé comme argument aux différentes fonctions. Cette fois-ci, on ne rencontre plus le problème de la version précédente.
7 II. Extensions : Socket.io et Mongo DB a. Socket.io : 1. Installation des dépendances : Nous avons besoin d’un package.json pour cela on commence par la commande npm init -y
Installons socket.io
Puis nous avons besoin du Framework express
2. Exécution : On exécute la commande node index.js et on ouvre le local host 3000 dans le navigateur
Si on tape le localhost : 3000 le message hello world s’affiche compatiblement
avec notre implémentation
8 Et on appelle le service show par exemple qui fonctionne correctement.
b. Complétion de l’application web avec MongoDB :
1. Installation des dépendances : On a essayé d'intégrer le Framework Mongoose et la base de données MongoDB pour implémenter le stockage et la persistance de données de l’application. Il faut donc installer MongoDB et ajouter les dépendances de mongoose et mongo DB dans notre application. 2. Exécution : Nous avons donc créé une simple application avec la possibilité de l’authentification comme ci-dessous :
Premièrement l’utilisateur doit s’inscrire, son nom sera ajouté dans la base de données de MongoDB et ainsi il peut s’authentifier avec le compte crée :
9 Lorsque l’utilisateur s’authentifie, il est dirigé vers une sorte d’interface avec les services que nous avons implémenté upload, show, find et logout, si l’utilisateur choisit upload, il peut insérer du texte qui sera afficher dans le service show.
On peut retrouver les textes que nous avons ajouté simplement en cliquant sur le bouton show
10 Cliquez sur ce lien Git hub pour voir l’integralité du code.
Conclusion Ce TP était une occasion pour apprendre à maitriser certains aspects des sytemes temps réel sur le web et nous a permis de s’initier à NodeJS et plusieurs framework comme mongoose, socket.io et express tout en utilisant MongoDB. L’objectif de ce TP etait de mettre en pratique les acquis discutés dans le cours du Système temps réel et embarqués à l’aide d’une application web, ce qui nous a permis de mieux cerner la manipulation des technologies utilisées.
![Cours-TP_TI[1]](https://imgv2-1-f.scribdassets.com/img/document/57555608/149x198/650b04d670/1353527304?v=1)
