XML Survival Guide Par Jyce3D (web:http://users.skynet.be/jyce3d) Même si ce document reste très incomplet, je tiens à remercier Dominique pour l aide précieuse qu il a apporté (même sans s en rendre compte ) à la rédaction de ce petit papier. En effet, ses connaissances dans le domaine ont été très éclairantes! I Introduction Le but de ce petit document est de donner une présentation non exhaustive de ce qu est XML, des possibilities d XML et de la manière d utiliser pratiquement XML. La première décrira partie brièvement XML La seconde partie : XML Survival Guide : donnera une présentation rapide des éléments fondamentaux d XML. La troisième partie évoquera les différentes techniques de transformations XML. La quatrième partie développera l utilisation de XML et XSL sur un exemple pratique. XML Design Goals A) Echanger des documents structurés à travers Internet. Dérive de SGML (Standard Generalized Markup Language). Valider ces structures au moyen des DTD (Data Type Definition ou Schemas) Un document XML contient des données définie en arbre. Document 1 * Element 1 * Attributs Un document DTD contient des méta données, la définition de ces données, ou des règles applicables aux entités : Ex l élément 1 doit contenir au moins 1 attribut. B) Séparer les données et la présentation de ces données (au moyen de XSL) Meta Donnée structurées (XML Document) Outils de Transformation (XSL,CSS, DSSL) Langage de présentation (HTML,DHTML,WML, ) XML et HTML XML est un méta langage capable de créer d autres langages. XML peut-être considéré comme une classe qui permet de définir des instances, HTML est l une de ces instances. Certains auront aussi entendu parler de XHTML, HTML ne respecte pas totalement le canevas XML en HTML on peut trouver des tags comme <BR> qui n ont pas besoin de tag fermant </BR> n existe pas. XHTML est une modification de HTML pour le rendre
XML compliant, en pratique ça n a pas vraiment révolutionné la chose mais bon il faut le savoir. II XML (Extensible MarkUp Language) XML est un moyen de représenter (définir) et d échanger des données sans confusion. DTD (Data Type Définition) ou les Schéma permettent de définir précisément la spécification des Tags de données. Seul, XML ne permet pas d afficher des données, dans un format voulu, il faut pour cela utiliser une XSL (Xml Style Sheet). Lors de la transformation du fichier XML vers une sortie HTML, on combinera souvent au HTML une CSS (Cascading Style Sheet) qui améliorera ostensiblement le rendu HTML. Remarque : XML est case sensitive. Eléments XML L élément contient une valeur et doit se trouver compris entre deux Tags Tags Vide <TAG/> ne contient pas de valeur exemple : <director>garvan, Corbeit</director> case sensitive (<Director> n a pas la même signification que <director>. Un tag peut contenir des paramètre ex : <MOVIE TYPE= «Policier»>The Usual Suspects</MOVIE> identique à la structure en éléments imbriqués suivante <MOVIE> <NAME>Usual Suspect</NAME> <TYPE>Policier</TYPE> </MOVIE> en pratique il vaut mieux éviter les attributs (ou paramètres), même si le langage de transformation utilisé dans les style sheets, offre des fonctions pour extraire les paramètre. Document XML Un fichier XML commence tjs par <?xml version= «1.0»?> Le fichier XML contient toujours un élément racine (root) Les tags (qui définisse un élément) vont toujours par paires : tag d ouverture : <TAG>, tag de fermeture : </TAG>. Excepté le tag vide : <TAG />, qui contient à la fois l ouverture et la fermeture. Exemple : en HTML on utilise très souvent le tag <br> pour faire un retour à la ligne.
En XHTML (HTML plus formalisé, et plus proche du XML) on utiliserait : <br /> plutôt que <br>. Un document XML est un fichier XML qui peut contenir d autres éléments XML imbriqués. Exemple : <MOVIES> <MOVIE ID= «00100»> <TITLE>The Usual Suspects</TITLE> <AUTHOR>Jim Carrey</AUTHOR> </MOVIE> <MOVIE ID= 00101 > <TITLE>Scarface</TITLE> <AUTHOR>Al Paccino</AUTHOR> </MOVIE> </MOVIES> Remarques : - La racine doit contenir un élément unique définit par un tag de début et un tag de fin - Les éléments sont toujours imbriqués et ne peuvent pas se recouvrir XML data islands (Ilots de données) Il s agit d une partie de document XML qui peut être utilisé par Javascript dans un browser IE5.5 ou Firefox. Chaque XML Data Islands dispose d un ID au moyen duquel les informations qu il contient seront référencées et utilisable par un Javascript. <HTML> <SCRIPT> // Fonction de traitement JScript function displayxmltohtml() { } </SCRIPT> <BODY onload= displayxmltohtml > <XML ID= «MYXML0100»> <MOVIES> <MOVIE ID= «00100»> <TITLE>The Usual Suspects</TITLE> <AUTHOR>Jim Carrey</AUTHOR> </MOVIE> <MOVIE ID= 00101 > <TITLE>Scarface</TITLE> <AUTHOR>Al Paccino</AUTHOR> </MOVIE> </MOVIES>
</XML> <TABLE name= «tbldisplay»> </TABLE> </BODY> </HTML> L idée est de parser les données XML référéencées par MYXML0100 via un script JScript, afin de les afficher sous forme formattée dans la table tbldisplay. Plutôt que d utiliser une feuille XSLT, on utilise JScript comme transformateur de donnée. XML Name Space Les DTD (ou Schémas) permettent de définir des entités XML, toutefois un DTD contenant des règles spécifique à un élément book, peut varier d une bibliothèque à l autre. Pour éviter d utiliser un validateur qui ne s appliquerait pas à notre définition de l entité, on utilise un préfix, ce préfix est une URL ou une URI qui permet d aller chercher précisément le validateur qui nous intéresse, on l appelle le name-space. ex : <bk :BOOK xmlns:bk= urn:booklover.org:bookinfo > </bk:book> En gros, le namespace référence une librairie contenant des éléments XML. Certaines librairies peuvent contenir des éléments de même noms, il faudra donc à se moment préciser le namesspace avant des les utiliser. XML Schemas Microsoft Extension for the DTD (Data Type Definition provided by W3C org) Avantage : Permet d utiliser des Variant comme type de donnée plutôt qu uniquement des strings. MSXML Parser supporte aussi bien les XML schemas que les DTD (heureusement). Ce sont en général des fichiesr.xsd (XML Schema Definition) Définition d un élément XML dans un DTD Pour valider un document XML on utilise un DTD ou un Schéma Fonctionnement très simplifié du DTD. ELEMENT fait tjs référence à un TAG qui sera utilisé dans le document XML <!ELEMENT MOVIE(NAME,TYPE)> <!ELEMENT NAME (#PCDATA)> // Parsed Character Data peut être parse et affiché par une XSL <!ELEMENT TYPE(#CDATA)> // n est pas parsé et pas montré On peut également définir la cardinalité + apparaît au moins une fois *plusieur instances? apparaît une fois ou pas du tout
ex : <!ELEMENT MOVIE(NAME+,TYPE?)> <!ELEMENT MOVIE(NAME TYPE)> peut contenir l un ou l autre. Définition d un document XML au moyen d un DTD Les schémas vont plus loin car ils permettent de définir autre chose que des #PCDATA ou des #CDATA, on peut utiliser des dates, des integers, des floats, malheureusement pas compatible avec W3C. Référencer un DTD à un fichier XML <!DOCTYPE advert SYSTEM "http://www.foo.org/ad.dtd"> Utiliser DOCTYPE XSL (Exentsible StyleSheet Language) Utilisée pour afficher des documents XML basé essentiellement sur CSS (voir CSS2) Cascading Style Sheet. Toutefois il ajoute 1. XSLT (XSL Transformation) qui est un langage script permettant d effectuer des formattages complexes sur les données. 2. Formatting Object qui permet également d inclure des formatages supplémentaires. (XSL-FO) III XML Transformations Il existe différent moyen d effectuer une transformation XML. Ils seront listés et rapidement passé en revue dans de paragraphe. 1- XSLT Nécessite deux fichiers : Un fichier.xml contenant les données qui seront transformées. ex : <scene> <FX>General Road Building noises.</fx> <speech speaker="prosser"> Come off it Mr Dent, you can't win you know. There's no point in lying down in the path of progress. </speech> <speech speaker="arthur"> I've gone off the idea of progress. It's overrated
</speech> un fichier XSLT contenant les styles à appliquer aux données. ex :...<xsl:template match="fx"> <fo:block font-weight="bold"> <xsl:apply-templates/> </fo:block> </xsl:templates> <xsl:template match="speech[@speaker="arthur"]"> <fo:block background-color="blue"> <xsl:value-of select="@speaker">: <xsl:apply-templates/> </fo:block> </xsl:template>... Ecriture d une XSLT (le mieux est d utiliser un éditeur) Une XSLT s applique à des parties du document XML ou à la globalité du document XML. La commande <xsl :template match = «<node>»> est utilisée à cet effet Une fois le fichier XSLT crée, il faudra utiliser un transformateur XML pour effectuer la transformation entre le format source, la xsl pour obtenir le fichier final. Ces transformateurs peuvent être inclus dans le browser, ou encore être appelé via le DOM. 2- Simple Api for XML (SAX2) Parser XML évènementielle, à chaque tag détecté un événement est lancé et une action y est associée. basé sur un modèle évènementiel. SAX s applique au fil de la lecture et ne permet de réaliser du traitement que lorsque est lancé l événement. SAX ne conserve pas le document en mémoire.=> Opération linéaire au fur et à mesure que les tags sont lus. Sax n est pas implémenté côté client pour le moment (technologie serveur) 3- XML Document Object Model (XML DOM) API (ensemble d interfaces réalisées par les composants Windows s occuppant de XML) que l on peut utiliser pour manipuler des données XML. Le document est considéré comme un arbre (à racine unique) Les éléments sont considérés comme des nœuds. IXMLDOMDocument : retourne une référence sur le DOM exposé par l objet DocumentElement : renvoit le root ChildNodes : list des nœuds enfants de l élément
Item : référence sur le nœud Text : Valeur texte du nœud L id est d office considéré comme le DOM Reconstruit un arbre en mémoire qui contient tout le document, on peut accéder à chacun des nœuds de l arbre plutôt basé sur un modèle Objet. Internet Explorer 5.0 possède un parser XML intégré qui présente le document sous forme d une arborescence, un peu comme l explorateur de fichier. Utilisation de DOM : En Delphi il est possible d utiliser la Type Library suivante afin d accéder aux interfaces COM et aux constantes prédéfinies de DOM : MSXML_TLB.pas Modèle Objet de DOM XPATH Parser * IXMLDOMDocument +createprocessinginstruction() +createelement() +createattribute() +CreateTextNode() IXMLDOMNode +appendchild() +attributes() +selectsinglenode() +selectnodes() 1 1 IXMLDOMNodeList 1 IXMLDOMText IXMLDOMCData IXMLDomElement IXMLDOMDocumentType IXMLDOMAttribute IXMLDOMProcessingInstruction +Text() IXMLDOMDocument : Cette interface permet de créer ou manipuler des documents XML. Un Document XML n est rien d autre qu un nœud XML ayant quelques méthodes supplémentaires permettant la création des divers objets XML. Les objets XML crées par les méthodes de création du document ne sont lié à rien du tout. Il vous faudra impérativement les lier au nœud désiré une fois construite.
IXMLDOMNode : Ceci est l élément cœur de DOM, en DOM la plupart des objets dérivent d un XMLDOMNode. Chaque nœud contient une Node List enfant, et cette Node List contient des nœuds, qui eux même recontiennent une nouvelle node list, c est récursif. Méthodes utiles : AppendChild : permet d ajouter dans la liste des nœuds enfant un objet crée par une methode XMLDOMDocument.Create «Something». Attributes :cette méthode permet d accéder aux attributs d un nœud, pour les lire, en ajouter ou les modifier. SelectSingleNode( Nodename ) : permet de retrouver un nœud SelecNodes( XPATHQuery ) : permet de retrouver des nœuds au moyen d une query XPATH. IXMLDOMElement : Il s agit d un nœud nommé, par exemple un tag HTML est un IXMLDOMElement. Méthode utile : Rien, à la création on passe son nom IXMLDOMAttribute : Il s agit d un attribut d élement (ou de nœud) Méthode utile : Text contiendra la valeur de l attribut accessible en lecture ou en écriture, le nom de l attribut est passé au moment de sa création. 3.1 - Cas d utilisation pratique du DOM en Delphi Ne pas oublier d inclure dans la clause «uses» de Delphi MSXML_TLB.pas Créer un document XML et ajouter des élements DomDoc:=CoDomDocument.Create; Cette méthode permet de créer le nœud document, elle est directement définie dans MSXML_TLB. Une fois ceci fait, il faut préciser le type de version XML utilisée. Ceci se fait en créant un objet de type XMLDOMProcessingInstruction XMLNode :=DomDoc.CreateProcessingInstruction( xml, version = «1.0» ) ; Ensuite il faut attacher ce nœud au nœud document DomDoc.appendChild(XMLNode) Ou pour les fainéants : DomDoc.appendChild(DomDoc.CreateProcessingInstruction( xml, version= «1.0» )) ; A présent nous pouvons ajouter notre premier nœud élément, notez qu en utilisant des éléments, les nœuds sont automatiquement fermés par DOM : XMLNode := DomDoc.CreateElement( MOVIES ) ; DomDoc.appendChild(XMLNode) ; Ceci aura pour effet d ajouter
<MOVIES></MOVIES> dans le document XML. Evidemment c est parfois embêtant pour pouvoir lire le document et on serait tenté d ajouter un espace, rien de plus simple Il suffit d ajouter un carriage return sur le XMLNode courant : XMLNode.appendChild(DomDoc.CreateTextNode(chr(13)+chr(10))) ; Et le tour est joué, on obtient alors <MOVIES> </MOVIES> Ce qui est bien sûr plus lisible! Ajouter un attribut à un élément TODO : Ouvrir un document XML et récupérer certains nœuds TODO : Lire la valeur d un attribut TODO :
IV. Exploitation de XML et de XSL sur un exemple pratique Résumé des étapes pour utiliser XML correctement Créer un DTD : dans le but de valider un fichier de données XML Lier le fichier de données XML au DTD ainsi définit. <? xml version= «1.0» standalone= «no»?> Afficher et valider dans IE5 Utiliser SAX2 pour formater des données ou Utiliser DOM pour afficher des documents XML en jscript, affichage plus complexe. ou Utiliser XSLT pour formater les données, si la sortie se fait au format HTML, il est conseillé d utiliser les CSS pour simplifier la gestion des styles. Utilisation pratique de XSLT L exemple donné ici montre comment utiliser une XSLT pour transformer un document XML en HTML : 1. Créer un document de données XML Préciser la version XML et le charset utilisé (intéressant si on veut utiliser des accents particuliers) Je ne sais pas comment fonctionne les charset mais celui-ci paraît bien utile : iso-8859-1 pour les caractères latins. Le mieux toutefois, est souvent de ne pas préciser le charset pour éviter les problèmes, toutefois si vous développez pour des pays ayant un alphabet différent du nôtre ça peut être intéressant. <?xml version="1.0" encoding="iso-8859-1"?> une fois ceci définit on peut définir les entités : <webpage> +-- <banner /> <! Display the banner of the site > +--<toolbar selected= «item_n» /> <! will display a toolabar with a selected item> +--<heading type= «1»> <!-- ici type est un attribut xml> + --*<pa>blabla</pa> <! --contain the paragraph> </webpage> Voici la description XML de quelques entités qui seront utlisées dans un petit projet de test. On pourrait lier ce fichier à un DTD ou un schéma, pour valider les données, mais nous ne le ferons pas dans le cadre de cet exemple : Exemple : Le fichier de donnée novels.xml :
<?xml version="1.0" encoding="iso-8859-1"?> <?xml-stylesheet href="webpage.xsl" type="text/xsl"?> <webpage title="the Novels page"> <banner /> <toolbar selected="novels" /> <heading type="1" >Nouvelle 1</heading> <pa>blablalbalblalbalbal</pa> </webpage> La seconde ligne du fichier de donnée : <?xml-stylesheet href= «webpage.xsl» type= «test/xsl»?> référence le fichier xsl qu il faudra appliquer pour transformer les données en html. Dans notre cas, ce sera IE6 qui se chargera dans la transformation : En effet, IE6 peut directement charger et transformer un fichier.xml en.html si celui-ci contient une référence vers une stylesheet xsl. Il est bien sûr possible d utiliser des transformateurs séparés d IE. 2.Construction de la XSL : Xml style sheet. Ce document va décrire au transformateur XML comment transformer les données brutes XML en HTML. L élément <webpage title> contient l en tête et le body d un document web ; concrètement le tag webpage sera remplacé par la xsl par : <html><head> <link rel="stylesheet" type="text/css" href="stylesheet.css" > <title>banner</title> </head> <BODY bgcolor="#000000"> Et l élément </webpage> serait remplacé par </body></html> En réalité cela ne fonctionne pas comme cela, mais plutôt récursivement : - Remplacer webpage par les lignes précédentes - Appliquer les autres templates disponibles - finir par </body></html> En effet, si on n applique pas récursivement les autres styles disponibles on risque de se retrouver avec un formatage très limité. Voyons tout de suite par l exemple :
L objet fondamental que l on utilise pour la transformation est le template (le modèle) : l objet modèle permet de rechercher des éléments et de fournir un display de ce qui se trouve entre la section template : Il peut également récupérer des paramètres et les ajouter, nous verrons cela par la suite : Il peut également appeler d autres templates récursivement : IMPORTANT : Pour que le template fournisse de l html il faut préciser son OUTPUT par en configurant l objet XSL <xsl:output method="html" indent="yes" /> La première commande fondamentale de XSL est la commande MATCH= «élement» dont la syntaxe est <xsl :template match= «/»> : premier élément du fichier XML (root) de donnée (on pourrait donner webpage mais c est plus simple comme ça) Voici le premier exemple de code : <?xml version="1.0" encoding="utf-8"?> <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/xsl/transform" version="1.0"> <xsl:output method="html" indent="yes" /> <xsl:template match="/"> <HTML><head> <link rel="stylesheet" type="text/css" href="stylesheet.css" /> <title>a définir par un paramètre</title> </head> <BODY bgcolor="#000000"> <xsl:apply-templates /> <!-- Appliquer tous les autres templates qui seront définis plus bas dans la section --> </BODY> </HTML> </xsl:template> </xsl:stylesheet> à présent il nous reste à définir un lien entre le document XML de donnée et la style sheet qu il devra utiliser : Ceci se fait au moyen du tag : <?xml-stylesheet href="webpage.xsl" type="text/xsl"?> Après avoir complété mon fichier de données, je peux tenter de l ouvrir avec IE6 : Le résultat n est pas très beau puisque j obtient une page noire : Remarque : Le code HTML proposé ici utilise une CSS. Voir la ligne : <link rel="stylesheet" type="text/css" href="stylesheet.css" />
Propose dans le code de la xsl. Cette CSS nous sera très pratique pour définir des styles html (cfr Frontpage). L utilisation conjointe de Cascading Style Sheet (CSS, purement pour la partie HTML de display) et XSL (Xml Style Sheet) pour transformer la partie donnée est grandement recommandée pour obtenir du HTML plus lisible (CSS) et surtout indépendant de l affichage (XSL). Voici une partie du contenu du fichier «stylesheet.css» : p.pa { font-family: Verdana; color: #C0C0C0; fontstyle: italic ; font size: 8pt ; font-weigth : bold } h1 { color: #00FFFF; font-size: 18pt; fontfamily: Verdana;font-variant : small-caps } h2 { color: #99FFFF; font-size: 14pt; fontfamily: Verdana;font-variant : small-caps } TR{ } TH { font-family: Verdana;font-variant : small-caps font-size: 14pt; text-transform: capitalize; text-align: left; font-weight: normal; color: #99FFFF; } a.pl { font-family: Verdana; color: #F0F0F0; fontstyle: italic ; font size: 8pt ; font-weigth : bold } L utilisation des CSS ne sera pas décrite dans ce document, mais des utilitaires, comme Front Page ou même MS Word, peuvent aider à réaliser facilement des CSS. Voici tout de même un petit exemple : p.pa { font-family: Verdana; color: #C0C0C0; fontstyle: italic ; font size: 8pt ; font-weigth : bold } Cette ligne signifie que le tag HTML <p>, qui indique un paragraphe disposera d un style appelé «pa» définit par les propriétés entre {}. Pour appeler ce nouveau style en HTML, il suffira d ajouter l attribut class= «pa» au tag <p> Ex : <p class= «pa» >Texte formaté en pa</p> L élement <banner> : Il faut maintenant que la stylesheet traduise le tag banner en html : pour cela elle va utiliser un autre template La banière est constituée d un tableau centré contenant deux images : il est affiché par le code HTML suivant : <div align="center">
<table><tr><td><img src="bannerleft.jpg" border="0"></td><td><img src="bannerright.jpg" border="0"></td></tr> </table></div> Le remplacement bête et méchant d élément par des entités html pouvant interpréter récursivement d autres éléments faisant référence à d autres templates n est pas mal en soit, toutefois cela reste légèrement insuffisant : Nous allons donc explorer d autres possibilités : L insertion de valeur passée en paramètre dans le fichier de donnée XML dans le HTML produit : Pour cela on utilise une commande de l objet <xsl : <xsl :value-of select= «@paramètre» /> C est chiant mais l arobase est indispensable Exemple dans la XSL: <title><xsl:value-of select="@title" /></title> Utilisé avec : <webpage title="the Novels page"> dans le fichier xml Le value-of ne porte que sur les paramètres de l élément courant Insérer la valeur d un attribut dans un tag d output Exemple dans le tag HTML : <IMG src= «bannerleft.jpg» /> On aimerait passer la valeur de bannerleft.jpg en paramètre dans le fichier de donnée Exemple en écrivant <banner left= «bannerleft.jpg» /> Comment récupérer cette valeur et la mettre dans l attribut src? <img src= «<xsl :value-of select= «@left»» /> ne marchera bien sûr pas. La solution est donc d utiliser <xsl :attribute> <img> <xsl :attribute name= «src»><xsl :value-of select= @left /> </xsl :attribute> </img> La commande tag <xsl :attribute permet d accéder à l attribut du tag HTML <img. Bien sûr on peut l utiliser avec n importe quel autre attribut de n importe quel autre tag HTML. XPATH TODO :
Question sur XML Les différents Charset et leur utilités :