HAL Id: hal-02790530
https://hal.inrae.fr/hal-02790530
Submitted on 5 Jun 2020HAL is a multi-disciplinary open access archive for the deposit and dissemination of sci-entific research documents, whether they are pub-lished or not. The documents may come from teaching and research institutions in France or abroad, or from public or private research centers.
L’archive ouverte pluridisciplinaire HAL, est destinée au dépôt et à la diffusion de documents scientifiques de niveau recherche, publiés ou non, émanant des établissements d’enseignement et de recherche français ou étrangers, des laboratoires publics ou privés.
Développement du système d’information ”ImageSol”
pour le stockage et le partage d’images 2D et 3D
Killian Gard
To cite this version:
Killian Gard. Développement du système d’information ”ImageSol” pour le stockage et le partage d’images 2D et 3D. [Stage] France. Université d’Orléans (UO), FRA. 2019, 47 p. �hal-02790530�
Licence 3 Méthodes Informatiques Appliquées à la Gestion des Entreprises (MIAGE)
Pôle Informatique
UFR Collegium Sciences et Techniques, Université d'Orléans Bâtiment IIIA 6, rue Léonard de Vinci - BP 6759 45067 Orléans cedex 2 - France
Équipe SI Sol Service US Infosol INRA Centre Val de Loire Orléans 2163 Avenue de la Pomme de Pin CS 40 001 Ardon 45075 Orléans Cedex 2
Rapport de stage
Licence 3 M.I.A.G.E.
Sujet d’étude : Développement du système d’information
« ImageSol » pour le stockage et le partage d’images 2D et 3D.
Du lundi 8 avril 2019 au vendredi 30 août 2019.
Stagiaire : GARD Killian
Licence 3 M.I.A.G.E.
Maîtres de stage :
TOUTAIN Benoît : Chef de projet informatique du SI Sol LACOSTE Marine : Chargée de recherche, UR SOLS, porteuse du projet ImageSol
Page 1 sur 47
Sommaire
Tables des illustrations ...2
Remerciements...3
1 Introduction ...4
2 Contexte de stage ...5
2.1 Présentation de L’INRA ...5
2.2 Présentation du site INRA d’Orléans ...5
2.3 Présentation de l’unité Infosol ...5
2.4 Présentation de l’équipe SI sol ...6
2.5 Présentation de l’équipe ImageSol ...8
2.6 Description du sujet de stage ...8
3 Développement de l’application ImageSol ... 10
3.1 Analyse de l’existant ... 10
3.2 Analyse des besoins ... 10
3.3 Planification du travail réalié pendant mon stage ... 11
3.4 Présentation des réalisations techniques. ... 11
3.4.1 Réalisation d’une maquette de l’application. ... 11
3.4.2 Mise en place de l’environnement de travail et mise à niveau technique. ... 12
3.4.3 Construction du formulaire de saisie avec Vue.js. ... 14
3.4.4 Enregistrement des métadonnées avec API Platform. ... 20
4 Poursuite de stage ... 22
5 Bilan ... 23
6 Annexes ... 24
1- Document d’expression des besoins ... 24
2- Diagramme de Gantt du projet ImageSol ... 33
Page 2 sur 47
Tables des illustrations
Figure 1. Organigramme fonctionnel de l’unité de Service Infosol ...6
Figure 2. Organigramme de l’unité Infosol ...7
Figure 3. Structure de l’application ImageSol ...9
Figure 4. Capture d’écran de la maquette réalisée via Balsamiq Mockups ... 12
Figure 5. Structure du projet ImageSol sur Vue.js ... 15
Figure 6. Contenu de la vue Home.vue ... 16
Figure 7. Contenu du composant HelloWorld.vue ... 16
Figure 8. Extrait de la vue MainComponent.vue ... 16
Figure 9. Affichage du formulaire de saisie sur navigateur ... 16
Figure 10. Capture d’écran du fichier earlier.js contenant la règle personnalisée... 19
Figure 11. Capture d’écran du fichier HTTPClient.js ... 20
Figure 12. Contenu du fichier AgronomicContext ... 21
Figure 13. Documentation de l'API vue depuis un navigateur, réalisée automatiquement par API Platform et son module OpenAPI (ex. Swagger) ... 22
Page 3 sur 47
Remerciements
Je remercie Adeline AYZAC pour avoir transmis mon C.V. à ses collègues de l’INRA, et qui a permis un entretien avec Benoît TOUTAIN et Marine LACOSTE, chefs de projet à l’INRA.
Je remercie également Benoît TOUTAIN et Marine LACOSTE pour l’aide et leurs conseils apportés pendant ce stage.
Page 4 sur 47
1 Introduction
Dans le cadre de ma troisième année de Licence Informatique, il nous a été demandé de réaliser un stage en entreprise d’une durée minimale de 3 mois. J’ai obtenu un stage à l’Institut National de la Recherche Agronomique (INRA) à compter du lundi 8 avril 2019 jusqu’au 31 août 2019, pour une durée totale de 5 mois.
Le sujet d’étude de ce stage a pour but le développement d’une application web, nommée ImageSol, permettant à ses utilisateurs le partage d’images de Sol 2D et 3D, parfois sous forme de séries temporelles, ainsi que les métadonnées1 qui leurs sont associées. Il devra permettre à la communauté
scientifique de stocker ces données, de les consulter et de les télécharger pour pouvoir les réutiliser.
L’application devra permettre les actions suivantes :
La saisie d’une image et ses métadonnées grâce à un formulaire. La création d’une série temporelle et la saisie de ses métadonnées. L’ajout d’une ou plusieurs images à une série temporelle existante.
La visualisation, modification, suppression de ces images et métadonnées associées.
Le stockage des métadonnées s’effectuera dans un premier temps sur le système d’information centralisé qu’utilise l’INRA, data.inra.fr, basé sur le logiciel Dataverse développé par l’Université d’Harvard. Cependant, cette base de données ne peut prendre en compte certaines métadonnées ; la création d’une seconde base de données est donc nécessaire. C’est à travers le framework API Platform que cette base de données sera créée.
L’application sera développée en JavaScript à travers le framework Vue.js et le langage PHP pour la construction de la base de données via API Platform.
Dans un premier temps, je présenterai le contexte de mon stage avec une présentation de l’INRA, accompagnée d’une description de mon sujet de stage.
J’expliquerai ensuite les réalisations effectuées pour développer l’application, en commençant par une analyse des services existants, suivie d’une analyse détaillée des besoins. Ensuite, je reviendrai sur les différentes réalisations techniques majeurs de l’application : de la mise en place de la maquette à la configuration des relations avec les bases de données, en passant par l’architecture de l’application avec Vue.js.
Je poursuivrai sur le travail à effectuer dans la seconde partie de mon stage et, pour conclure, je ferai le bilan de cette première partie de stage.
Page 5 sur 47
2 Contexte de stage
2.1 Présentation de L’INRA
L'institut national de la recherche agronomique (INRA) est un organisme de recherche français fondé en 1946 et ayant le statut d'établissement public à caractère scientifique et technologique (EPST). L'INRA est placé sous la double tutelle des ministères en charge de la Recherche et de l’Agriculture. Cet organisme a été créé pour répondre à la pénurie alimentaire engendrée par la fin de la 2ème guerre
mondiale dans le but d’associer la science et la technologie afin d'améliorer les techniques de l'agriculture et de l'élevage.
Une fois ce problème résolu les objectifs de l'INRA changent et plusieurs missions lui sont confiées : Produire et diffuser des connaissances scientifiques.
Concevoir des innovations et des savoir-faire pour la société.
Éclairer, par son expertise, les décisions des acteurs publics et privés.
Développer la culture scientifique et technique et participer au débat science-société. Former à la recherche et par la recherche.
Ces missions couvrent un grand nombre de domaines tel que : les sols, le changement climatique, le carbone renouvelable, les systèmes agricoles à hautes performances environnementales (productions végétales et animales), les ressources en eau, la biodiversité, l'alimentation humaine, les biotechnologies végétales et les maladies émergentes, etc.
2.2 Présentation du site INRA d’Orléans
Aujourd'hui l'INRA regroupe 17 centres régionaux (en plus de son siège à Paris) répartis sur plus de 150 sites et emploie environ 8200 titulaires ainsi que de nombreux doctorants (environ 500) et stagiaires (environ 2600).
Le site INRA d'Orléans (faisant partie du centre INRA Val de Loire) compte 200 agents titulaires ainsi que 150 non titulaires et regroupe 2 pôles :
Dynamique des sols et gestion de l'environnement. Biologie intégrative des arbres et organismes associés.
2.3 Présentation de l’unité Infosol
Je réalise mon stage au sein de l'unité de service Infosol, appartenant au pôle Dynamique des sols et gestion de l'environnement, et créé en 2000 pour constituer un système d’information sur les sols de France et leurs évolutions.
Les activités de l'unité InfoSol s'exercent dans le cadre de la participation de l'INRA à un Groupement d'Intérêt Scientifique Sol (GIS Sol) qui propose un ensemble de programmes nationaux pour faciliter et encourager une gestion patrimoniale et durable des sols.
Page 6 sur 47
L'unité InfoSol coordonne l'acquisition des données nécessaires à la constitution de ce système d'information et réalise elle-même une partie de ces acquisitions. Elle assure le contrôle de la qualité de ces données et leur stockage. Pour cela, elle crée et alimente les bases de données permettant l'archivage et l'exploitation des informations.
Elle assure l'accès aux données à ceux qui le demandent, dans le respect des règles de la déontologie et des conventions passées avec les partenaires des programmes qu'elle réalise. Elle contribue à leur diffusion et à leur valorisation en assurant notamment l'articulation avec les bases de connaissances sur les sols et les outils d'exploitation thématique produits par les recherches de l'Institut.
L’unité Infosol est donc structurée en différentes équipes ayant pour tâche la gestion de l’acquisition des données sur le sol à l’échelle nationale, la capitalisation de ces données et leur exploitation (Figure 1).
Figure 1. Organigramme fonctionnel de l’unité de Service Infosol
Page 7 sur 47 Figure 2. Organigramme de l’unité Infosol
J'ai été intégré à l'équipe SI sol (Figure 2) chargée du maintien et du développement du système d'information des sols. Cette équipe comprend actuellement :
Le responsable du SI Sol et administrateur de systèmes d’information (titulaire) : Benoît TOUTAIN.
Un gestionnaire de données (agent titulaire) : Jean-Philippe CHENU. Un développeuse d'applications web (agent titulaire) : Hakima BOUKIR. Un charger de diffusion des données (agent contractuel) : Alexis MESSANT. Une intégratrice de données (agent contractuel) : Laura GAY.
Un responsable de parc informatique et administrateur système (agent titulaire) : Birama SALL.
Un stagiaire développeur d'application (agent contractuel) : Killian GARD.
Dans le cadre de la mise en œuvre du système d'information des sols, cette équipe a pour mission de produire des systèmes d'information pour la saisie, la consultation et la diffusion des données sur les sols, les déployer et les maintenir. Les bénéficiaires de ce travail sont les agents de l'unité, les partenaires du GIS Sol, les agents des autres départements de l’Inra, et les partenaires associés au sein des projets de recherche auquel l’unité Infosol participe.
Les activités d’animation de l’équipe SI se structurent autour d’une réunion hebdomadaire qui se déroule le vendredi matin afin de passer en revue l’avancement des tâches de chaque agent.
Page 8 sur 47
2.5 Présentation de l’équipe ImageSol
Le projet inter-unité ImageSol est le fruit d’une collaboration entre six unités du département EA (Environnement & Agronomie) de l’INRA. Ce projet est financé par le département EA pour une durée de trois ans (2018-2020) et est porté par Marine Lacoste (Chargée de Recherche, UR SOLS, INRA). Parmi les unités partenaires du projet, cinq rassemblent des agents qui produisent et utilisent des images de sol pour répondre à des questions de recherche : UR SOLS (Orléans), UMR SAS (Rennes), UMR EMMAH (Avignon), URM ECOSYS (Grignon), UMR LSE (Nancy).
L’objectif du projet ImageSol est de doter l’INRA d’un système d’information capable de stocker les images de sol et leurs métadonnées, puis de fournir à leurs utilisateurs potentiels des outils de recherche de ces images (consultation, tri sur des critères provenant des métadonnées...) à travers les métadonnées associées. Cette base d’images sera utilisée par pour traiter des questions scientifiques requérant des informations sur le sol, en analysant les images de sol ainsi disponibles de manière commune et mutualisée. L’ambition est à terme d’ouvrir cette base de donnée à l’international.
Deux des unités partenaires du projet sont situées sur le site INRA d’Orléans : l’US Infosol et l’UR sol. Des réunions hebdomadaires ont été organisées avec les principaux membres du projet ImageSol :
Le responsable du SI Sol et administrateur de systèmes d’information, Benoît TOUTAIN, également mon tuteur de stage.
La chargée de recherche de l’unité UR Sols porteuse du projet ImageSol, Marine Lacoste. Le stagiaire développeur d’application, Killian GARD.
Ces réunions ont été organisées pour faire le point sur mon travail, présenter les modifications apportées à l’application ImageSol lors de la semaine passée, puis dans un second temps, décider des améliorations et modifications à mettre en place pour la semaine suivante.
2.6 Description du sujet de stage
La réalisation de l’application web ImageSol permettra de centraliser des images (2D et 3D) dans un système d’information unique à l’INRA afin d’assurer leur stockage et de simplifier leur partage avec la communauté scientifique. Par l’intermédiaire de l’application ImageSol, les utilisateurs auront la possibilité d’enregistrer une image de sol avec les métadonnées qui lui sont associées, de créer une série temporelle composée de plusieurs images de sols (image d’un même échantillon de sol acquise à des moments différents) et accompagnée de ses métadonnées, et l’enregistrement d’une ou plusieurs images dans une série temporelle. Il sera également possible de visualiser, modifier, supprimer ces images par l’intermédiaire de l’application.
La structure du SI ImageSol a été déterminée lors de réunions réalisées avant ma venue (Figure 3). Le développement du SI ImageSol a été décomposé en deux parties, d’une part la réalisation du module
Page 9 sur 47
de saisie des images et métadonnées (module 1), d’autre part, la visualisation des données stockées à la fois sur le nouveau système d’information et sur le Dataverse (module 2).
Mon stage a pour objet en priorité la mise en œuvre du premier module et, si le temps le permet, la réalisation du module de visualisation de données pourra m’être assignée.
Les technologies sur lesquelles le projet ImageSol s’appuie, à savoir Dataverse et son API2, API Platorm
et Vue.js, sont nouvelles et donc en cours d’adoption au sein de l’unité Infosol.
Figure 3. Structure de l’application ImageSol
Le programme de travail établi au début de mon stage est le suivant :
Découverte des deux unités US Infosol et UR Sols, cadrage du travail dans le contexte des missions des deux unités.
Familiarisation avec les documents d’expression des besoins.
Montée en compétence sur les technologies à mettre en œuvre (API Platform et VueJS). Découverte de l’architecture REST3.
Analyse du besoin et rédaction des spécifications du formulaire. Mise en place de l’environnement de développement.
Développement des fonctionnalités, tests et corrections. Rédaction du rapport de stage.
Préparation de la soutenance.
2 Une interface de programmation applicative est un ensemble de classes, méthodes et fonctions qui sert de façade par laquelle un logiciel offre des services à d’autres logiciels.
Page 10 sur 47
3 Développement de l’application ImageSol
3.1 Analyse de l’existant
Pour mener à bien le projet ImageSol, l’utilisation d’une base de données pour stocker les images de sol ainsi que leurs métadonnées est indispensable. L’application sera développée en s’appuyant sur l’outil Dataverse data.inra.fr pour le stockage des images ainsi qu’une partie des métadonnées qui leurs sont associées.
Le site data.inra.fr permet le stockage des données de la recherche, en vue de leur diffusion pour la communauté scientifique. Il permet également de leur attribuer des DOI4, ce qui facilite la réutilisation
de ces données et valorise le travail des personnes qui ont contribuées à leur acquisition. Le site est basé sur l’application web Dataverse, développée par l'équipe de l’ « Institute for Quantitative Social » de l’université d’Harvard. Il permet ainsi de stocker les métadonnées qui décrivent les jeux de données enregistrés dans le dépôt. Cet outil est déjà mis en œuvre par l’INRA avec plus de 78 000 jeux de données déjà référencés. L’interaction avec cet outil se fera principalement au travers de l’API que l’application Dataverse met à disposition.
3.2 Analyse des besoins
Le projet ImageSol a démarré avant mon arrivé à l’INRA. Plusieurs réunions de projet avaient été organisées afin de rédiger le cahier des charges mais également, de définir les différents le contenu des métadonnées associées aux images et réfléchir à des pistes concernant les technologies à utiliser pour la création du SI SOL.
Suite à la phase de recueil des besoins auprès des partenaires du projet, un document centralisant les exigences fonctionnelles et non fonctionnelles, ainsi que les prémisses de leurs spécifications, ont été écrit (Annexe 1). Ce document contient les éléments suivants :
1) La liste des exigences fonctionnelles et non fonctionnelles. Les exigences sont décrites brièvement et sont identifiées par un code (B1, B2, B3 etc.).
2) Certains points critiques, comme les éléments concernant la gestion des droits, sont décrits plus en détail.
3) La liste des cas d’utilisation, eux aussi identifiés par un code (CU1, CU2, CU3 etc.), sous forme d’un tableau, qui permet de faire de lien avec les exigences et qui permet de vérifier que toutes les exigences sont couvertes par un cas d’utilisation.
4) La description de chacun des cas d’utilisation (titre du CU, rôle(s) auquel le cas d’utilisation s’applique, scénario nominal et scénario alternatifs lorsque nécessaire).
En accord avec mes encadrants, j’ai considéré que ce document constituait le cahier des charges (CDC) de l’application. D’autres documents qui ont aussi été rédigés avant mon arrivée, sont venus compléter le CDC :
4 DOI : Digital Object Identifier
Page 11 sur 47
La liste et la description des métadonnées, en français et en anglais, se rapportant à une image de sol.
La correspondance entre les métadonnées listées suite à la phase de recueil des besoins et les métadonnées qu’il est possible de décrire dans l’outil Dataverse.
3.3 Planification du travail réalisé pendant mon stage
Un diagramme de Gantt a été créé par Benoît TOUTAIN afin de définir et dater les différentes étapes de développement de l’application réparti sur l’intégralité de ma période stage. Ce diagramme m’a servi de cadre de travail dans la réalisation des tâches du projet. Le diagramme complet est consultable en Annexe 2.
3.4 Présentation des réalisations techniques.
Depuis mon arrivée au début du mois d’avril, j’ai essentiellement travaillé sur la structure du formulaire et son comportement côté client. Je me suis donc focalisé sur le « front end5 ». La partie « back end6 »,
consistant à enregistrer les données dans les bases de données Dataverse et ImageSol sera abordée après la soutenance de stage. A ce stade, j’ai réalisé la maquette du formulaire, qui a été validée par les partenaires du projet, puis j’ai mis en place mon environnement de développement et ai mis au point le formulaire sous Vue.js. Ce formulaire est construit avec des éléments Boostrap.js, il est internationalisé et réagit si l’utilisateur saisit des valeurs invalides.
3.4.1 Réalisation d’une maquette de l’application.
L’objectif de la première semaine de stage était la mise en place d’une maquette du formulaire de saisie de l’application ImageSol (module 1 du SI Imagesol, Figure 3). J’ai réalisé la maquette dans un document regroupant la totalité des champs nécessaires au formulaire de saisie de données.
L’application utilisée pour générer cette maquette est Balsamiq Mockups 3, un outil spécialement dédié à la réalisation de prototypes d’applications web ou mobile (Figure 4). Le logiciel met à disposition un ensemble d’éléments graphiques afin de simuler le fonctionnement d’une application. L’objectif de la maquette est la traduction des besoins exprimés par l’utilisateur. L’utilisateur peut visualiser les fonctionnalités de l’application grâce à un système de navigation intégré. L’utilisation d’une maquette est très importante pour correspondre au mieux aux exigences de l’utilisateur, mais surtout elle permet de concrétiser l’expérience finale qu’il en aura. Le processus de validation de la maquette permet ainsi de lancer le développement de l’application.
5 Désigne les programmes et services qu’utilise directement l’utilisateur via une interface graphique. 6 Dans le projet, je définis le backend comme l’ensemble des processus cachés à l’utilisateur mais nécessaires au fonctionnement de l’application.
Page 12 sur 47
Figure 4. Capture d’écran de la maquette réalisée via Balsamiq Mockups
3.4.2 Mise en place de l’environnement de travail et mise à niveau technique.
Avant de pouvoir commencer le développement de l’application sur le framework Vue.js, je devais mettre en place mon environnement de travail. La machine sur laquelle je travaillais était sous système d’exploitation Windows, cependant l’installation et la configuration de l’environnement était plus facile à mettre en œuvre sous Linux. J’ai donc configuré une machine virtuelle linux Ubuntu sous VirtualBox. L’utilisation d’une machine virtuelle permet la conservation d’un environnement de travail distinct et cloisonné. Les applications que j’ai installées sur la VM pour développer l’application ImageSol sont Vue.js et API Platform.
Vue.js :
Vue.js est un framework Javascript permettant de construire rapidement des IHM7 web. Ce framework
appartient à la famille des framework Javascript tels que Angular. Vue.js se distingue d’Angular par la taille réduite du code source à télécharger par les navigateurs pour mettre en route et faire fonctionner l’application. C’est un framework plus facile à prendre en main.
J’ai découvert le framework Vue.js au travers d’une journée de travaux dirigés organisée par mon tuteur. Quelques semaines plus tôt, Benoît Toutain avait suivi une formation sur Vue.js et commencé à écrire une application permettant des tester les principales fonctionnalités du framework. Il m’a dispensé une formation d’une journée pour m’expliquer son fonctionnement.
L’installation de Vue.js se fait par l’intermédiaire de l’environnement d’exécution Node.js et de npm, qui est le gestionnaire de librairies et de dépendances entre librairies. C’est par npm que l’on ajoutera les modules complémentaires nécessaires au projet ImageSol.
7 Interface Homme-Machine
Page 13 sur 47
Les commandes pour installer Node.js, puis l’utilitaire Vue CLI pour créer un projet Vue.js sont les suivantes (elles s’exécutent dans un terminal de la machine virtuelle) :
sudo apt-get -y install nodejs sudo npm install -g @vue/cli vue create nomProjet
API Platform :
API Plaform est un ensemble de composants, permettant de construire rapidement et facilement une API et dispose automatiquement une documentation au format OpenAPI (ex. Swagger). En définissant un POPO (Plain Old PHP Object) et en annotant cet objet avec les directives Doctrine, les primitives CRUD8 liées à cet objet sont automatiquement créées et mises en œuvre. C’est grâce à API Platform
que les métadonnées non prises en charge par Dataverse seront stockées.
L’installation d’API Platform nécessitait l’installation d’un outil de gestion nommé Docker Compose. Grâce à cet outil, il est possible d’installer localement des images de services (tel que postgres, mysql, nodejs, …), puis de gérer ces images via un document docker-compose.yml faisant interagir l’ensemble des images entre elles via une série de commandes. La communauté de Docker Compose ajoute de nouvelles images sur un git hub9 prévue à cet effet. Il est donc possible de récupérer des images par l’intermédiaire du git hub mais aussi de créer soi-même ses images via un Docker file. Lorsque l’on crée une image, il est nécessaire de renseigner la version de linux sur laquelle l’image va être construite puis l’ensemble des actions qui permettra la construction de l’image. Une fois les différentes images nécessaires installées, docker dispose de commandes pour gérer ces images : le démarrage de services, le redémarrage, la mise en place de logs et l’arrêt de services.
La commande d’installation de Docker Compose est la suivante :
Après l’installation de Docker Compose, l’installation et la configuration d’API Platform était nécessaire pour pouvoir, à terme, gérer la base de données ImageSol.
Les commandes pour installer API Platform et l’intégrer à Docker Compose sont les suivantes : wget https://github.com/api-platform/api-platform/archive/v2.3.6.tar.gz
tar xzf v2.3.6.tar.gz cd api-platform-2.3.6 sudo docker-compose pull
8 Create, Read, Update, Delete
9 Service web d'hébergement et de gestion de développement de logiciels, utilisant le logiciel de gestion de versions Git.
Page 14 sur 47
3.4.3 Construction du formulaire de saisie avec Vue.js.
Vue.js est un framework web JavaScript qui s’appuie sur l’agencement de composants pouvant être écrits et réutilisé par le développeur. Un composant est une instance de vue avec des options prédéfinies, qui est ensuite accessible dans n’importe quelle vue de l’application par un simple appel. Les fonctionnalités de Vue.js peuvent être complétées en important des librairies pour disposer par exemple de composants graphiques élaborés, de fonctionnalités d’internationalisation, de validation de formulaire, ou bien d’échange de données via des web services10. Je vais détailler l’utilisation de
ces composants dans la suite de ce chapitre.
3.4.3.1 Vue.js
Lorsque l’on installe Vue CLI, on dispose d’une série d’outils qui facilitent le travail de développement. Nous avons vu plus haut, que cet outil permettait de créer un nouveau projet. Le projet ainsi créé est une application « Hello World » qui permet directement de développer ses propres pages et ses propres composants. L’outil permet également de configurer les librairies de test à utiliser, les compilateurs de styles CSS, et de définir des éléments d’organisation du code source de l’application. Via la commande npm run serve, exécutée dans un terminal à la racine du projet, un serveur web réactif aux modifications apportées au code source est mis en place. Le développeur peut ainsi voire instantanément l’effet sur l’application des modifications qu’il apporte au code.
Comme l’application est configurée et installée avec npm, le développeur peut ensuite intégrer facilement de nouvelles librairies Javascript. Une autre commande importante est donc npm install : elle permet d’intégrer au projet une librairie préalablement disponible sur internet pour ajouter une fonctionnalité au projet.
Pour mieux comprendre comment fonctionne un projet Vue.js, voici une décomposition de l’architecture du projet Vue.js ImageSol (Figure 5) :
10 Protocole d’interface informatique permettant la communication et l’échange de données entre applications
Page 15 sur 47 Figure 5. Structure du projet ImageSol sur Vue.js
La structure adoptée par le framework est un dérivé du design pattern MVC (Model View Control) et est nommé le MVVM (Model View ViewModel). La différence entre ces deux structures est l’absence de contrôleur au profit d’un viewModel, il permet la liaison de données entre les vues et le modèle. Le viewModel permet, grâce au principe d’événements et de liaison de données, une interaction avec le modèle directement en modifiant la vue.
Chaque vue et composant au sein du projet suit une structure précise :
Des balises <template>, contenant les informations à afficher à l’écran. Des balises <script>, contenant le code Javascript du fichier.
Des balises <style>, contenant le code CSS pour la mise en forme graphique.
Le mécanisme utilisé par Vue.js est le système de composant. Pour pouvoir utiliser un composant, il est nécessaire d’importer le composant entre les balises script pour indiquer à la vue quel composant est utilisé. Il faut également renseigner l’utilisation des composants dans le champs components. Voici un exemple d’utilisation de composant afin de mieux comprendre son fonctionnement. La vue Home.vue ci-dessous (Figure 6) fait appel à un composant HelloWorld avec une variable (msg) en paramètre.
Regroupe l’intégralité des composants de l’application.
Contient les fichiers utiles à la configuration des outils API Platform et Dataverse ainsi que les fichiers alimentant les listes déroulantes de l’application.
Contient les fichiers nécessaires à la connexion d’API Platform et Dataverse ainsi que les validateurs personnalisés.
Fichiers nécessaires pour l’internationalisation de l’application (grâce au module i18n).
Fichier de configuration principal de l’application, défini les modules utilisés par l’application et les initialise.
Permet de définir les routes dans l’application ; chaque route doit décrire un chemin (path) et y associer un composant ou une redirection.
Contient toutes les vues de l’application, chaque vue contient un ou plusieurs composants.
Page 16 sur 47 Figure 6. Contenu de la vue Home.vue.
Figure 7. Contenu du composant HelloWorld.vue
Le composant HelloWorld à la possibilité de recevoir une variable comme spécifiée dans le champ props (Figure 7). L’affichage de la variable msg s’effectue entre les balises template par un appel à double crochets.
L’utilisation des composants au sein du projet ImageSol permet notamment une construction simplifiée de formulaire assez complexes. Le formulaire de saisie de métadonnées pour une image de sol contient plus de 60 champs, le structurer en composants permet une meilleure lisibilité du code (Figure 8 et Figure 9). L’ensemble des écrans du formulaire de métadonnées est en Annexe 3.
Figure 8. Extrait de la vue MainComponent.vue
Figure 9. Affichage du formulaire de saisie sur navigateur
Page 17 sur 47
L’utilisation du CSS pour organiser graphiquement les éléments visuels sur une application demande du temps à mettre en œuvre. L’intervention d’un framework graphique est préférable, et j’ai décidé d’utiliser Bootstrap Vue. Boostrap Vue constitue le portage des composants graphiques Bootstrap sous Vue.js. Les composants graphiques Bootstrap sont donc disponibles sous forme de composants Vue.js qui sont paramétrables.
Bootstrap Vue possède une très large collection de composants graphiques et est très bien documenté
sur https://bootstrap-vue.js.org/docs. Il fut très pratique d’agencer le formulaire par rapport au
différents composants graphiques qu’offre Bootstrap Vue (Annexe 3).
Grâce à ce module Bootstrap Vue, il est possible de créer des composants complexes de manière simplifié, comme le démontre cet exemple avec le composant b-table, qui permet d’afficher un tableau avec une ligne de code, en lui passant un objet Json contenant les données à lister :
<b-table striped hover :items="items"></b-table>
Cette ligne de code prend des données en entré et retourne un tableau de données. L’installation de ce module s’effectue avec la commande suivante :
npm install bootstrap-vue --save
Il faut aussi indiquer dans le fichier main.js pour avoir accès au module à travers toute l’application : Vue.use(BootstrapVue)
3.4.3.3 Internationalisation avec i18n
Suite aux besoins spécifiés dans le cahier des charges, l’application ImageSol doit d’être accessible au plus grand nombre. Après quelques recherches, l’utilisation du module vue i18n semblait simple et facile à mettre en place dans l’application.
L’installation de ce module s’effectue avec la commande suivante : npm install vue-i18n --save
Il faut aussi indiquer dans le fichier main.js pour avoir accès au module à travers toute l’application : Vue.use(VueI18n)
let locale = window.navigator.language const i18n = new VueI18n({
fallbackLocale: 'en', locale: locale, messages })
Une fois l’installation via npm terminée et l’importation effectuée dans le fichier main.js, le processus d’internationalisation nécessite un fichier contenant les diverses langues autorisées ainsi que les messages de chaque label.
Page 18 sur 47 export default { en: { message: { accueil: 'Welcome' }}, fr: { message: { accueil: 'Bienvenue', }}}
Fichier message.js contenant les messages de l’application.
A l’intérieur des vues et des composants, l’appel au message en question est possible grâce au paramètre v-html dans les éléments nécessitants un message :
<label v-html="$t('message.accueil')"/>
La langue est détectée directement auprès du navigateur utilisé, l’internationalisation est donc fonctionnelle. Un problème à régler est que l’on ne peut pas décider de la langue directement depuis l’application. Il faut mettre en place un système de changement de langue.
J’ai trouvé un moyen de mettre en place un changement de langue en ajoutant un second paramètre dans l’appel :
<label v-html="$t('message.accueil', 'en')"/>
Ainsi, par un système d’événement, il était possible de choisir la langue. Mais l’opération était longue à mettre en place, et une variable langue circulait entre les composants (ce qui pourrait poser des problèmes de maintenance dans le futur). Je me suis donc tourné vers une autre solution beaucoup plus facile à mettre en place. Au lieu de faire circuler une variable entre composants, je redéfinis directement la variable détectant la langue dans le navigateur de la façon suivante :
methods: {
changeLang(lang) {
this.$i18n.locale = lang; }
}
L’internationalisation est donc gérée par un simple bouton de changement de langue et applique la langue partout dans l’application sans pour autant rafraichir la page.
Cette internationalisation concerne également les listes déroulantes et les saisies avec complétion. L’application n’utilise pas de relation sur des bases de données pour implémenter les listes déroulantes, il est donc possible de définir localement les fichiers contenant les différents choix et leur traduction en anglais.
3.4.3.4 Validation du formulaire avec Vee Validate
Afin de gérer les potentielles erreurs sur les différents champs du formulaire dès qu’elles se produisent, la mise en place d’un module de validateur est requise. Le module utilisé sur le projet ImageSol est Vee Validate.
Page 19 sur 47
Son installation s’est effectuée de la même manière que les autres modules, par l’intermédiaire de npm et nécessite l’ajout du module Vee Validate dans le fichier main.js afin de l’utiliser dans le projet. L’installation de ce module s’effectue avec la commande suivante :
npm install veevalidate --save
Il faut aussi indiquer dans le fichier main.js pour avoir accès au module à travers toute l’application: Vue.use(VeeValidate, { mode: 'lazy', events: 'change', inject: true, fieldsBagName: 'veeFields', })
Son fonctionnement est simple : un paramètre v-validate s’ajoute dans l’élément de formulaire désiré et peut prendre en compte plusieurs validateurs sur un même élément :
<b-form-input name="taille_echantillon"
v-validate="{required= true, regex: /^-?\d+[.,]?\d{0,10}$/}" v-model="inputSamplingDepthTop"></b-form-input>
Dans l’exemple ci-dessus, si le champ de texte n’est pas rempli et que la regex11 n’est pas validée, alors
un message d’erreur s’affiche instantanément pour prévenir l’utilisateur de l’erreur.
La plupart des erreurs sont référencées dans la documentation officielle de Vee Validate, cependant il est aussi possible de mettre en œuvre ses propres validateurs.
Afin de gérer une validation sur une date pour quelle ne puisse pas être supérieure à la date du jour, j’ai créé une règle personnalisée (« custom rule » dans la documentation officielle sur https://baianat.github.io/vee-validate/guide/).
Figure 10. Capture d’écran du fichier earlier.js contenant la règle personnalisée.
11 Expression régulière en français, est une chaîne de caractères décrivant, selon une syntaxe précise, un ensemble de chaînes de caractères possibles.
Page 20 sur 47
Dans cette règle personnalisée j’ai utilisé un module de gestion de date, moment, toujours installé via npm, qui permet d’effectuer de formatages et des calculs sur les dates (Figure 10).
Après avoir importé la règle personnalisée dans le composant/vue, elle peut être appelée dans les paramètres de champs via la propriété v-validate :
<b-form-input type="date"
name="acquisition date"
v-validate="{required: true, earlier: true}" v-model="inputdateAcqImg"></b-form-input>
3.4.3.5 Accès au web service http avec la librairie Axios
Axios est un client HTTP utilisé dans le projet pour dialoguer avec API Platform. L’installation de ce module s’effectue avec la commande suivante :
npm install axios --save
Pour faire la relation entre API Platform et l’application ImageSol, il faut définir une classe HttpClient avec les différentes méthodes de création, de lecture, de mise à jour et de suppression.
Figure 11. Capture d’écran du fichier HTTPClient.js
La fonction présentée ici (Figure 11) permet de lancer la création d’une entité présente sur l’API. Axios va se charger, à partir des informations recueillies, de construire la requête HTTP12 correspondante
pour que l’API puisse l’interpréter correctement. Les requêtes sont lancées de façon asynchrone et renvoient des « promises » Javascript. L’écriture de « promises », comparée à l’utilisation de fonctions de « callback » facilite la lecture et l’interprétation du code.
3.4.4 Enregistrement des métadonnées avec API Platform.
Avant le début de la rédaction de ce rapport, j’ai effectué le travail de tri des données devant être stockées sur data.inra.fr et des données à stocker dans la base ImageSol. Cela m’a permis de construire le modèle de données de la base ImageSol. Je me suis basé sur un document listant les champs du
Page 21 sur 47
formulaire et leurs correspondances (ou leur absence de correspondance dans le Dataverse), document rédigé avec l’aide des personnes en charge de la maintenance de data.inra.fr. C’est à partir de ce travail que j’ai constitué quatre entités sous forme de POPO, correspondant chacune a un type de donnée différent dans le formulaire.
La Figure 12 montre un extrait de code d’un POPO utilisé dans API Platform. La construction de ces POPO se met en place grâce à des directives Doctrine ainsi que des annotations pour gérer (coté serveur) d’éventuelles erreurs.
Les différentes entités sont liées par un champ DOI commun, ce champ est l’identifiant unique créé lors de la création d’une nouvelle entité sur le Dataverse.
Figure 12. Contenu du fichier AgronomicContext
Lors du lancement du service API Platform par l’intermédiaire de Docker compose, une interface est générée sur le port 8080 et affiche l’API avec les différentes entités et les traitements potentiels sur les données (Figure 13).
En cas d’erreurs dans les POPO, et une fois le lancement du service effectué, les erreurs de syntaxes sont présentées. Les indications pour les corriger peuvent être compliquées à interpréter mais la
Page 22 sur 47
Figure 13. Documentation de l'API vue depuis un navigateur, réalisée automatiquement par API Platform et son module OpenAPI (ex. Swagger)
Une fois les POPO validés, l’API est prête à l’emploi. Les différents traitements possibles sur l’API retournent une réponse sous différents formats, par défaut les réponses retournées sont au format Json (Figure 14) :
Figure 14. Réponse retourner par l'API sur une requête HTTP GET
Lors de la soumission d’une nouvelle image, Dataverse va enregistrer les données qui lui sont envoyées mais va également retourner un DOI. Un DOI est un identifiant unique permettant de référencer un lien stable vers un objet scientifique et sa citation. Ce même DOI sera ensuite enregistré dans un champ prévu à cette effet dans chacune des entités que j’ai créées.
Page 23 sur 47
Mon stage au sein de l’INRA se termine le 31 aout prochain. Durant les prochaines semaines, je vais me concentrer sur l’enregistrement des données à la fois sur API Platform mais aussi sur le Dataverse. Le processus d’enregistrement doit d’abord créer le nouvel objet (appelé dataset) sur le Dataverse pour ensuite récupérer le DOI nouvellement créé pour ensuite procéder à l’enregistrement dans API Platform de chaque entité en renseignant le DOI.
Je devrai ensuite mettre en place le processus de gestion de données (consultation, modification et déréférencement des images) sur l’application ImageSol. La suppression de ces images n’est pas possible en l’état car Dataverse ne permet pas la suppression directe de données.
Enfin, je devrai modérer l’accès à l’application par l’intermédiaire d’un formulaire d’authentification et sécuriser les services web sur API Platform et Dataverse.
Si je dispose de suffisamment de temps, je commencerai le second module du projet (Figure 3) : la visualisation des données stockées à la fois sur le nouveau système d’information et sur le Dataverse. Ce module permettra la recherche d’images avec filtres de recherche, construits à partir des métadonnées des images.
A chacune des réalisations apportées à l’application, des procédures de test sont effectuées pour assurer le bon fonctionnement des fonctionnalités nouvellement ajoutées.
Enfin, la phase de mise en production est également prévue avant la fin de ma période de stage.
5 Bilan
Au cour de ces deux mois passés au sein de l’INRA et de l’unité Infosol, j’ai pu réaliser le développement d’une interface de frontend pour l’application ImageSol. La réalisation de cette interface a nécessité plusieurs étapes préalables :
L’analyse du recueil des besoins et des cas d’utilisations. Une mise à niveau technique sur les technologies utilisées. La configuration d’un environnement de travail.
La réalisation d’une maquette.
Le développement des fonctionnalités de l’application.
Cependant, le développement de l’application n’est pas terminé pour autant. La mise en place de la persistance des données dans les deux bases data.inra.fr et API Platform doit être configurée afin d’enregistrer les données. Il est aussi important d’ajouter les fonctionnalités de consultation, modification et de déréférencement des images enregistrées.
L’intégration de ce projet dans les services proposés par l’INRA offrira de multiples avantages à la communauté scientifique :
Centralisation et partage facilité des données sur les images de sol (issues de la tomographie 3D, d’analyses microscopiques, de scanner 2D, etc.).
Une meilleure visibilité des images pour favoriser la coopération sur des projets de recherche. Mise en sécurité des données.
Page 24 sur 47
Liaison des données images avec d’autres types de données (sol, climat, pratiques …) via l’intermédiaires d’autres bases de données, dont celles gérées par l’US Infosol ou l’UR SOLS. Structuration de collectifs autours des données du SI ImageSol.
Ce projet m’a permis d’intervenir à différentes étapes clés du développement d’un projet applicatif. J’ai participé au travail de réflexion sur la mise en œuvre de outils à utiliser, mais j’ai également effectué des démonstrations hebdomadaires des fonctionnalités de l’application ImageSol à mon tuteur ainsi qu’à Marine Lacoste.
La réalisation de ce projet m’a permis de monter en compétences sur l’utilisation de JavaScript avec Vue.js et API Platform, technologies que je ne connaissais pas avant mon arrivée à L’INRA.
Pour conclure, je suis très satisfait de cette expérience professionnelle qui me conforte dans mon choix de poursuivre mes études au travers du Master informatique MIAGE.
6 Annexes
1- Document d’expression des besoins
SI Image Sol : expression des besoins
Version Date Action Par qui ?
v1 23/08/2018 Création du document Benoît Toutain
v2 25/09/2018 Liste des besoins et des cas d’utilisation, Description de cas d’utilisation
Benoît Toutain, Marine Lacoste v3 03/10/2018 Mise en page,
Complétion de quelques cas d’utilisation
Benoît Toutain, Marine Lacoste v4 14/11/2018 Mise en page,
Complétion de quelques cas d’utilisation, Finalisation avant partage avec le groupe projet
Benoît Toutain, Marine Lacoste
v5 23/11/2018 Retour sur le document suite à la réunion de suivi de projet du 21/11 et à la
discussion sur les besoins
Benoît Toutain, Marine Lacoste
vdataverse 08/02/2019 Liste des besoins non couverts par les fonctionnalités de Data INRA (voir commentaires).
Benoît Toutain, Marine Lacoste
Page 25 sur 47
Contexte et objectif du projet informatique
Après un bref recensement auprès des équipes partenaires du projet, il s’avère que nous disposons déjà d’au moins 267 images 3D de sol acquises par tomographie à rayons-X.
L’objectif du projet est de développer et de mettre en œuvre un système d’information capable de stocker ces images, ainsi que les métadonnées qui leurs sont associées. Ce nouveau système
d’information devra s’intégrer dans le SI Sol maintenu par l’unité de service Infosol, afin de pouvoir à terme associer les images ainsi stockées avec d’autres types de données (descriptions et analyses de sol, pratiques culturales etc.)
Les images à stocker sont de plusieurs types : il peut s’agir de séries temporelles, permettant de suivre un processus au cours du temps sur un même échantillon de sol (comme par exemple la saturation en eau de l’espace poral), d’images ponctuelles permettant d’étudier l’état du sol à un instant donné, enfin d’images segmentées. Dans ce dernier cas, le lien avec l’image brute dont serait issue l’image segmentée doit être enregistré.
A compléter.
Avantages attendus de la réalisation du projet
Centralisation et partage facilité des données sur les images de sol issues de la tomographie 3D
Une meilleure visibilité des images pour favoriser la coopération sur des projets de recherche Mise en sécurité des données
Liaison des données images avec d’autres types de données (sol, climat, pratiques …) Structuration de collectifs autours des données du SI ImageSol
Page 26 sur 47
Besoins et contraintes identifiés
1 Besoins fonctionnels
Le besoin principal de l’application est de pouvoir gérer des images et les métadonnées associées résultant de prises de vue sur des échantillons de sol par tomographie 3D ou par appareil
photographique :
1.1.1 Soumission d’images dans le SI
B1. Saisir et enregistrer des images (2D, 3D, appartenant à une série temporelle) ainsi que les métadonnées associées et obtenir en retour un DOI. Les métadonnées peuvent être saisies de deux façons différentes :
B1.1 En saisissant dans des formulaires (certains champs sont obligatoires et d’autres non) B1.2 Optionnellement en téléversant un ou plusieurs fichiers dans lesquels les métadonnées
ont été consignées (fichiers de type docx, txt, xml etc.). Ces fichiers sont alors appelés « pièces jointes ».
B2. Relier à une image présente dans ImageSol une description d’un prélèvement et d’un profil de Sol de DonesolWeb3. La liaison peut se faire à travers d’identifiant du prélèvement enregistré dans Donesol3 (champ id_prelevement de la table data.prelevement de la base Donesol3).
B3. Relier à une image présente dans ImageSol la description d’un prélèvement et des
propriétés physiques stockées dans Pepsol. La liaison peut se faire à travers d’identifiant du prélèvement enregistré dans Pepsol (champ id_prelevement de la table data.prelevement de la base Pepsol)
1.1.2 Recherche et utilisation des images stockées dans le SI
B4. Consulter les images présentes dans le SI et les métadonnées associées :
B4.1 Visualiser la répartition spatiale des points de prélèvement correspondant aux échantillons à partir desquels les images stockées ont été obtenues.
B4.2 Rechercher des images selon des critères présents dans les métadonnées et les fichiers de métadonnées téléversés au moment de la soumission d’une image. Un utilisateur non connecté pourra connaître le contenu de la base de données, en interrogeant la base de métadonnées : un formulaire de recherche d’images, ouvert à tous, devra être accessible sans connexion.
B4.3 Visualiser des extraits des images stockées. Pour des images 2D, une vignette devrait suffire, pour des images 3D, plusieurs coupes dans l’image, horizontales et/ou verticales.
B4.4 Consulter les métadonnées des images.
B5. Télécharger sur son poste de travail les images, les pièces jointes et les métadonnées associées.
B6. Gérer l’ouverture des images aux autres utilisateurs de la plateforme. L’utilisateur doit pouvoir mettre un embargo sur les images qu’il soumet.
B7. Exporter pour VSoil des images segmentées
1.1.3 Gestion des images du SI
B8. Remplacer l’image et modifier les métadonnées et les informations liées à une image. B9. Supprimer l’image, les métadonnées et les informations liées à une image
Les autres besoins identifiés sont des besoins classiques qui relèvent du fonctionnement habituel des applications Web :
Page 27 sur 47
B10. Modérer l’accès au contenu de la base de données. Bien que nous souhaitions que l’application soit une application Open Access, les personnes désirant accéder au contenu de la base dans le but de télécharger les images devront s’enregistrer et faire une demande d’accès. L’acceptation de la demande d’accès sera soumise à un modérateur.
B11. Partager le contenu du SI avec la communauté internationale au travers d’une application qui soit « internationalisée »
B12. Activer une fonction de rappel du mot de passe
B13. Gérer les droits d’accès sur les images. Voir le détail de ce besoin au paragraphe Erreur ! Source du renvoi introuvable..
1.2 Besoins non fonctionnels
B14. Suivre les opérations réalisées sur le SI, et en particulier les téléchargements réalisés sur les images
1.3 Contraintes de conception
C1. Etre en conformité avec le RGPD.
C2. Fonctionner sur les navigateurs les plus courants (Chrome, IExplorer, Firefox). C3. Echanger les données de manière sécurisée via le protocole HTTPS.
C4. Utiliser l’application sur des ordinateurs de bureau ou des ordinateurs portables, avec des tailles d’écran plutôt grandes.
C5. S’authentifier sur la base du login Active Directory de l’Inra ou via un compte défini spécialement pour ImageSol.
C6. Téléverser et télécharger des images de très grosse taille (plusieurs Go) et éventuellement pouvoir reprendre un téléversement interrompu.
C7. Sauvegardes des images et des métadonnées associées.
C8. Opérer sur un système réactif. L’utilisateur doit pouvoir enchaîner la saisie et le téléversement des images sans attendre la fin du téléchargement des images précédemment saisies.
1.4 Règles de partage des données du SI Image Sol
Lorsqu’une image est déposée dans la base de données, le comportement de l’application ImageSol par défaut est le suivant :
Les métadonnées se rapportant à l’image sont visibles et interrogeables par tous (y compris par les utilisateurs qui ne se sont pas inscrits sur la plateforme
L’image et les pièces jointes sont téléchargeables par les utilisateurs qui se sont inscrits sur la plateforme et qui se sont connectés.
Pour restreindre le téléchargement d’une image et de ses pièces jointes, le déposant peut définir une période d’embargo. Lors de cette période d’embargo, seuls les utilisateurs appartenant à un groupe autorisé à accéder à l’image pourront télécharger l’image. Seuls l’administrateur de la plateforme et le déposant peuvent modifier la liste des utilisateurs autorisés.
Pendant la période d’embargo, les métadonnées de l’image sont publiques et peuvent être interrogées y compris par des utilisateurs qui ne sont pas inscrits sur la plateforme.
Page 28 sur 47
A l’issue de la période d’embargo, l’image devient téléchargeable par tous les utilisateurs inscrits et connectés.
Le tableau suivant résume les autorisations sur les données de la base ImageSol en fonction du statut de l’utilisateur de la plateforme :Statut de l’utilisateur Métadonnées de l’image ou de la série temporelle Image ou série temporelle et pièces jointes associées
Image ou série temporelle et pièces jointes associées sous embargo
Utilisateur non inscrit Interroger et lire - - Utilisateur connecté Interroger et lire Télécharger - Utilisateur membre d’un
groupe autorisé
Interroger et lire Télécharger Télécharger
Déposant / Administrateur Saisir Interroger et lire Modifier Supprimer Soumettre Télécharger Remplacer Supprimer Soumettre Télécharger Remplacer Supprimer
Page 29 sur 47
2 Liste des Cas d’Utilisation identifiés
2.1 Cas d’utilisation relevant des besoins fonctionnels
Identification du CU
Intitulé Objet métier Méthode Besoins couverts
Contraintes principales CU1 Saisir une image ou un
ensemble d’images dans le système avec les
métadonnées associées
Image Create Erreur ! Source du renvoi introuvable. C2 C3 C6 C8 CU2 Rechercher les images
soumises dans le système d’information
Image Read Erreur ! Source du renvoi introuvable.
CU3 Sélectionner des images Image Read B4.3
B4.4 B8 B9 CU4 Consulter la répartition
spatiale des images
Image Read B4.1
CU5 Modifier les métadonnées associées à une image
Image Update B8
CU6 Remplacer une image du SI Image Update B8 CU7 Lier une image du SI ImageSol
à un profil de sol décrit dans le SI DonesolWeb
Image Update Erreur ! Source du renvoi introuvable. CU8 Lier une image du SI ImageSol
à un prélèvement de sol décrit dans le SI Pepsol
Image Update Erreur ! Source du renvoi introuvable. CU9 Définir une période d’embargo
sur l’image
Image Update Erreur ! Source du renvoi introuvable. CU10 Supprimer des images et les
métadonnées associées
Image Delete B9
CU11 Saisir une nouvelle série temporelle dans le système, ainsi que les métadonnées associées
Série Temp. Create Erreur ! Source du renvoi introuvable. C2 C3 C6 C8 CU13 Sélectionner des séries
temporelles
Série Temp. Read B4.3 B4.4 B8 B9 CU14 Rattacher une image déjà
présente dans le SI à une série temporelle
Série Temp. Update Erreur ! Source du renvoi introuvable. CU15 Ajouter à une série temporelle
une image déjà présente dans le SI
Série Temp. Update Erreur ! Source du
Page 30 sur 47
renvoi introuvable. CU16 Ajouter à une série temporelle
une image stockée sur un ordinateur
Série Temp. Update Erreur ! Source du renvoi introuvable.
C6 C8
CU17 Supprimer des images d’une série temporelle
Série Temp. Update B9
CU18 Lier une série temporelle d’images du SI ImageSol à un profil de sol décrit dans le SI DonesolWeb
Série Temp. Update Erreur ! Source du renvoi introuvable. CU19 Lier une série temporelle
d’images du SI ImageSol à un prélèvement de sol décrit dans le SI Pepsol
Série Temp. Update Erreur ! Source du renvoi introuvable. CU20 Modifier les métadonnées
d’une série temporelle
Série Temp. Update B8
CU21 Supprimer une série temporelle
Série Temp. Delete B9
CU22 Télécharger les images et les métadonnées associées
Image Read B5 C3
CU23 Visualiser les images et les métadonnées associées
Image Read B4.3
B4.5 CU25 Visualiser une série temporelle
et les métadonnées associées
Série Temp. Read B4.3 B4.4
2.2 Cas d’utilisation relevant des besoins non fonctionnels
Identification du CU
Intitulé Objet métier Méthode Besoins
couverts
Contraintes principales CU101 S’inscrire comme utilisateur de
l’application
Utilisateur Create B10
CU102 Accepter l’inscription d’un utilisateur
Utilisateur Update B10
CU103 Se connecter à l’application Utilisateur Read B10 B15
C5
CU104 Changer la langue du système d’information
- - B11
CU105 Créer un utilisateur Utilisateur Create B10 CU106 Consulter les informations d’un
compte utilisateur
Groupe d’utilisateurs
Read B10 C1
CU107 Modifier un utilisateur Utilisateur Update B10 C1 CU108 Supprimer un utilisateur Utilisateur Delete B10 C1 CU109 Créer un groupe d’utilisateurs Groupe
d’utilisateurs
Create B13
CU110 Consulter les informations d’un groupe d’utilisateurs
Groupe d’utilisateurs
Read B13
CU111 Modifier les informations d’un groupe d’utilisateurs
Groupe d’utilisateurs
Page 31 sur 47 CU112 Supprimer un groupe
d’utilisateurs
Groupe d’utilisateurs
Delete B13
CU113 Affecter des utilisateurs à des groupes
Groupe d’utilisateurs
Create B13
CU114 Retirer des utilisateurs d’un groupe
Groupe d’utilisateurs
Update B13
CU115 Définir des droits en lecture pour des utilisateurs ou des groupes d’utilisateurs Utilisateur Groupe d’utilisateurs Droit Create B13
CU116 Changer de mot de passe Utilisateur Update B10 B12
C1
CU117 Modifier ses informations personnelles
Utilisateur Update B10 C1
CU118 Accéder aux informations personnelles
Utilisateur Read B10 C1
CU119 Se déconnecter - - B10
CU120 Se désinscrire - Delete B10 C1
Page 32 sur 47
3 Description des cas d’utilisation
3.1 CU1 : Saisir une image ou un ensemble d’images dans le système avec les
métadonnées associées
3.1.1 Acteur
Utilisateur authentifié
3.1.2 Préconditions
L’utilisateur s’est connecté au SI ImageSol
L’utilisateur a le droit de soumettre des images dans ImageSol
3.1.3 Scénario nominal
1) L’utilisateur accède à la page de saisie d’une image. La page permet de saisir des informations sur l’image (métadonnées techniques liées à l’image, des métadonnées descriptives de l’échantillon de sol, des métadonnées administratives, des données de liaison avec les SI DonesolWeb3 et Pepsol). Pour la consulter la liste complète des métadonnées, voir document ImageSol_Metadonnees.docx en cours de finalisation. La page de saisie permet également de soumettre le fichier image et des pièces jointes (par exemple un fichier d’entête DICOM) qui seront téléversés dans le SI ImageSol. Les données de liaison avec le SI DonesolWeb3 sont le numéro de profil (champ no_prof_base de la table profil) et l’identifiant de prélèvement (champ id_prelevement de la table prelevement). L’utilisateur peut saisir l’id_prelevement seul ou le no_prof_base seul. Les données de liaison avec le SI Pepsol sont les id_prelevement. 2) L’utilisateur saisit les informations dans les champs du formulaire, sélectionne un ou plusieurs fichiers image et fichiers en pièce jointe (ou une archive zip regroupant plusieurs fichiers) et valide le formulaire.
3) Après vérification du format d’image, le système enregistre les fichiers et les métadonnées associées. Si les informations de liaison avec DonesolWeb3 ou Pepsol sont présentes, le système vérifie l’existence des identifiants dans les bases de données Donesol3 et Pepsol avant l’enregistrement. Si les informations de liaison avec la base Donesol3 ne sont pas présentes : si un identifiant de profil a été fourni, alors un nouveau profil et un nouveau prélèvement sont créés dans la base Donesol3 et cet identifiant est intégré aux métadonnées enregistrées. Les profils créés à cette occasion sont affectés à une étude « ImageSol » de Donesol3.
4) Le système créé une ou plusieurs vignettes à partir du fichier soumis et des informations de création de vignette fournies par l’utilisateur (nombre de vignettes verticales et horizontales demandées) et les enregistre.
5) Le système notifie utilisateur que le téléchargement est terminé et que les métadonnées associées ont été enregistrées.
3.2 CU2 : Rechercher les images soumises dans le système d’information
3.2.1 Acteur
Utilisateur authentifié
3.2.2 Préconditions
L’utilisateur est connecté à l’application.
3.2.3 Scénario nominal
1. L’utilisateur demande à afficher le formulaire de recherche d’images.
2. Le système affiche le formulaire de recherche et dans un tableau la liste des premières images de la base de données.
Page 33 sur 47
3. L’utilisateur filtre les données du tableau en spécifiant les filtres à appliquer. Il peut également définir la structure du tableau à afficher.
4. Le système réduit la liste des images présentes dans le tableau en fonction des critères fournis par l’utilisateur. Le tableau comprend les images et les séries temporelles qui répondent aux critères de filtrage des métadonnées.
3.3 CU3 : Sélectionner des images
3.3.1 Acteur
Utilisateur authentifié
3.3.2 Préconditions
Le cas d’utilisation Erreur ! Source du renvoi introuvable. été exécuté
3.3.3 Scénario nominal
1. L’utilisateur sélectionne une ou plusieurs images dans la liste des images filtrées et valide.
3.4 CU4 : Consulter la répartition spatiale des images
3.4.1 Acteur
Utilisateur authentifié
3.4.2 Préconditions
Pas de condition 3.4.2.1
Scénario
nominal
1. Au niveau de la page de login, l’utilisateur peut visualiser la répartition spatiale des images et des séries temporelles. Le système affiche une carte des profils et des prélèvements auxquels sont rattachées les images.
3.5 CU5 : Modifier les métadonnées associées à une image
3.5.1 Acteur
Utilisateur authentifié
3.5.2 Préconditions
Etre connecté à l’application 3.5.2.1
Scénario
nominal
1. Exécution du Erreur ! Source du renvoi introuvable..
2. Exécution du Erreur ! Source du renvoi introuvable.. L’utilisateur ne sélectionne qu’une seule image.
3. Le système affiche le formulaire de modification d’une image. 4. L’utilisateur modifie les métadonnées et valide.
5. Le système enregistre les modifications saisies par l’utilisateur et affiche de nouveau le formulaire de modification.
Page 34 sur 47
Page 35 sur 47 Accueil de l’application
Page 36 sur 47
Formulaire : téléchargement de l’image
La présence de l’onglet de téléchargement de l’image dans l’application se déroulait après validation du formulaire sur la maquette, c’est la raison pour laquelle la maquette n’est pas identique à
Page 37 sur 47 Entête des métadonnées
Page 38 sur 47
Page 39 sur 47
Page 40 sur 47
Le but et éventuelles restrictions
Page 41 sur 47 Information sur l’échantillon
Page 42 sur 47
Page 43 sur 47
Page 44 sur 47
Page 45 sur 47
Page 46 sur 47
