À propos de XML et de XSLT

Utilisation des langages XML et XSL dans des pages web

Extensible Markup Language (XML) est un langage qui vous permet de structurer l'information.Comme HTML, XML vous permet de structurer vos informations à l'aide de balises, mais les balises XML ne sont pas prédéfinies comme le sont les balises HTML. Au lieu de cela, XML vous permet de créer des balises qui définissent au mieux la structure de vos données (schéma). Les balises sont imbriquées dans d'autres pour créer un schéma de balises parent et enfant.Comme la plupart des balises HTML, toutes les balises d'un schéma XML ont une balise d'ouverture et de fermeture.

L’exemple suivant illustre la structure de base d’un fichier XML :

<?xml version="1.0">

<mybooks>

<book bookid="1">

<pubdate>03/01/2004</pubdate>

<title>Affichage de données XML avec Adobe Dreamweaver</title>

<author>Charles Brown</author>

</book>

<book bookid="2">

<pubdate>04/08/2004</pubdate>

<title>Comprendre XML</title>

<author>John Thompson</author>

</book>

</mybooks>

Dans cet exemple, chaque balise gabarit <book> contient trois balises enfants : <pubdate>, <title> et <author>. Mais chaque balise <book> est également une balise enfant de la balise <mybooks>, qui se trouve un niveau plus haut dans le schéma. Vous pouvez nommer et structurer les balises XML comme vous le souhaitez, à condition d'imbriquer correctement les balises les unes dans les autres et d'attribuer à chaque balise d'ouverture une balise de fermeture correspondante.

Les documents XML ne contiennent aucune mise en forme — ils sont simplement des conteneurs d'informations structurées. Une fois que vous avez un schéma XML, vous pouvez utiliser l'Extensible Stylesheet Language (XSL) pour afficher les informations.De la même manière que les feuilles de style en cascade (CSS) vous permettent de formater HTML, XSL vous permet de formater les données XML. Vous pouvez définir des styles, des éléments de page, une mise en page, etc. dans un fichier XSL et l'attacher à un fichier XML de sorte que lorsqu'un utilisateur consulte les données XML dans un navigateur, les données sont formatées selon ce que vous avez défini dans le fichier XSL. Le contenu (les données XML) et la présentation (définie par le fichier XSL) sont entièrement séparés, ce qui vous offre un meilleur contrôle sur l'apparence de vos informations sur une page web. En substance, XSL est une technologie de présentation pour XML, où la sortie principale est une page HTML.

