Remerciements :

Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Remerciements :
Je tiens tout d'abord à remercier Marc Barret (service des relations extérieures et valorisation),
mon maître de stage, qui m'a permit de réaliser ce projet.
Je voudrais remercier Marie Collin (chargée de communication) pour son sout ien et sa
gentillesse.
Je salue également Vincent Kober et Nabil Layaida, chercheurs, qui ont pris du temps pour
m’aider à résoudre les difficultés techniques.
Je tiens à montrer ma reconnaissance à Moha Ahbar, technicien, qui m’a aidé à configurer et
paramétrer ma machine.
Je souhaiterais exprimer ma gratitude envers toutes les personnes de l’INRIA qui ont permis à
ce stage de se dérouler dans une très bonne ambiance. Je pense notamment à Isabelle Rey,
Danielle Herzorg, Martine Consigny, Nadine.
Je terminerai en ayant une pensée pour Pierre, pour tout ce qu’il m’apporte.
Pour tous ceux-ci et bien d'autres, merci…
Alice Ravel
- SPECIFICATIONS -
p. 1
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
SOMMAIRE
INTRODUCTION
4
CONTEXTE
5
P RESENTATION DE LA STRUCTURE D’ACCUEIL
P RESENTATION DES ACTEURS DU PROJET
OBJECTIFS DU PROJET
5
5
5
SPECIFICATIONS
6
DESCRIPTION DU PROJET
OUTILS DE REALISATION
SCHEMA DE L’APPLICATION
6
8
8
CAHIER DES CHARGES
9
B ASE DE DONNEES
DESCRIPTION DE LA BASE DE DONNEES
SCHEMA DE LA BASE DE DONNEES
INTERFACES
INTERFACE DE RECHERCHE
AFFICHAGE DES RESULTATS
9
9
11
13
13
13
ETAPES DE LA REALISATION
14
INSTALLATION ET CONFIGURATION DES OUTILS
ENREGISTREMENT D’INTECH.MDB EN TANT QUE SOURCE DE DONNEES ODBC
CREATION DE LA BASE ET INSERTION DES DONNEES
CONFIGURATION DU SERVEUR (WEB.XML ET SERVEUR.XML)
MODELISER LA SERVLET
P ROGRAMMATION DE LA SERVLET
TRANSPOSITION DES RESULTATS EN XML
DEFINITION DE L’ERGONOMIE ET DE LA CHARTE GRAPHIQUE DE L’INTERFACE
14
15
16
16
18
19
19
24
AVANCEE DU PROJET
25
PLANNING DE TRAVAIL
DIFFICULTES RENCONTREES
SOLUTIONS APPRORTEES
25
26
27
CONCLUSION
27
DU POINT DE VUE PROFESSIONNEL
DU POINT DE VUE PERSONNEL
27
27
BIBLIOGRAPHIE
28
Alice Ravel
- SPECIFICATIONS -
p. 2
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
ANNEXES
29
ANNEXE 1 : PRESENTATION DE L’INRIA
ANNEXE 2 : ORGANISATEURS DES SEMINARIES MULTIMEDIAS
ANNEXE 3 : J AVADOC DES SOURCES DE LA SERVLET
ANNEXE 4 : INTERFACES
ANNEXE 5 : FEUILLES DE STYLE XSL
29
30
31
32
33
Alice Ravel
- SPECIFICATIONS -
p. 3
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
INTRODUCTION
Ce stage s’est déroulé dans le cadre de la formation du DESS DCISS de l’Unversité PierreMendès France à Grenoble. Il s’est effectué à l’INRIA Montbonnot du 24 Juin au 16
Septembre 2002, soit une durée de trois mois.
Le but de ce projet était de mettre en place un portail web, permettant ainsi à un public large
de faire des requêtes sur des séminaires multimédias hébergés sur les serveurs de l’INRIA. A
cela s’ajoutait la mise en place d’outils d’administration du portail ainsi que la rédaction de la
documentation de maintenance.
Dans un premier temps, je rappellerai brièvement le contexte du projet. J’aborderai ensuite la
phase de spécification, puis la rédaction du cahier des charges. Je développerai dans un
troisième temps les étapes de la réalisation : point de vue technique du projet ; puis l’avancée
du travail, point de vue plus personnel. Je terminerai par un bilan du stage, en retraçant les
acquis personnel et professionnel de cette expérience.
Alice Ravel
- SPECIFICATIONS -
p. 4
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
CONTEXTE
Présentation de la structure d’accueil
L’INRIA est un établissement public à caractère scientifique et technologique qui mène des
recherches avancées dans le domaine des sciences et technologies de l'information et de la
communication. Ce domaine inclut l'informatique et l'automatique, mais aussi les
télécommunications et le multimédia, la robotique, le traitement du signal et le calcul
scientifique Cf. Annexe1 : Présentation de l’INRIA.
L’INRIA entreprend continuellement des actions contribuant à la diffusion des connaissances
et du savoir- faire. Parallèlement aux autres unités de recherche, l'INRIA Rhône-Alpes a mis
en place un club de veille technologique, baptisé In'Tech. Sa vocation est de créer un lieu de
rencontres entre PME, industriels et chercheurs, et favoriser ainsi la veille technologique et
l'échange d'informations entre les différents acteurs du développement des Sciences et
Technologies de l'Information dans notre région. C’est dans ce cadre que se place mon travail.
Présentation des acteurs du projet
En partenariat avec GNI (Grenoble Network Initiative), l'INRIA Rhône-Alpes s'est équipé
d'une plate-forme de production et de diffusion en mode "streaming" de documents
multimédias synchronisés. Ils offrent ainsi un accès par le Web à un ensemble de séminaires
scientifiques. Ces séminaires sont donnés, entre autres, lors des rencontres du club de veille
technologique IN'Tech. Ils sont axés sur les sujets de l'actualité technologique (WAP, IPv6,
Java embarqué, MPEG4, UML...). La dizaine de séminaires actuellement en ligne est enrichie
des sessions de l'Ecole d'été PDMS 2001 (Production et Diffusion de documents Multimédia
Synchronisés) et des conférences sur les enjeux du numérique organisées par l'ISDN (Institut
des Sciences du Document Numérique en Rhône-Alpes). Cf. Annexe 2 : Organisateurs des
séminaires multimédias.
Avant la réalisation de mon stage, l’accès aux séminaires multimédia s’effectuait sur le site
web des différents organisateurs. La recherche en était fastidieuse dans la mesure où il fallait
consulter les trois sites pour trouver de l’information sur un thème donné.
Objectifs du projet
Le but de ce projet est donc de réaliser un portail. Ce portail permettra :
- d’indexer des documents multimédias synchronisés de façon à les valoriser ;
- de fournir un moyen d’accès interactif via le web ;
- de mettre en place des critères de recherche et des outils d’administration.
Alice Ravel
- SPECIFICATIONS -
p. 5
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
SPECIFICATIONS
Description du projet
L’INRIA Rhône-Alpes a réalisé en 2000 et 2001 une cinquantaine de documents multimédias
synchronisés, rendant ainsi disponibles en ligne autant de séminaires technologiques donnés
dans différents cadres (club IN’Tech, ISDN, école d’été, etc.). Cette base de documents
devant s’accroît re au fil des ans, il devient nécessaire d’indexer leur contenu pour en faciliter
leur consultation.
Cet outil se destine à un public large tel que :
- la presse ;
- les industriels ou PME-PMI ;
- les scientifiques de l’INRIA et de l’extérieur ;
- le grand public ;
- et enfin le jeune public.
Il doit permettre à ce public de rechercher un document multimédia en fonction :
- de l’auteur ;
- des éléments du titre ou du résumé ;
- du type de présentation (support de présentation, vidéo, etc.) ;
- du public cible ;
- de l’organisateur des séminaires (IN’Tech, PDMS, ISDN).
Alice Ravel
- SPECIFICATIONS -
p. 6
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Dans le cadre de ce stage, la réalisation de cet outil se limite à la mise en place d’une
« Smilthèque » (documents au format SMIL 1 ). A terme, l’objectif est d’intégrer à ce réservoir
de contenus multimédia, la vidéothèque, la photothèque et la docuthèque de l’INRIA, comme
le résume le schéma suivant.
Réservoir de
Schéma défini par Carole Silvy2
contenus extérieurs
Scientifique
INRIA
Editeurs
Public
Grand
Industriels
Presse
scientifiques
jeune
public
PME-PMI et extérieur
Rencontre
DISC
Direction
des
Relations
Industrielles - Club de veille
Intranet
Fonds
documentaire
partenaires
Direction
Scientifiques
Documentation
Littérature grise
partenaire
Réservoir de contenus (INRIA)
Smilthèque
Vidéothèque
Photothèque
Docuthèque
Présentation
multimédia
scientifique
« prestige »
Démo,
présentation
projet
Présentation
multimédia
scientifique
« prestige »
Présentation
multimédia
scientifique
« prestige »
Présentation
multimédia
didactique
Présentations
didactiques
Présentation
multimédia
didactique
Présentation
multimédia
didactique
Présentation
multimédia
veille
technologique
Présentation
multimédia
veille
technologique
Présentation
multimédia
veille
technologique
1
SMIL (Synchronized Multimedia Integration Language) est un standard adopté par le W3C (World Wide
Web Consortium). Il concerne les extensions multimédia du Web : diffusion de clips vidéo, de séquences
d'images ou de textes etc.
2
Carole Silvy travaille à la direction de l’information scientifique et de la communication (DISC). Cette
structure nationale regroupe toutes les unités de recherche coordonne la diffusion de l’information scientifique
produite par l’institut.
Alice Ravel
- SPECIFICATIONS -
p. 7
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Outils de réalisation
Le projet sera conçu avec les outils suivants :
- serveur d’application (Tomcat 4.0.1) ;
- sources de la servlet JAVA ;
- base de données : JDBC, SQL, Access ;
- génération des résultats : JAVA, DOM, XML, XSLT ;
- affichage des résultats : http ;
- Design : Photoshop6.
L’objectif étant la portabilité de l’application à différentes plates- formes (Windows, Linux) et
différents navigateurs (Netscape, IE) qui est donc assurée avec les langages JAVA, HTML et
XML.
Schéma de l’application
Le client interroge le serveur qui :
1- envoie des requêtes SQL3 à une base de données,
2- récupère le résultat dans un objet JDBC 4 ,
3- retourne le résultat au format HTML.
La première étape consiste à retourner le résultat dans un format HTML « à la main » c'est-àdire codé en dur, la seconde étape vise à transformer les résultats SQL en HTML grâce à la
technologie XML :
SQL [ DOM [ XML [ XSLT [ HTML
Principes de fonctionnement de la servlet:
Client web
(IE, Netscape)
Tomcat
Requête JDBC
Servlet
SQL
DB
JDBC
HTML
HTTP
3
4
SQL : Standard Query Language.
JDBC : Java DataBase Connectivity.
Alice Ravel
- SPECIFICATIONS -
p. 8
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
C AHIER DES CHARGES
BASE DE DONNEES
Description de la base de données
La base de données Portail.mbd se compose des tables suivantes :
Nom de la table
Description
Intervenant
Description de l’orateur de la présentation ou
(idIntervenant, nom, prenom, societe, mail, du séminaire.
biographie, photo, bio_url)
Langue (langue, idLangue )
Langue de la présentation.
Localisation
(localisation, idLocalisation)
Localisation des séminaires.
Presentation
Description des présentations.
(idPresentation, titre, idIntervenant, duree,
idSujet, resume, idLangue, urlMultimedia,
urlSupport, idSeminaire, illustrationPhoto)
PublicCible
(public, idPublic)
Public d’une présentation.
Sujet
(idSujet, libelleSujet)
Table des thèmes des séminaires et
présentations. A été définie comme plan de
classement du centre de documentation de
l’INRIA.
ResponsableScientifiqueSeminaire
(idSeminaire, idIntervenant) ;
Associe les responsables scientifiques aux
séminaires. Le responsable scientifique est la
personne en charge du programme du
séminaire.
PublicPresentation
(idPublic, idPresentation)
Associe les
présentations.
Alice Ravel
- SPECIFICATIONS -
différents
publics
aux
p. 9
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Nom de la table
Description
Seminaire
Description des séminaires. Un séminaire
(idSeminaire, titreS, dateS, idLocalisation, peut donc comporter plusieurs présentations.
resumeS, urlSeminaire, urlMultimediaS,
urlBibliographieS,
illustrationsPhoto,
idOrganisateur).
SupportPresentation
(idPresentation, idSupport)
Support
(idSupport, support)
Présentation ayant plusieurs types de support,
par exemple une vidéo, un support de
présentation (document powerpoint)
.
Support d’une présentation, par exemple
bibliographie, vidéo, support de présentation.
Organisateur
(idOrganisateur, organisateur, logo, url)
Description de l’organisateur d’un séminaire
(IN’Tech, PDMS, ISDN).
Le nom de la table figure en italique. La clé de la table est l’élément souligné.
Alice Ravel
- SPECIFICATIONS -
p. 10
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Schéma de la base de données
Schéma de la base donnée Portail.mbd, réalisé avec le logiciel Access.
Alice Ravel
- SPECIFICATIONS -
p. 11
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Certains champs de la base de données seront pré-établis pour en faciliter la saisie et la
cohérence. Ils ont été définis ainsi en fonction du cahier des charges (pour les publics) et en
fonction du classement documentaire du centre de documentation de l’INRIA (pour les
sujets) :
Public
-
:
jeune ;
grand-public ;
industriels ;
scientifiques ;
presse.
Sujet :
-
A : informatique fondamentale / informatique théorique ;
B : mathématiques numériques
Bs : statistiques ;
C : réseaux
Ca : architecture ;
Cs : systèmes d’explo itations ;
D : logiciels / programmation ;
Dw : web ;
E : intelligence artificielle / information structurée ;
F : bio- informatique (dont biologie) ;
G : traitement de l’information ;
H : vision / traitement d’images ;
I : robotique / mécanique ;
J : informatique et société ;
Z : divers.
Alice Ravel
- SPECIFICATIONS -
p. 12
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
INTERFACES
Interface de recherche
L’outil se destinant à un public large (jeune, grand public, industriels, chercheurs), l’interface
doit être ni trop simple ni trop complexe à utiliser :
Titre / Thème
Zone de texte
Auteur
Zone de texte
Support
Liste déroulante
Public
Liste déroulante
La recherche d’un thème ou d’un titre s’effectue dans les champs ‘Titre’, ‘mots-clés’ et
‘résumé’ de la table Presentation.
La requête combine tous les champs par défaut. C’est pourquoi l’utilisateur pour choisir
l’option « OU » pour le choix de son Titre / Thème (exe mple : informatique OU robotique).
Affichage des résultats
Titre présentation - Auteur(s)
lien vers séminaire
Date
Résumé
Diffusion multimédia (poids + durée) - Support de présentation (poids + type
de fichier)
Titre présentation - Auteur(s)
lien vers séminaire
Date
Résumé
Diffusion multimédia (poids + durée) - Support de présentation (poids + type
de fichier)
Les champs soulignés sont des liens hypertextes.
Alice Ravel
- SPECIFICATIONS -
p. 13
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
E TAPES DE LA REALISATION
Installation et configuration des outils
- le kit de développement java apliqué aux servlets : JSDK 1.4 ;
- un utilitaire de développement java : JCreator ;
- un serveur web : Tomcat 4.0 ;
- télécharger les librairies nécessaires (servlet.jar, package Xerces et Xalan d’Apache) ;
- un outil de gestion de base de données : Access ;
- les drivers appropriés à la base de données : JDBC-ODBC ;
- un outil de développement HTML : html kit ;
- un outil de développement XML : XML Spy.
Schéma de structuration du serveur :
Répertoire de
configuration
du serveur
Contient les
librairies
externes
Répertoire
racine
du
portail
Feuilles de
style css
JavaDoc
Photos des
intervenants
Scripts
javascripts
Logos de la
servlets
Alice Ravel
- SPECIFICATIONS -
p. 14
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Enregistrement d’INTech.mdb en tant que source de données ODBC
Principes de fonctionnement de l’Open Database connectivity (ODBC) :
Application JAVA
JDBC
(java.sql)
Driver
Driver JDBC/ODBC Bridge
Driver manager ODBC
Interface client SGBD
Interface serveur SGBD
JDBC est une API5 Java conforme au standard SQL-92 qui permet d’accéder aux bases de
données gérées par un SGBD6 . JDBC 7 spécifie l’architecture que ces drivers doivent
respecter. Pour notre projet, nous avons utilisé un pont JDBC-ODBC (standard d’accès défini
par Microsoft). Il impose le chargement dans la mémoire vive de la plate forme d’exécution
de librairies dynamiques.
5
API : Interface pour la Programmation d’Applications.
SGBD : Système de gestion de bases de données.
7
JDBC :Java DataBase Connectivity.
6
Alice Ravel
- SPECIFICATIONS -
p. 15
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Création de la base et insertion des données
Cf. Schéma de la BD p.8.
- 127 Présentations ;
- 37 Séminaires ;
- 121 Intervenants.
Configuration du serveur (web.xml et serveur.xml)
Fichier Serveur.xml :
Ajout du répertoire courant de travail :
<!-- Tomcat Manager Context -->
<Context path ="/manager" docBase=" manager" debug="0" privileged="true"/>
<Context path ="/MMportail" docBase=" MMportail" debug="0" privileged="true" reloadable ="true"/>
<!-- Tomcat Examples Context -->
Fichier web.xml :
Ce fichier contient les paramètres de connexion de la servlet à la base de données
- le nom de la servlet ;
- le codeOp de la servlet ;
- les paramètres de débugage ;
- l’url de connexion ;
- le nom du driver ;
- le login et mot de passe d’accès à la BD ;
- des informations sur l’auteur ;
- l’url de la servlet ;
- le nom de la première page de la servlet.
Alice Ravel
- SPECIFICATIONS -
p. 16
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>
<!-- Define servlets that are included in the example application -->
<servlet>
<servlet-name >ServletAccueil</servlet-name >
<servlet-class>ServletAccueil</servlet-class>
<init-param>
<param-name >codeOp</param-name >
<param-value>1</param-value >
</init-param>
<!--0 si debug, 1sinon-- >
<init-param>
<param-name >debug</param-name >
<param-value>1</param-value >
</init-param>
<init-param>
<param-name >database_generic_url</param- name>
<param-value>jdbc:odbc:Portail</param-value >
</init-param>
<init-param>
<param-name >database_driver</param-name >
<param-value>sun.jdbc.odbc.JdbcOdbcDriver</param-value >
</init-param>
<init-param>
<param-name >database_login</param-name >
<param-value>anonyme </param-value>
</init-param>
<init-para m>
<param-name >database_password</param-name >
<param-value>invite</param-value>
</init-param>
<init-param>
<param-name >author</param- name>
<param-value>Alice Ravel</param-value>
</init-param>
<init-param>
<param-name >mail</param-name >
<param-value>[email protected]</param-value>
</init-param>
<init-param>
<param-name >url</param-name >
<param-value>http://gnowee.inrialpes.fr:8080/MMportail/ServletAccueil </param-value >
</init-param>
</servlet>
<servlet- mapping>
<servlet-name >ServletAccueil</servlet-name >
<url-pattern >/ServletAccueil</url-pattern >
</servlet- mapping>
</web-app>
La servlet est installée sur un serveur local et sur le port 8080 :
Appel de la servlet : http://gnowee.inrialpes.fr:8080/MMportail/Servle tAccueil
Alice Ravel
- SPECIFICATIONS -
p. 17
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Modéliser la servlet
Servlet :
- récupère les paramètres de connexion ;
- récupère les paramètres du formulaire et les stocke dans un Vecteur ;
- passe les paramètres du formulaire à la classe DbAccess qui gère les requêtes SQL ;
- établit la connexion avec la BD ;
- affiche les résultats du formulaire grâce aux méthodes toHTML() des classes
Presentation, Seminaire et Intervenant.
Classe DbAccess :
- a pour attribut la connexion faite par la servlet ;
- récupère les paramètres du formulaire placés dans un vecteur par la servlet ;
- prend une requête, la construit dynamiquement, l’exécute correctement (connaît la
structure de la BD) ;
- retourne des objets qui répondent à des critères.
Classes Presentation, Seminaire, Intervenant :
- ont pour attribut les champs définis dans la BD ;
- ont un contructeur ;
- fonctions toHTML() et toXML() retourne le résultat (de type chaîne de caractère) dans
un format HTML
Class Seminaire{
Class Presentation{
Class Identifiant
Attributs
-Titre
-Resumé
-URL du séminaire
-URL du séminaire
multimédia
-URL des bibliographies
-Date
-Lieu
-Photos
Attributs
-Titre
-Auteur
-Résumé
-Url multimédia
-Url du séminaire père
-Titre du séminaire père
-Identifiant du séminaire père
-Identifiant de l’intervenant
Attributs
-Nom ;
-Société
-Mail
-Biographie
-Photo
-URL biographie
Méthodes
Méthodes
Méthodes
Seminaire ();
Seminaire (String titre,
String resume, String urlS,
String urlMS, String urlBS,
String dateS, String lieuS,
String photoS);
String toHTML();
}
Presentation(String titre, String
auteur, String resume, String
urlM, String urlS, String sem,
int inter, int semi)
String toHTML() ;
String chargerJavascript() ;
String toXML() ;
}
Intervenant() ;
Intervenant (String nom,
String societe, String mail,
String bio, String photo,
String bio_url);
String toHTML() ;
Alice Ravel
- SPECIFICATIONS -
}
p. 18
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Programmation de la servlet
Cf. Annexe 3 : Javadoc des sources de la servlet.
- Interface de recherche ;
- Affichage des résultats ;
- Affichage dans des ‘pop-up’ des objets Intervenant et Seminaire ;
- Affichage de toutes les présentations et de tous les séminaires ;
- Administration : Ajout – Modification – Suppression de présentations, séminaires et
intervenants.
Transposition des résultats en XML
Le principe consiste à récupérer dans un vecteur les résultats d’une requête SQL, de les parser
avec Xerces d’Apache pour en obtenir un arbre virtuel DOM et de leur appliquer enfin une
transformation XSLT :
Principes de fonctionnement d’une transformation XSLT :
Page web
Données
XML
HTML
Processeur
XSLT
BD
Feuille de style
XSLT
Principes de fonctionnement de DOM
Arbre DOM
Analyseur
syntaxique
Application
Java
Document
Elément
Noeud
Fichier
XML
Alice Ravel
Noeud
Noeud
- SPECIFICATIONS -
Noeud
p. 19
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Principes de fonctionnement d’une transformation XSLT avec JAXP :
1. Il faut dans un premier temps déclarer la ou les feuilles de style XSL au moment de
l’initialisation de la servlet. Pour obtenir le chemin d’accès, on se sert du contexte de
la servlet définie dans web.xml :
/**
*Initialisation du servlet
*@param config configuration
*/
public void init( ServletConfig config )
throws ServletException
{
super.init( config );
//Récupération des paramètres
…
//spécification de la feuille xslt
this.editXSLTFileName
=
INF/xslt/portail.xsl");
this.editXSLTFileNameIntervenant
=
INF/xslt/portail_intervenant.xsl");
this.editXSLTFileNameSeminaire
=
INF/xslt/portail_seminaire.xsl");
this.editXSLTFileNameSeminaireTous =
INF/xslt/portail_seminaire_aff_tous.xsl");
}
getServletContext().getRealPath("/WEBgetServletContext().getRealPath( "/WEBgetServletContext().getRealPath("/WEBgetServletContext().getRealPath("/WEB-
2. On utilise la méthode JAXP de JAVA :
//génère arbre DOM
public void generate(Vector vData)
{
try
{
//Recupère une instance du parser DOM
DocumentBuilderFactory dbf =DocumentBuilderFactory.newInstance();
DocumentBuilder db = dbf.newDocumentBuilder();
//On crée un objet Document
doc = db.newDocument();
}
catch(Exception e)
{
System.err.println("Error " + e);
}
Alice Ravel
- SPECIFICATIONS -
p. 20
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
3. On génère dans un troisième temps un arbre DOM. Cet arbre est créé dynamiquement
en fonction des résultats d’une requête SQL :
Element main,root,item;
//Elément racine
main = doc.createElement("PortailMultimedia");
main.appendChild(doc.createTextNode("\n"));
//Crée un arbre DOM avec les données des objets Presentation
for (int i = 0 ; i < vData.size(); i++)
{
Presentation p = (Presentation) vData.elementAt(i);
ptitre = p.getTitre();
pauteur = p.getAuteur();
pidAuteur = Integer.toString(p.getIdAuteur ());
presume = p.getResume();
…
//Element père
root = doc.createElement("Presentation");
root.appendChild(doc.createTextNode("\n"));
//Element ptitre
item = doc.createElement("Titre");
item.appendChild(doc.createTextNode(ptitre));
root.appendChild(item);
root.appendChild(doc.createTextNode("\n"));
//Element pauteur
item = doc.createEle ment("Auteur");
item.appendChild(doc.createTextNode(pauteur));
root.appendChild(item);
root.appendChild(doc.createTextNode("\n"));
…
//On ajoute les éléments parents
main.appendChild(root);
main.appendChild(doc.createTextNode("\n"));
}//fin boucle for
doc.appendChild(main);
}//fin de generate
Alice Ravel
- SPECIFICATIONS -
p. 21
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
4. Enfin, dans un dernier temps, on fait appel à une fonction qui reçoit comme argument
le canal de sortie de la servlet, l’arbre Dom généré, et un fichier XSL :
/*
*Génère le code XML
*/
private void showPage(PrintWriter writer , org.w3c.dom.Document domDoc, String
xsltFileName)
throws IOException, ServletException {
try {
File xslFile = new File(xsltFileName);
javax.xml.transform.Source
xsltSource
=
new
javax.xml.transform.stream.StreamSource(xslFile);
TransformerFactory tFactory = TransformerFactory.newInstance();
Transformer transformer = tFactory.newTransformer(xsltSource);
transformer.transform(new DOMSource(domDoc), new StreamResult(writer));
}
catch (Exception ex) {
System.err.println("pb ds showpage"+ex);
}
}
Alice Ravel
- SPECIFICATIONS -
p. 22
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Exemple d’objet DOM Présentation :
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE PortailMultimedia SYSTEM "Z:\XMLPortail\portail1.dtd">
<!--portail-->
<PortailMultimedia>
<Presentation>
<Titre>La technologie de base WS : SOAP UDDI WSDL </Titre>
<Auteur>Wain Jezz</Auteur>
<Resume>null</Resume>
<urlMultimedia >http://stream-serv.inrialpes.fr/intech/web_services/j_wain.ram</urlMultimedia>
<urlSupport >http://cgi-serv.inrialpes.fr/InTech/2001-12-05/webservices -jw.ppt</urlSupport >
<Seminaire>Les Úvolutions de l'Internet et du Web</Seminaire>
</Presentation>
<Presentation>
<Titre>Les protocoles avancÚs: workflow BPML/XLANG/WSFL</Titre>
<Auteur>Albrecht Alain</Auteur>
<Resume>null</Resume>
<urlMultimedia >null</urlMultimedia>
<urlSupport >http://cgi-serv.inrialpes.fr/InTech/2001-12-05/webservices -aa.ppt</urlSupport >
<Seminaire>Les Úvolutions de l'Internet et du Web</Seminaire>
</Presentation>
</PortailMultimedia>
Exemple d’objet DOM Intervenant :
<?xml version="1.0" encoding= "UTF-8"?>
<DescriptionIntervenant>
<Intervenant>
<Nom>Quint Vincent</Nom>
<Societe>W3C / INRIA </Societe>
<Mail>[email protected]</Mail>
<Biographie>Vincent Quint est directeur de recherche Ó l'INRIA.<br><br> Il est r
esponsable scientifique du projet OpÚra Ó l'INRIA Rh¶ne-Alpes et anime le domain
e ½ Document Formats + au World Wide Web Consortium (W3C) …</Biographie >
<Photo>photo_vquint.jpg </Photo>
<URLBiographie>http://www.w3.org/People/all#quint </URLBiographie>
</Intervenant>
</DescriptionIntervenant>
Exemple d’objet DOM Seminaire :
<?xml version="1.0" encoding="UTF-8"?>
<DescriptionSeminaire>
<Seminaire>
<Titre>XML: des principes Ó la pratique</Titre>
<Resume>Ce sÚminaire prÚsente les concepts du protocole WAP (Wireless Access Protocol) ...</Resume >
<URLS>http://cgi-serv.inrialpes.fr/intech/Registration?op =511&meeting =1</URLS>
<URLM>null</URLM>
<URLB>null</URLB>
<Date>20/01/2000</Date>
<Lieu>INRIA Rh¶ne-Alpes</Lieu>
<Photo>null</Photo>
<Logo>intech.gif</Logo>
<Organisateur >IN'Tech</Organisateur>
</Seminaire>
</DescriptionSeminaire>
Alice Ravel
- SPECIFICATIONS -
p. 23
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
Feuille de style XSL :
Première feuille de style créée :
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl=" http://www.w3.org/1999/XSL/Transform"
xmlns:fo="http://www.w3.org/1999/XSL/Format" >
<xsl:template match="/" >
<xsl:for-each select=" PortailMultimedia/Presentation" >
<ul><li>
<b><xsl:value-of select=" Titre"/></b>
<xsl:text> </xsl:text>
<xsl:value-of select="Auteur"/><br/>
<xsl:value-of select=" Resume"/><br/>
<xsl:value-of select=" urlMultimedia"/>
<xsl:value-of select=" urlSupport"/><br/>
<xsl:text>Pour en savoir plus sur le thème : </xsl:text>
<xsl:value-of select=" Seminaire"/><br/>
</li></ul>
</xsl:for-each>
</xsl:template >
</xsl:stylesheet>
Pour les besoins du projet, j’ai crée 4 feuilles de style :
- portail.xsl ;
- portail_intervenant.xsl ;
- portail_seminaire.xsl ;
- portail_seminaire_aff_tous.xsl.
Cf. Annexes 5 : Feuilles de style XSL.
Sortie HTML :
•
La technologie de base WS : SOAP UDDI WSDL Wain Jezz
http://stream-serv.inrialpes.fr/intech/web_services/j_wain.ram http://cgiserv.inrialpes.fr/InTech/2001-12-05/webservices-jw.ppt
Pour en savoir plus sur le thème : Les évolutions de l'Internet et du Web
Définition de l’ergonomie et de la charte graphique de l’interface
Cf. Annexe 4 : Interfaces
Alice Ravel
- SPECIFICATIONS -
p. 24
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
AVANCEE DU PROJET
PLANNING DE TRAVAIL
- Semaine 1 :
Installation et configuration des logiciels.
Documentation sur les servlets.
- Semaine 2 :
Rédaction des spécifications.
Rencontre et discussion avec les différents acteurs du projet (Marc Barret, responsable des
relations industrielles, Marie Collin, chargée de communication, Carole Silvy, direction de
l’information scientifique et de la communication, Isabelle Rey, documentaliste).
Réflexion sur la structure de la base de données.
- Semaine 3 :
Compréhension des sources de la servlet existante ‘Registration’ qui administre IN’Tech.
Mise en place de la base de données.
Programmation du corps de la servlet.
Interface de recherche.
- Semaine 4 à 6 :
Programmation servlet.
Requêtes SQl pour l’interrogation de la BD.
Récupération des résultats des requêtes SQL sous forme d’objets Presentation, Intervenant et
Seminaire.
Insertion du javascript pour l’affichage des objets Intervenant et Seminaire.
- Semaine 7 à 9 :
Code servlet : ajout, suppression, modification des présentations
- Semaine 9 à 11 :
Affichage des résultats, de toutes les présentations et de tous les séminaires en XML.
Transformation d’un Objet JAVA à en arbre DOM à puis en HTML grâce à JAXP.
- Semaine 12 :
Transposition de la base de données Access (système Win 32) sous Oracle (système Linux).
Ergonomie et graphisme.
Tests de validation du fonctionnement.
Alice Ravel
- SPECIFICATIONS -
p. 25
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
DIFFICULTES RENCONTREES
Ma première difficulté fut l’installation et la configuration de tous les outils (va riables
d’environnement, Path et CLASSPath). En effet, la première semaine fut consacrée à
l’installation et au paramétrage du serveur Tomcat, avec notamment ses fichiers de
configuration (web.xml et serveur.xml) en lien avec les path des librairies importées par la
machine virtuelle de JAVA (JDK).
Avant de commencer la programmation, j’ai dû me documenter sur la structure des servlets
(méthodes doGet(), doPost(), ouverture et fermetures des connexions à la BD, etc.). Je me suis
familiarisée également avec les servlets existantes (servlet qui gère les séminaires IN’Tech
notamment).
En ce qui concerne le développement, j’ai été confrontée à de nombreuses difficultés
techniques. Pour commencer, le serveur Tomcat exige de rafraîchir systématiquement l’écran
après chaque modification (voir de supprimer les fichiers ‘.class’). Couplé au temps pris par la
compilation des fichiers JAVA, j’ai perdu beaucoup de temps entre chaque modification
effectuée, d’autant plus que je procédais pas à pas.
D’autres contraintes techniques se sont présentées :
- concernant l’interface de recherche : écritures dynamique des requêtes SQL en
fonction des paramètres saisis par l’utilisateur ;
- ma base de donnée étant complexe, les requêtes devaient comporter de nombreuses
jointures pour éviter les doublons et autres bugs ;
- la gestion des erreurs SQL, notamment des champs NULL ;
- affichage HTML des intervenant s et des séminaires dans un pop-up en récupérant leur
identifiant.
Enfin, la transformation XML m’a causé de grosses difficultés avec en premier lieu l’écriture
de la feuille de style, puis l’appel de cette même feuille avec une fonction java qui prend en
entrée un arbre Dom et le transforme ensuite en HTML.
Alice Ravel
- SPECIFICATIONS -
p. 26
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
SOLUTIONS APPRORTEES
Pour contourner les contraintes techniques, je me suis fortement aidées de livres spécialisés
(Servlet, JAVA, XML, XSLT) cf. Bibliographie. J’ai aussi appris à être autonome et à
rechercher l’information dans les livres ou moteurs de recherche.
Par ailleurs, j’ai eu le soutien de chercheurs de l’INRIA tels que Vincent Kober, Nabil
Layaida et de mon maître de stage : Marc Barret, qui m’ont permis d’avancer et de surmonter
mes difficultés.
CONCLUSION
DU POINT DE VUE PROFESSIONNEL
Ces trois mois, très enrichissants, m'ont permis de me spécialiser dans un domaine qui me
passionne. L'environnement et le travail étant tout deux intéressants, je souhaiterais
poursuivre mes perspectives professionnelles dans ces domaines.
DU POINT DE VUE PERSONNEL
Ce stage m’a appris à me construire dans la mesure où j’ai été autonome et libre de mes choix.
J’ai appris tout au long de cette expérience à rechercher l’information manquante, j’ai été
confrontée à des difficultés techniques qui une fois surmontées m’ont permis de m’améliorer.
Alice Ravel
- SPECIFICATIONS -
p. 27
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
B IBLIOGRAP HIE
• Comment programmer en java / H. M. Deitel, P. J. Deitel – Deitel et Deitel
• Servlets Java : guide du programmeur / Jason Hunter - Edition o’Reilly
• Java et XSLT / Eric M. Burke – Edition o’Reilly
• Java et XML / Brett Mc Laughlin - Edition o’Reilly
• XML : langage et applications / Alain Michard - Eyrolles
Alice Ravel
- SPECIFICATIONS -
p. 28
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
ANNEXES
ANNEXE 1 : PRESENTATION DE L’INRIA
Alice Ravel
- SPECIFICATIONS -
p. 29
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
ANNEXE 2 : ORGANISATEURS DES SEM INARIES MULTIMEDIAS
- IN’Tech
Pour continuer et amplifier leurs activités menées dès 1994 au sein de ses différents groupes de
travail techniques (Expériences Avancées, Sécurité Réseaux, Java, Logiciels Libres), Grenoble
Network Initiative et l'INRIA Rhône-Alpes mettent en place au début de l'année 2000 un club de
veille technologique en Sciences et Technologies de l'Information, baptisé In'Tech.
C'est dans ce contexte que l'unité de recherche INRIA Rhône-Alpes propose d'animer ce groupe de
travail, dont la vocation est de créer un lieu de rencontres entre PME, industriels et chercheurs, et
favoriser ainsi la veille technologique et l'échange d'informations entre les différents acteurs du
développement des Sciences et Technologies de l'Information dans notre région.
L'animation de ce groupe de travail est confiée à Marc Barret, ingénieur au service des relations
industrielles de l'INRIA Rhône-Alpes, qui pourra s'entourer pour cela des compétences d'autres
acteurs de la recherche de notre région qui en manifesteraient le désir. Il est donc fait un appel aux
autres acteurs de la recherche et du développement technologique de GNI (IMAG, LETI, Xerox...)
pour constituer avec l'INRIA, le noyau d'animation du groupe In'Tech.
Dans un premier temps, le fonctionnement d'In'Tech va consister en l'organisation de séminaires,
sur la base d'une période bimestrielle. Chacun de ces séminaires abordera un domaine technique
identifié comme important par les membres du club, et tentera de couvrir à la fois ses aspects
théoriques et pratiques. Les intervenants seront principalement choisis parmi les acteurs de la
recherche, mais des intervenants industriels seront autant que possible conviés à démontrer des
mises en oeuvre et réalisations opérationnelles.
- PDMS : Production et Diffusion de documents Multimédia Synchronisés
Organisée par l'INRIA Rhône-Alpes, l'école a fait le point sur les nouveaux outils, environnements
et services pour la construction et la restitution de documents multimédias (technologies de
"streaming", représentation des documents aux formats W3C et ISO :
XHTML, SMIL, SVG, MPEG 4, MPEG 7, XMT, RTP, RTSP).
L’école fait le point sur les nouveaux outils, environnements et services pour la construction et la
restitution de documents multimédia sur l’Internet. Les thèmes couverts porteront sur la
représentation des documents aux moyen des technologies web élaborées au consortium World
Wide Web : documents synchronisés en SMIL (Synchronized Multimedia Integration Language),
dessins vectoriels en SVG (Scalable Vector Graphics), animations vectorielles au moyen du
langage SVG+Animation. Les standards multimédia développés à l’ISO seront également
présentés. En particulier, l’école proposera des tutoriaux sur les normes Mpeg4, Mpeg7 et XMT et
sur les technologies de transport en “streaming” de l’IETF.
- ISDN : L'Institut des Sciences du Document Numérique en Rhône-Alpes
Le 6 décembre 1999, les présidents de la CURA (Conférence Universitaire Rhône-Alpes) et de la
CDGRA (Conférence des Grandes Ecoles de la Région Rhône-Alpes) ont annoncé la constitution
d'un Institut des Sciences du Document Numérique (ISDN), destiné à fédérer les efforts de
recherche dans ce domaine à Lyon et en Rhône-Alpes et ont confié à l'ENSSIB (Ecole nationale
supérieure des sciences de l'information et des bibliothèques) le soin de coordonner cette
dynamique.
Alice Ravel
- SPECIFICATIONS -
p. 30
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
ANNEXE 3 : J AVADOC DES SOURCES DE LA SERVLET
Alice Ravel
- SPECIFICATIONS -
p. 31
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
ANNEXE 4 : INTERFACES
Alice Ravel
- SPECIFICATIONS -
p. 32
Développement d’un portail web pour l’accès à une base de séminaires
technologiques disponibles sous forme multimédia synchronisée
ANNEXE 5 : FEUILLES DE STYLE XSL
Alice Ravel
- SPECIFICATIONS -
p. 33