IPRO - PC Magazine Romania, 2002
Comunitatea experților și a cititorilor PC Magazine
- Internet PRO
 De
la XML la HTML
Mihai Târnovan
Oricine lucrează în domeniu TI&C a auzit măcar vorbindu-se, dacă nu chiar
a lucrat cu XML. Toată lumea vorbește despre această nouă "tehnologie",
serverele de aplicații "suportă XML", serviciile web suportă XML,
chiar și noua infrastructură .NET a gigantului din Redmond e bazată pe XML.
Ba chiar și baze de date bazate pe XML își fac apariția încet dar sigur.
A ignora subiectul este cu siguranță o mare greșeală, poate la fel de mare
precum ignorarea internetului și a avantajelor evidente pe care le poate aduce
pentru o afacere acum câțiva ani, când a început să se dezvolte web-ul. În acest
articol voi încearca să evit bombardarea cititorului cu acronime (la o recitire
observ că nu am reușit), atât de des folosite când se vorbește despre XML și
prezentarea unui exemplu simplu implicând transformarea unui fișier XML în HTML
pentru a fi afișat într-un browser.
XML nu a fost gândit pentru a înlocui HTML-ul, dar poate ajuta la depășirea
limitărilor pe care acesta din urmă le-a impus asupra dezvoltării web-ului în
ultimii anii. Cea mai importantă dintre acestea este lipsa informației semantice
sau, altfel spus, HTML-ul descrie cum să fie prezentată informația fară să spună
nimic altceva despre informația în sine.
<html>
<body>
<h1>O pagină oarecare</h1>
<h2>Pagină scrisă de Mihai</h2>
</body>
</html><pagină>
<autor>Mihai</autor>
<conținut>
<titlu>O pagină oarecare</titlu>
</conținut>
</pagină>
Codul HTML nu conține în sine nici o informație despre autorul paginii, ci
doar o propoziție oarecare ("Pagină scrisă de Mihai") și modul în
care această propoziție să fie afișată pe ecran. Pentru calculator e greu să
afle cine este autorul acestei pagini. Tagurile meta încearcă să amelioreze
puțin situația, oferind un mecanism prin care pagina HTML se poate autodescrie,
dar au evidente limitări.
În schimb, din fragmentul XML e ușor de dedus cine a scris articolul și pentru
un calculator, dar și pentru utilizatorul sistemului de calcul. Tagul autor
conține un string care desemnează numele autorului paginii. Pentru a "știi"
acest lucru calculatorul nu trebuie să înțeleagă limba română, ca în fragmentul
HTML.
 XML