Extensible Stylesheet Language Transformations (XSLT) est un sous-langage de XSL qui vous permet d'afficher des données XML sur une page web et de les « transformer », avec les styles XSL, en informations lisibles et stylisées sous forme de HTML. Vous pouvez utiliser Dreamweaver pour créer des pages XSLT qui vous permettent d'effectuer des transformations XSL en utilisant un serveur d'applications ou un navigateur.Dans une transformation XSL côté serveur, le serveur effectue le travail de transformation du XML et du XSL, et l'affiche sur la page. Dans une transformation côté client, un navigateur (tel qu'Internet Explorer) effectue le travail.

L'approche que vous adoptez finalement (transformations côté serveur par rapport aux transformations côté client) dépend de ce que vous essayez d'obtenir comme résultat final, des technologies disponibles, du niveau d'accès que vous avez aux fichiers source XML, et d'autres facteurs. Les deux méthodes présentent des avantages et des inconvénients. Par exemple, les transformations côté serveur fonctionnent dans tous les navigateurs tandis que les transformations côté client sont limitées aux navigateurs modernes uniquement (Internet Explorer 6, Netscape 8, Mozilla 1.8, et Firefox 1.0.2). Les transformations côté serveur vous permettent d'afficher dynamiquement des données XML depuis votre propre serveur ou depuis n'importe où ailleurs sur le web, tandis que les transformations côté client doivent utiliser des données XML hébergées localement sur votre propre serveur web. Enfin, les transformations côté serveur exigent que vous déployiez vos pages sur un serveur d'applications configuré, tandis que les transformations côté client nécessitent seulement l'accès à un serveur web.

Vous trouverez un tutoriel expliquant le langage XML à l’adresse www.adobe.com/go/vid0165_fr.

Transformations XSL côté serveur

Dreamweaver fournit des méthodes pour créer des pages XSLT qui vous permettent d'effectuer des transformations XSL côté serveur. Lorsqu'un serveur d'applications effectue la transformation XSL, le fichier contenant les données XML peut résider sur votre propre serveur, ou n'importe où ailleurs sur le web. De plus, n'importe quel navigateur peut afficher les données transformées. Cependant, le déploiement de pages pour les transformations côté serveur est quelque peu complexe et nécessite que vous ayez accès à un serveur d'applications.

Lorsque vous travaillez avec des transformations XSL côté serveur, vous pouvez utiliser Dreamweaver pour créer des pages XSLT qui génèrent des documents HTML complets (pages XSLT entières), ou des fragments XSLT qui génèrent une partie d'un document HTML. Une page XSLT entière est similaire à une page HTML normale. Elle contient une balise <body> et une balise <head>, et vous permet d'afficher une combinaison de données HTML et XML sur la page. Un fragment XSLT est un morceau de code, utilisé par un document séparé, qui affiche des données XML formatées. Contrairement à une page XSLT entière, c'est un fichier indépendant qui ne contient aucune balise <body> ou <head>. Si vous souhaitez afficher des données XML sur une page qui lui est propre, vous pouvez créer une page XSLT entière et lier vos données XML à cette page.Si, d'autre part, vous vouliez afficher des données XML dans une section particulière d'une page dynamique existante — par exemple, une page d'accueil dynamique pour un magasin d'articles de sport, avec des scores sportifs provenant d'un flux RSS affichés sur un côté de la page — vous créeriez un fragment XSLT et inséreriez une référence à celui-ci dans la page dynamique. Créer des fragments XSLT et les utiliser en association avec d'autres pages dynamiques pour afficher des données XML est le scénario le plus courant.

La première étape pour créer ces types de pages est de créer le fragment XSLT.C'est un fichier séparé qui contient la mise en page, le formatage, et ainsi de suite des données XML que vous voulez finalement afficher dans la page dynamique. Une fois que vous créez le fragment XSLT, vous insérez une référence à celui-ci dans votre page dynamique (par exemple, une page PHP ou ColdFusion). La référence insérée au fragment fonctionne comme une inclusion côté serveur (SSI) : les données XML formatées (le fragment) résident dans un fichier séparé, tandis qu'en mode Création, un espace réservé pour le fragment apparaît sur la page dynamique elle-même. Quand un navigateur demande la page dynamique contenant la référence au fragment, le serveur traite l'instruction incluse et crée un nouveau document dans lequel le contenu formaté du fragment apparaît à la place de l'espace réservé.

Vous utilisez le comportement de serveur XSL Transformation pour insérer la référence à un fragment XSLT dans une page dynamique. Quand vous insérez la référence, Dreamweaver génère un dossier includes/MM_XSLTransform/ dans le dossier racine du site qui contient un fichier de bibliothèque d'exécution. Le serveur d'application utilise les fonctions définies dans ce fichier lors de la transformation des données XML spécifiées. Ce fichier se charge de récupérer les données XML et les fragments XSLT, d'effectuer la transformation XSL et d'afficher les résultats sur la page web.

Le fichier contenant le fragment XSLT, le fichier XML contenant vos données et le fichier de bibliothèque d'exécution généré doivent tous être sur le serveur pour que votre page s'affiche correctement. (Si vous sélectionnez un fichier XML distant comme source de données — un provenant d'un flux RSS, par exemple — ce fichier doit bien sûr résider ailleurs sur Internet.)

Vous pouvez aussi utiliser Dreamweaver pour créer des pages XSLT entières destinées aux transformations côté serveur. Une page XSLT entière fonctionne exactement de la même manière qu'un fragment XSLT, seulement quand vous insérez la référence à la page XSLT entière en utilisant le comportement de serveur XSL Transformation, vous insérez le contenu complet d'une page HTML. Ainsi, la page dynamique (la page .cfm, .php ou .asp qui sert de page conteneur) doit être vidée de tout HTML avant d'insérer la référence.

Dreamweaver prend en charge les transformations XSL pour les pages ColdFusion, ASP et PHP.

Transformations XSL côté client

Vous pouvez exécuter des transformations XSL sur le client, sans utiliser de serveur d’application. Dreamweaver permet de créer une page XSLT entière qui se chargera de cette opération. Toutefois, les transformations côté client nécessitent la manipulation du fichier XML contenant les données à afficher. Par ailleurs, les transformations côté client utilisent uniquement des navigateurs modernes (Internet Explorer 6, Netscape 8, Mozilla 1.8 et Firefox 1.0.2). 

Créez d’abord une page XLST entière et associez-lui une source de données XML. (Dreamweaver vous invite à associer la source de données à la création de la page.) Vous pouvez créer une page XSLT entièrement nouvelle ou convertir une page HTML existante en page XSLT. Lorsque vous convertissez une page HTML existante en page XSLT, vous devez lui associer une source de données XML au moyen du panneau Liaisons (Fenêtre > Liaisons).

Une fois que vous avez créé votre page XSLT, vous devez la lier au fichier .xml qui contient les données XML en insérant une référence à la page XSLT dans le fichier XML (tout comme vous insérez une référence à une feuille de style en cascade (CSS) externe dans la section <head> d’une page HTML). Les visiteurs de votre site doivent consulter le fichier XML (et non la page XSLT) dans un navigateur. Lorsqu’ils affichent la page, le navigateur exécute la transformation XSL et affiche les données XML, qui sont mises en forme par la page XSLT liée.

D’un point de vue conceptuel, la relation entre les pages XSLT et XML liées est similaire, tout en étant différente, au modèle de page CSS externe/HTML. Lorsqu’une page HTML contient du contenu (tel que du texte), vous utilisez une feuille de style externe pour formater ce contenu. La page HTML détermine le contenu, tandis que le code CSS externe, qui est totalement invisible pour l’utilisateur, détermine la présentation. Avec XSLT et XML, la situation est inversée. Le fichier XML (que l’utilisateur ne voit jamais sous forme brute) détermine le contenu alors que la page XLST définit la présentation. La page XSLT contient les tableaux, la mise en forme, les graphiques etc. que contient d’ordinaire le code HTML standard. Lorsqu’un utilisateur affiche le fichier XML dans un navigateur, la page XSLT met le contenu en forme.

Quand vous utilisez Dreamweaver pour lier une page XSLT à une page XML, Dreamweaver insère le code approprié pour vous en haut de la page XML. Si vous possédez la page XML à laquelle vous vous liez (c'est-à-dire si le fichier XML réside exclusivement sur votre serveur web), il vous suffit d'utiliser Dreamweaver pour insérer le code approprié qui lie les deux pages. Quand vous possédez le fichier XML, les transformations XSL effectuées par le client sont entièrement dynamiques. C'est-à-dire que chaque fois que vous mettez à jour les données du fichier XML, toute sortie HTML utilisant la page XSLT liée sera automatiquement mise à jour avec les nouvelles informations.

Si vous ne possédez pas la page XML à laquelle vous vous liez (par exemple, si vous voulez utiliser des données XML d'un flux RSS quelque part sur le web), le processus est un peu plus compliqué. Pour effectuer des transformations côté client en utilisant des données XML d'une source externe, vous devez d'abord télécharger le fichier source XML dans le même répertoire où réside votre page XSLT. Quand la page XML est dans votre site local, vous pouvez utiliser Dreamweaver pour ajouter le code approprié qui la lie à la page XSLT, et publier les deux pages (le fichier XML téléchargé et la page XSLT liée) sur votre serveur web. Quand l'utilisateur visualise la page XML dans un navigateur, la page XSLT formate le contenu, exactement comme dans l'exemple précédent.

L'inconvénient d'effectuer des transformations XSL côté client sur des données XML provenant d'une source externe est que les données XML ne sont que partiellement « dynamiques ». Le fichier XML que vous téléchargez et modifiez n'est qu'un « instantané » du fichier qui se trouve ailleurs sur le web. Si le fichier XML original sur le web change, vous devez télécharger à nouveau le fichier, le lier à la page XSLT et republier le fichier XML sur votre serveur web. Le navigateur génère uniquement le rendu des données qu'il reçoit du fichier XML sur votre serveur web, et non des données contenues dans le fichier source XML original.

Données XML et éléments répétés

L'objet Repeating Region XSLT permet d'afficher les éléments répétitifs d'un fichier XML dans une page.Toute région contenant un espace réservé de données XML peut être transformée en région répétée.Cependant, les zones géographiques les plus courantes sont un tableau, une ligne de tableau ou une série de lignes de tableau.

L'exemple suivant montre comment l'objet Zone répétitive XSLT est appliqué à une ligne de tableau qui affiche les informations de menu d'un restaurant. La ligne initiale affiche trois éléments différents du schéma XML : item, description et prix.Lorsque l'objet Zone répétitive XSLT est appliqué à la ligne de tableau, et que la page est traitée par un serveur d'applications ou un navigateur, le tableau se répète avec des données uniques insérées dans chaque nouvelle ligne de tableau.

Lorsque vous appliquez un objet Zone répétitive XSLT à un élément dans la fenêtre de document, un contour fin à onglets et gris apparaît autour de la zone répétée.Lorsque vous affichez un aperçu de votre travail dans un navigateur (Fichier > Aperçu dans le navigateur), le Contour gris disparaît et la sélection s'étend pour afficher les éléments répétitifs spécifiés dans le fichier XML, comme dans l'Illustration précédente.

Lorsque vous ajoutez l'objet Zone répétitive XSLT à la page, la longueur de l'espace réservé de données XML dans la fenêtre Document est tronquée.Cela s'explique par le fait que Dreamweaver met à jour l'expression XPath (langage de chemin d'accès XML) pour l'espace réservé de données XML afin qu'elle soit relative au chemin de l'élément répété.

Par exemple, le code suivant concerne un tableau qui contient deux espaces réservés dynamiques, sans qu'un objet Zone répétitive XSLT soit appliqué au tableau :

<table width="500" border="1">

    <tr> 

<td><xsl:value-of select="rss/channel/item/title"/></td>

    </tr> 

    <tr> 

<td><xsl:value-of select="rss/channel/item/description"/></td>

    </tr> 

</table>

Le code suivant concerne le même tableau avec l'objet Zone répétitive XSLT appliqué :

<xsl:for-each select="rss/channel/item">

<table width="500" border="1">

        <tr> 

<td><xsl:value-of select="title"/></td>

        </tr> 

        <tr> 

<td><xsl:value-of select="description"/></td>

        </tr> 

    </table> 

</xsl:for-each>

Dans l'exemple précédent, Dreamweaver a mis à jour le XPath pour les éléments qui se trouvent dans la Zone répétitive (title et description) afin qu'il soit relatif au XPath dans les balises <xsl:for-each> englobantes, plutôt qu'au document complet.

Dreamweaver génère des expressions XPath relatives au contexte dans d'autres cas également. Par exemple, si vous faites glisser un espace réservé de données XML vers un tableau auquel un objet XSLT Zone répétée est déjà appliqué, Dreamweaver affiche automatiquement le XPath relatif au XPath existant dans les balises <xsl:for-each> englobantes.

Aperçu des données XML

Lorsque vous utilisez Aperçu dans le navigateur (Fichier > Aperçu dans le navigateur) pour prévisualiser les données XML que vous avez insérées dans un fragment XSLT ou une page XSLT entière, le moteur qui effectue la transformation XSL diffère selon la situation. Pour les pages dynamiques contenant des fragments XSLT, le serveur d'applications effectue toujours la transformation.À d'autres moments, Dreamweaver ou le navigateur peuvent effectuer la transformation.

Le tableau suivant résume les situations lors de l'utilisation d'Aperçu dans le navigateur et les moteurs qui effectuent les transformations respectives :

Les rubriques suivantes fournissent des directives pour vous aider à déterminer les méthodes d'aperçu appropriées, selon vos besoins.

Aperçu de pages pour des transformations côté serveur

Dans le cas de transformations côté serveur, le contenu que le visiteur de site voit finalement est transformé par votre serveur d'Application. Lors de la création de pages XSLT et dynamiques à utiliser avec des transformations côté serveur, il est toujours préférable de prévisualiser la page dynamique qui contient le fragment XSLT plutôt que le fragment XSLT lui-même. Dans le premier scénario, vous utilisez le serveur d'Application, ce qui garantit que votre aperçu est cohérent avec ce que vos visiteurs de site verront lorsqu'ils visiteront votre page. Dans le second scénario, Dreamweaver effectue la transformation et pourrait fournir des résultats légèrement incohérents. Vous pouvez utiliser Dreamweaver pour prévisualiser votre fragment XSLT pendant que vous le créez, mais vous pourrez voir les résultats les plus précis du rendu des données si vous utilisez le serveur d'Application pour prévisualiser votre page dynamique après avoir inséré le fragment XSLT.

Aperçu de pages pour des transformations côté client

Dans le cas de transformations côté client, le contenu que le visiteur de site voit finalement est transformé par un navigateur.Vous y parvenez en ajoutant un lien du fichier XML vers la page XSLT. Si vous ouvrez le fichier XML dans Dreamweaver et le prévisualisez dans un navigateur, vous forcez le navigateur à charger le fichier XML et à effectuer la transformation. Cela vous fournit la même expérience que celle de votre visiteur de site.

Cette approche rend cependant plus difficile le débogage de votre page car le navigateur transforme le XML et génère le HTML en interne.Si vous sélectionnez l'option Afficher la source du navigateur pour déboguer le HTML généré, vous ne verrez que le XML original que le navigateur a reçu, pas le HTML complet (balises, styles, et ainsi de suite) responsable du rendu de la page. Pour afficher le code HTML complet lors de la consultation du code source, vous devez plutôt prévisualiser la page XSLT dans un navigateur.

Aperçu de pages XSLT entières et de fragments XSLT

Lors de la création de pages XSLT entières et de fragments XSLT, vous voudrez prévisualiser votre travail pour vous assurer que vos données s'affichent correctement. Si vous utilisez Aperçu dans le navigateur pour afficher une page XSLT entière ou un fragment XSLT, Dreamweaver effectue la transformation à l'aide d'un moteur de transformation intégré.Cette méthode vous donne des résultats rapides et facilite la création progressive et le débogage de votre page.Elle fournit également un moyen de visualiser le HTML complet (balises, styles et ainsi de suite) en sélectionnant l'option Afficher la source dans le navigateur.

Articles connexes

• Tutoriel consacré à XML
• Exécution de transformations XSL sur le serveur
• Exécution de transformations XSL sur le client
• Affichage des éléments répétés XML