este acronimul pentru eXtensible Markup Language. Este deci un limbaj de markup,
cum este și HTML-ul. Dar spre deosebire de HTML, care a fost conceput pentru
a descrie cum să fie reprezentată informația, XML a fost gândit de la început
pentru a descrie informație. XML folosește două mecanisme pentru a descrie informația:
DTD (Document Type Definition) sau mai noul XML Schema, dar acestea nu fac subiectul
acestui articol. XML-ul în sine nu face deci nimic. El a fost conceput pentru
a structura, stoca și facilita schimbul informației.
Tagurile XML nu sunt predefinite ca la HTML, unde tagurile și semnificația
lor este fixată (<body>,<p>,<h1> etc). Utilizatorul (cu sens
generic) trebuie să definească tagurile singur. În fragmentul XML de mai sus
autorul a "inventat" tagurile <pagină>,<autor>,<conținut>
etc. El își va putea defini singur structura documentului și tagurile folosite.
Tocmai din acest motiv un browser nu poate afișa un fișier XML.
Pentru a afișa informația conținută în fișiere XML este necesară transformarea
acestuia în HTML. Avem nevoie de XSL (eXtensible Stylesheet Language), un limbaj
special creat pentru a facilita transformarea fișierelor XML în alte fișiere
XML sau - mai interesant pentru noi - în fișiere HTML.
XSL este compus de fapt din 3 tehnologii: XSLT, XPath și XSL:FO. Lăsând detaliile
la o parte, XSL poate fi privit ca un limbaj de transformare a XML-ului în (X)HTML,
un limbaj care facilitează manipularea informației XML prin filtrare și sortare,
poate defini părți dintr-un document XML, poate formata datele din fișierele
XML pe baza valorilor acestora (de exemplu să afișeze valorile mai mici de 100
cu roșu în loc de verde). Acest limbaj poate produce output pentru diverse medii
cum ar fi ecran, hârtie sau chiar voce, dar ne vom limita la aspectul cel mai
folosit, producere de XHTML.
Cea mai importantă tehnologie din XSL este XSTL adică XSL Transformations.
Acesta este folosit pentru a produce dintr-un arbore XML sursă un arbore XML
rezultat. Arborele rezultat poate fi un fișier în format XHTML, iar pe parcursul
transformării, elemente din arborele sursă pot fi ignorate sau altele noi pot
fi adăugate sau sortate după diverse criterii. În timpul transformării se pot
lua decizii cu privire la ce elemente se transformă și cum. Să vedem un exemplu:
<?xml
version="1.0" encoding="ISO-8859-2"?>
<?xml-stylesheet type="text/xsl" href= "catalog.xsl"?>
<catalog>
<cd>
<titlu>Calling All Destroyers</titlu>
<artist>Metallica</artist>
<tara>SUA</tara>
<an>1984</an>
<pret>17.90</pret>
</cd>
<cd>
<titlu>Ride the Lightning</titlu>
<artist>Metallica</artist>
<tara>SUA</tara>
<an>1989</an>
<pret>19.90</pret>
</cd>
<cd>
<titlu>And Justice for All</titlu>
<artist>Metallica</artist>
<tara>SUA</tara>
<an>1990</an>
<pret>29.90</pret>
</cd>
<cd>
<titlu>Oceanborn</titlu>
<artist>Nightwish</artist>
<tara>Norvegia</tara>
<an>1999</an>
<pret>12.90</pret>
</cd>
<cd>
<titlu>Razorblade Romance</titlu>
<artist>HIM</artist>
<tara>SUA</tara>
<an>2000</an>
<pret>13.90</pret>
</cd>
<cd>
<titlu>Hybrid Theory</titlu>
<artist>Linkin Park</artist>
<tara>SUA</tara>
<an>2001</an>
<pret>18.90</pret>
</cd>
<cd>
<titlu>The First Years of Piracy</titlu>
<artist>Running Wild</artist>
<tara>SUA</tara>
<an>2002</an>
<pret>19.90</pret>
</cd>
<cd>
<titlu>Vovin</titlu>
<artist>Therion</artist>
<tara>Suedia</tara>
<an>1998</an>
<pret>29.90</pret>
</cd>
</catalog>
Acesta va fi fișierul XML pe care vrem să îl afișăm într-un browser. Să vedem
fișierul XSL care va efectua transformarea:
<?xml version="1.0"
encoding="ISO-8859-2"?>
<xsl:stylesheet version="1.0" xmlns:xsl = "http:// www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<HTML>
<BODY>
<TABLE border="0" cellspacing="1" cellpadding="3">
<TR bgcolor="silver">
<TH>Artist</TH>
<TH>Titlu</TH>
<TH>Țara</TH>
<TH>An</TH>
<TH>Preț</TH>
</TR>
<xsl:apply-templates select = "catalog/ cd">
<xsl:sort select="artist"/>
<xsl:sort select="titlu"/>
</xsl:apply-templates>
</TABLE>
</BODY>
</HTML>
</xsl:template>
<xsl:template match="cd">
<TR>
<xsl:apply-templates select="artist"/>
<xsl:apply-templates select="titlu"/>
<xsl:apply-templates select="tara"/>
<xsl:apply-templates select="an"/>
<xsl:apply-templates select="pret"/>
</TR>
</xsl:template>
<xsl:template match="titlu">
<TD>
<xsl:apply-templates/>
</TD>
</xsl:template>
<xsl:template match="artist">
<TD>
<B>
<xsl:apply-templates/>
</B>
</TD>
</xsl:template>
<xsl:template match="tara">
<TD>
<xsl:apply-templates/>
</TD>
</xsl:template>
<xsl:template match="an">
<TD>
<xsl:apply-templates/>
</TD>
</xsl:template>
<xsl:template match="pret">
<TD STYLE="font-style:italic">
<xsl:value-of select="."/> EU
</TD>
</xsl:template>
</xsl:stylesheet>
Puține browsere au suport de XSL la ora actuală. Suportul XSL din Internet
Explorer 5 si 5.5 nu este bazat pe standardul oficial W3C, ci pe o specificație
mai veche aflată încă în stadiul de propunere. Internet Explorer 6, în schimb,
suportă complet ultimul set de specificații XSL dat de W3C. Parserele XML livrate
de Microsoft au ajuns la versiunea 3 la lansarea Windows XP și Internet Explorer
6. De atunci Microsoft a mai lansat versiunea 4. Exemplele din acest articol
pot fi urmărite pe Internet Explorer 6 și, probabil, pe Netscape 6. Neajunsurile
browserelor mai vechi le-am putea evita dacă am folosi scripting sau pe partea
de server sau pe partea de client, utilizând obiectele COM oferite de MSXML.
Dacă salvați fragmentele de cod pe disc în același director sub numele catalog.xml
și catalog.xsl, puteți deschide fișierul catalog.xml cu Internet Explorer 6.
Veți vedea că fișierul XML a fost transformat și afișat pe ecran după cum ne
așteptam. Transformarea se face automat de către browser. Aceasta metodă este
adecvată mai degrabă unor scopuri "didactice". În practică, de cele
mai multe ori transformarea se face pe partea de server, clientul primind un
simplu stream HTML.
Să disecăm puțin fișierul XSL, dar nu înainte de a observa că în fișierul XML
există o referință la fișierul XSL. Această referință va fi folosită de către
browser pentru efectuarea transformării.
<?xml-stylesheet
type="text/xsl" href="catalog.xsl"?>
Conform recomandării W3C, elementul rădacină care declară un fișier XSL este
<xsl:stylesheet> sau <xsl:transform> (ele sunt sinonime). Conținutul
elementului rădăcină se compune dintr-un set de reguli șablon (template rules)
declarate cu elemente <xsl:template>. Aceste reguli șablon sunt de fapt
partea cea mai importantă a unui fișier XSL. Un șablon poate conține și text
care va apărea nemodificat în documentul rezultat, în fișierul nostru de exemplu:
<HTML>
<BODY>
<TABLE border="1" cellspacing="0" cellpadding="2">
...
Observăm că au fost definite șabloane pentru elementele cd, titlu, artist,
țară, an, preț. Fragmentul următor:
<xsl:apply-templates
select="catalog/cd">
<xsl:sort select="artist"/>
<xsl:sort select="titlu"/>
</xsl:apply-templates>
aplică șabloanele definite mai jos pe toate elementele cd ale elementului catalog,
selectându-le sortate după artist și titlu.
Șablonul pentru elementul cd:
<xsl:template
match="cd">
<TR>
<xsl:apply-templates select="artist" />
<xsl:apply-templates select="titlu" />
<xsl:apply-templates select="tara" />
<xsl:apply-templates select="an" />
<xsl:apply-templates select="pret" />
</TR>
</xsl:template>
aplică pe fiecare dintre subelementele acestuia șabloanele aferente. Elementul
<xsl:apply-templates select=expresie mode=mod> selectează întâi un set
de noduri folosind criteriul specificat de atributul select. Dacă acesta nu
este specificat, vor fi selectați toți descendenții nodului curent. Pentru fiecare
nod astfel selectat, procesorul XSLT va căuta un șablon corespunzător. Șabloanele
sunt testate comparând nodul cu expresia XPath specificată în atributul match
al șabloanelor. Atributul mode este folosit pentru procesarea multiplă a elementelor.
Un <xsl:apply-templates> care are setat atributul mode se va aplica doar
pe șabloane care au setat atributul mode la aceeași valoare.
Astfel, elementul <xsl:apply-templates select="pret"/> din
fragmentul de mai sus va avea ca efect aplicarea șablonului
<xsl:template
match="pret">
<TD STYLE="font-style:italic">
<xsl:value-of select="."/> EU
</TD>
</xsl:template>
atributul select al elementului apply-templates și atributul match al elementului
xsl:template indicând același nod.
Vorbeam la începutul articolului despre posibilitățile XSLT-ului de a modifica
modul în care sunt afișate informațiile, de a adăuga elemente noi în funcție
de datele conținute în fișierul XML. Să modificăm deci exemplul nostru pentru
a afișa cu roșu elemente an mai mici de 2000 și cu verde pe cele mai mari. În
acest scop, modificăm șablonul aplicat elementului an în felul următor:
<xsl:template
match="an">
<TD>
<xsl:attribute name="style">
<xsl:choose>
<xsl:when test=" (. <= 2000)">
color:red;
</xsl:when>
<xsl:otherwise>
color:green;
</xsl:otherwise>
</xsl:choose>
</xsl:attribute>
<xsl:apply-templates />
</TD>
</xsl:template>
Să începem cu elementul <xsl:attribute>. Acesta îl vom folosi pentru
a seta atributul style al elementului <TD> în funcție de valoarea conținută
de elementul an. Numele atributului ce va fi adăugat elementului <TD>
e dat de atributul name, iar valoarea de conținutul elementului <xsl:attribute>.
Am ajuns la elementul <xsl:choose>. Acesta ne pune la dispoziție un mecanism
de testare condițională și se folosește împreună cu elementele <xsl:otherwise>
și <xsl:when>. Subnodurile <xsl:when> ale elementului <xsl:choose>
sunt testate în ordine de sus în jos până când atributul test al unuia dintre
aceste elemente descrie cu acuratețe condițiile prezente în informația sursă
sau se ajunge la un element <xsl:otherwise>. După ce s-a ales un element
prin <xsl:otherwise> sau <xsl:when>, se iese automat din blocul
<xsl:choose>. În cazul nostru, testul este ca valoarea numerică a elementulului
an să fie mai mică decât 2000:
<xsl:when
test=" (. <= 2000)">
caz în care valoarea elementului <xsl:attribute> este color:red. Dacă
valoarea este mai mare, se va ajunge la elementul <xsl:otherwise> și conținutul
elementului <xsl:attribute> va fi color:green. Condiția în sine este
(. <= 2000 )
adică valoarea elementului curent ("." selectează elementul curent)
să fie mai mică (< - less than) de valoarea 2000. Se folosește <,
caracterul "<" având alte semnificații.
Să vedem ce mai știe XSLT-ul să facă. Putem folosi face de exemplu totalul prețurilor
cd-urilor din catalog. Pentru aceasta adaugăm înainte de sfârșitul tag-ului
de tabelă:
....
<TR>
<TD colspan="4"> <B> <I> Total</I> </B>
</TD>
<TD><B><I>
<xsl:value-of select="format-number(sum(catalog/cd/pret),'###,###.00')"/>EU
</I></B></TD>
</TR>
</TABLE>
...
Elementul <xsl:value-of> inserează un string reprezentând valoarea primului
element (în ordinea din document) specificat de atributul select. Noi vom specifica
la atributul select o expresie care va calcula suma noastra. Funcția format-number
convertește valori numerice în stringuri. Primește ca parametrii valoarea de
intrare și două stringuri folosite pentru formatarea numărului, dintre care
ultimul e opțional și nu e folosit în exemplu.
În exemplu dat, valoarea de intrare este rezultatul funcției sum aplicată pe
elementele pret ale elementelor cd din elementul catalog. Funcția sum este o
funcție XPath care returnează suma tuturor nodurilor dintr-un set de noduri
primit ca parametru. Alte funcții numerice XPath sunt round, ceiling, floor
și number, primele trei se folosesc la rotunjire, ultima face conversia argumentului
într-un număr.
Am văzut deci drumul pe care îl urmează un fișier XML până la afișarea acestuia
în browser. Iată codul XHTML rezultat din transformare:
Nici un webdesigner nu mai creează astăzi scriind codul HTML manual. Argumentul
unui cod mai "curat" a pierdut de mult în fața unui argument mult
mai importat: productivitatea. La capitolul unelte de dezvoltare, HTML-ul stă
foarte bine.
Din păcate uneltele care să ajute webdesignerul sau programatorul să lucreze
cu XML-XSL sunt deocamdată puține. Și de ce să nu recunoaștem, la prima vedere
se pare că a folosi combinația XML-XSL în loc de HTML pare a fi o mare pierdere
de vreme. Trebuie însă avute în vedere alte aspecte care fac o astfel de combinație
foarte folositoare: cu tehnologia XSL se poate transforma un fișier XML pentru
o varietate de medii sau formate (PDF, WML, SVG etc.), se separă prezentarea
de conținut.
O aplicație care poate ușura mult munca depusă de programator este XML-Spy
produs de Altova. Pe situl www.xmlspy.com se poate descărca o versiune demo.
XML-Spy conține chiar și o aplicație vizuală de construit fișiere XSL, care
se bazează pe fișiere XML Schema. XML-Spy poate fi foarte util și celor care
vor să învețe să folosească noile tehnologii.
Există soluții web bazate pe cuplul XML-XSL, una dintre cele mai cunoscute
este probabil Cocoon de la Apache Group (xml.apache.org). Acesta este practic
un server de web care folosește streamuri XML statice sau dinamice pe care le
transformă în XHTML, PDF, SVG, WML, RTF în timpul servirii clientului, folosind
streamuri XSL statice sau dinamice. De fapt, Cocoon nu este un server de web
propriu-zis, ci un servlet scris pentru container-ul de servleturi Tomcat, dezvoltat
tot de Apache Group. Un astfel de mediu folosește tehnologia XSL la adevăratul
ei potențial.E
<HTML>
<BODY>
<TABLE border="0" cellspacing="1" cellpadding="3">
<TR bgcolor="silver">
<TH>Artist</TH>
<TH>Titlu</TH>
<TH>Țara</TH>
<TH>An</TH>
<TH>Preț</TH>
</TR>
<TR>
<TD>
<B>HIM</B>
</TD>
<TD>Razorblade Romance</TD>
<TD>SUA</TD>
<TD style= "color: red;">2000</TD>
<TD STYLE="font-style:italic">13.90 EU</TD>
</TR>
<TR>
<TD>
<B>Linkin Park</B>
</TD>
<TD>Hybrid Theory </TD>
<TD>SUA</TD>
<TD style="color: green;" >2001</TD>
<TD STYLE="font-style:italic">18.90 EU</TD>
</TR>
<TR>
<TD>
<B>Metallica</B>
</TD>
<TD>And Justice for All</TD>
<TD>SUA</TD>
<TD style="color: red;">1990</TD>
<TD STYLE="font-style:italic">29.90 EU</TD>
</TR>
<TR>
<TD>
<B>Metallica</B>
</TD>
<TD>Calling All Destroyers</TD>
<TD>SUA</TD>
<TD style="color: red;">1984 </TD>
<TD STYLE="font-style:italic">17.90 EU</TD>
</TR>
<TR>
<TD>
<B>Metallica</B>
</TD>
<TD>Ride the Lightning</TD>
<TD>SUA</TD>
<TD style="color:red;">1989</TD>
<TD STYLE="font-style:italic">19.90 EU</TD>
</TR>
<TR>
<TD>
<B>Nightwish</B>
</TD>
<TD>Oceanborn</TD>
<TD>Norvegia</TD>
<TD style="color: red;">1999</TD>
<TD STYLE="font-style:italic">12.90 EU</TD>
</TR>
<TR>
<TD>
<B>Running Wild</B>
</TD>
<TD>The First Years of Piracy</TD>
<TD>SUA</TD>
<TD style="color: green;">2002</TD>
<TD STYLE="font-style:italic">19.90 EU</TD>
</TR>
<TR>
<TD>
<B>Therion</B>
</TD>
<TD>Vovin</TD>
<TD>Suedia</TD>
<TD style="color: red;">1998</TD>
<TD STYLE="font-style:italic">29.90 EU</TD>
</TR>
<TR>
<TD colspan="4">
<B>
<I>Total</I>
</B>
</TD>
<TD>
<B>
<I>163.20EU
</I>
</B>
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
|
