Usando XML - Instituto Tecnológico de...

45
Cuernavaca, Morelos, México, marzo de 2006. cenidet Mobile Usando XML Ing. Juan Carlos Olivares Rojas Dr. Víctor Jesús Sosa Sosa

Transcript of Usando XML - Instituto Tecnológico de...

Page 1: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Cuernavaca, Morelos, México, marzo de 2006.

cenidet

Mobile

Usando

XMLIng. Juan Carlos Olivares

Rojas

Dr. Víctor Jesús Sosa Sosa

Page 2: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Introducción

• XML no es sólo una cara bonita.

• David Eisenberg, “Using XML”, http://www.alistapart.com/stories/usingxml/, julio de 2002. Consultado: marzo de 2006.

Page 3: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Creando un nuevo lenguaje de

marcado

• El autor creó un nuevo lenguaje que almacena la información nutrimental que se encuentra en las etiquetas de alimentos en los estados unidos.

• El documento completo se puede ver aquí.

Page 4: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Creando un nuevo lenguaje de

marcado<nutrition>

<!-- Establish the daily values --><daily-values><total-fat units="g"> 65 </total-fat><saturated-fat units="g"> 20

</saturated-fat><cholesterol units="mg"> 300

</cholesterol><sodium units="mg"> 2400

</sodium><carb units="g"> 300 </carb><fiber units="g"> 25 </fiber><protein units="g"> 50 </protein></daily-values>

<!-- Now list the individual foods --><food><name>Avocado Dip</name><mfr>Sunnydale</mfr>

<serving units="g"> 29 </serving><calories total="110" fat="100"/>

<total-fat> 11 </total-fat><saturated-fat> 3 </saturated-fat><cholesterol> 5 </cholesterol>

<!-- etc. --></nutrition>

Page 5: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Beneficios inmediatos

• Los datos están estructurados.

• Es legible y entendible por humanos.

• Es abierto, por lo cual no se necesita software propietario caro para extraer la información de archivos binarios.

Page 6: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Validando el documento

• Relax NG, es otro lenguaje de marcado basado en XML. Su propósito es especificarsi otros lenguajes de marcado son válidos.

• Se debe recordar que ¡Los libros de gramática en español están hechos en español!

Page 7: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Validando el documento

<element name="calories">

<empty/>

<attribute name="total"><data type="decimal"/>

</attribute>

<attribute name="fat"><data type="decimal"/>

</attribute>

</element>

• <calories total="100" fat="10"/>

• <calories total="217" fat="don't ask!"/>

Page 8: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Validando el documento

• La especificación completa de la gramática se encuentra aquí.

• Relax NG no es la única forma de especificar gramáticas. Se pueden utilizar un DTD(Document Type Definition), el cual no es tan poderoso como Relax NG o se puede utilizar XML Schema, el cual es igual de poderosoque Relax NG pero más difícil de aprender.

Page 9: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Inténtalo

• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

• Básicos

• Instalar MSV (validador).

• Instalar Xalan (transformador).

• Instalar Fop (convertidor de objetos).

• Instalar Batik (visor SVG).

Page 10: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Básicos

• Instalar J2RE o J2SE (SDK) 1.4 o superior.

• Crear directorios:

• C:\xmlapps herramientas

• C:\nutrition para los datos y procesos en lotes

Page 11: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

MSV

• http://wwws.sun.com/software/xml/developers/multischema/.

• Copiar a xmlapps y añadir un archivo .bat:

• java -jar c:\xmlapps\msv\msv.jar %1 %2

Page 12: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Xalan

• http://xml.apache.org/xalan-j/index.html

• Construir (build .bat), copiar .jar obtenidos a la carpeta bin, y carpeta org al principio, crear archivo .bat:

• java -cp c:\xmlapps\xalan-j\bin\xml-apis.jar;c:\xmlapps\xalan-j\bin\xercesImpl.jar;c:\xmlapps\xalan-j\bin\xalan.jarorg.apache.xalan.xslt.Process -IN %1 -XSL %2 -OUT %3

Page 13: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Fop

• http://xml.apache.org/fop/index.html.

• Copiar archivo .bat a carpeta nutrition, cambiar las rutas relativas a absolutas build\fop.jar;lib\batik.jar; quedando así:

• c:\xmlapps\fop\build\fop.jar;c:\xmlapps\fop\lib\batik.jar;

Page 14: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Batik

• http://xml.apache.org/batik/

• Crear archivo .bat con:

• java -jar c:\xmlapps\batik\batik-svgbrowser.jar%1

Page 15: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Inténtalo

Figura 1. Uso de MSV para validar documento nutrition.xml.

•Problemas de instalación. Se instaló Adobe SVG Viewer.

Page 16: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

¿Ahora qué?

Figura 2. Visualización del documento nutrition.xml en el navegador.

Page 17: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Desplegando el XML

• Se puede agregar una “hoja de estilo” al archivo XML. Se debe agregar la siguiente línea en la parte superior del archivo nutrition.xml

• <?xml version="1.0"?>

• <?xml-stylesheet type="text/css"

• href="nutrition.css"?>

• <nutrition>

Page 18: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Desplegando el XML

• nutrition.css es muy similar a las hojas de estilos de los archivos HTML. La diferencia es que se asignan estilos para cada nueva etiqueta de nutrition y no para las etiquetas HTML.

mfr {

display: inline;

font-size: 16pt;

font-style: italic;

}

Page 19: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Desplegar XML

Este desplegará la información.

Page 20: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Transformación

• Los problemas con las hojas de estilo son:

– Sólo funcionan con los últimos navegadores que manejen

Cascading Style Sheets Nivel 2.

– No pueden extraer toda la información (por ejemplo, los

atributos).

– No puede realizar operaciones aritméticas.

Page 21: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Transformación

• El lenguaje inventado es orientado a datos; es decir, esta diseñado para describir datos a ser almacenados o transmitidos por otros programas.

• Las hojas de estilo trabajan mejor con documentos de marcado orientados a la narración. Ejemplos de estos documentos son: XHTML, DocBook y NewsML.

Page 22: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Transformación

• XSLT toma como entrada un archivo XML (el “documento fuente”) y sacar otro documento resultante.

• XSLT tiene la flexibilidad de extraer datos de los atributos, y puede también realizar cálculos y ordenaciones a través de los datos en el documento fuente.

Page 23: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Transformación a HTML

• El primer archivo XSLT (este), convierte el documento nutrition en un archivo plano HTML:

Figura 4. Transformación de documento XML a HTML en forma plana.

Page 24: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Transformación a HTML

• El resultado generado

visto desde un

navegador es el

siguiente:

Page 25: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Transformación mejor diseñada

• Si se tiene el archivo XSLT llamado nutrition_fancy.xslt se puede teclear el siguiente comando:

Page 26: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Transformación mejor diseñada

• Esto produce el archivo nutrition_fancy.html

Page 27: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Transformación no HTML

• Hay más que solo navegadores en el mundo. Quizás se desee tomar los datos y convertirlos a un archivo de texto separado por tabuladores para luego importarlos en una hoja de cálculo o una base de datos.

• A continuación se muestra el archivo resultante de la transformación, ejecutando el siguiente comando:

Page 28: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Transformación no HTML

Figura 9. Resultado de la transformación de XML a un archivo de texto plano separado por tabuladores.

Page 29: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Conversión para imprimir

• XSL-FO (Extensible Stylesheet Language –Formating Objects) es un lenguaje de disposición de páginas.

• Una herramienta llamada FOP (FormatingObjects to PDF) toma el marcado y crea el archivo PDF.

Page 30: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Conversión para imprimir

• Si se tiene el archivo nutrition_fo.xslt, se puede usar FOP para convertir a PDF de la siguiente forma:

Figura 10. Conversión de un archivo XML a PDF usando la herramienta FOP.

Page 31: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Conversión para imprimir

• El resultado es un

archivo PDF; el cual

produce páginas de

aproximadamente 8

centímetros de ancho

por 9 de altura, el cual

es muy confortable en

un bolso de una

camisa.

Page 32: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Generando gráficos

• SVG –Scalable Vector Graphics- permite crear gráficos interactivos de los datos. SVG tiene elementos como los siguientes:

• <line x1="0" y1="0" x2="50" y2="50"

• style="stroke: black; fill:none;"/>

• <circle cx="100" cy="100" r="30"

• style="stroke:green; fill:yellow;"/>

Page 33: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Generando gráficos

Figura 12. Transformación de XML a SVG.

• La imagen resultante se puede visualizar con el visualizador SVG Browser que es parte del juego de herramientas Batik. Si se tiene instalado batik, se puede ver la imagen tecleando batik nutrition.svg. Se muestra la imagen obtenida:

Page 34: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Generando gráficos

• En nuestro caso se instaló el Adobe SVG Viewer http://www.adobe.com/svg/

Figura 13. Visualización de documento SVG en Internet Explorer con el visor SVG de Adobe.

Page 35: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Otras maneras de usar las

herramientas XML

• Se utilizaron:

– Multi-Schema Validator,

– Transformador Xalan,

– Convertidor FOP

– Visor Batik.

Page 36: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Tiempos

• No se necesita ser un experto en Relax NG, XSLT, XSL Formatting Objects, o SVG para seguir el tutorial. La filosofía del autor fue “la primera manera de pensar en el trabajo es la manera correcta”. Es posible aprender estas herramientas de manera efectiva en poco tiempo.

Page 37: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Rendimiento

• Los resultados al ejecutar el programa en nuestro equipo de Prueba (HP PAviliondv1025LA con 5l2 Mb de memoria RAM, microprocesador Intel centrino de 1.4 Ghzcon Windows XP Home Edition Service Pack2) fueron los siguientes:

Page 38: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Rendimiento

Figura 14. Resultados de la ejecución de SimpleTransform.

Page 39: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Sumario

• Usar lenguaje de marcas basados en XML da a los documentos estructura, haciéndolos más fácil de leer y abrir.

• XML es parte de una familia de tecnologías.

• Se pueden utilizar gramáticas de lenguajesde marcado como Relax NG, DTD o XML Schema para validar documentos.

Page 40: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Sumario

• Se pueden usar transformaciones XSLT para reformatear un documento. Un documento simple puede ser transformado a XHTML, texto plano, PDF y a otros lenguajes de marcado basados en XML como SVG.

• Programas que realizan validan y transforman están disponibles gratuitamentey son fáciles de usar.

Page 41: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Apéndice

• También se puede convertir un documento de XML a WML sólo hace falta definir el XSLT respectivo.

• Para aplicar este ejemplo se utilizó el archivo XML disponible aquí.

Page 42: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

configuracion.xml

Apéndice

• <?xml version="1.0" encoding="UTF-8"?>

• <?xml-stylesheet type="text/css" href="estilos.css"?>

• <GASWT>

• <GAT ip="192.168.190.34" puerto="2700" transformador="0" ipMA="192.168.190.34" puertoMA="1800" />

• <GAP ip="127.0.0.1" puerto="10800" cache="\" indice="patrones.xml" conexion="1" />

• <ALMACENAMIENTO espacio="64248" longitud="4096" maximo="101" tipos="*.jpg|*.gif|*.css|*.pdf" />

• </GASWT>

Page 43: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Apéndice

La hoja de estilo tiene el siguiente formato:

<?xml version="1.0" encoding="ISO-8859-1"?><xsl:stylesheet version="1.0"

xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:output doctype-public="-//WAPFORUM//DTD WML1.1//EN" doctype-system="http://www.wapforum.org/DTD/wml_1.1.xml" indent='yes'/>

<xsl:template match='GASWT'><wml> <template> <do type="prev"><prev/></do> </template> <card id="card1" title="Configuración del cenidet

GAP" newcontext="true"> <p align="center"> <big><b>GAT</b></big>

</p>

<p>IP: <xsl:value-of select="GAT/@ip"/></p> <p>Puerto: <xsl:value-ofselect="GAT/@puerto"/></p><p>Transcodificacion: <xsl:value-ofselect="GAT/@transformador"/></p><p>IP del MA: <xsl:value-ofselect="GAT/@ipMA"/></p><p>Puerto del MA: <xsl:value-ofselect="GAT/@puertoMA"/></p><do type="accept" label="GAP" name="GAP">

<go href="#card2"/></do><do type="accept" label="Almacenamiento" name="Almacenamiento">

<go href="#card3"/></do>

</card> </wml> </xsl:template></xsl:stylesheet>

Ver hoja de estilo completa aquí

Page 44: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

Apéndice

Resultado de la transformación visto en el navegador Pocket

Internet Explorer de una Pocket PC con Windows Mobile 2003

Page 45: Usando XML - Instituto Tecnológico de Moreliadsc.itmorelia.edu.mx/~jcolivares/courses/ps207a/diaposit...• Instalación de herramientas se puede hacer tanto en Windows como en Linux:

¿Preguntas?

{jcolivares04c,vjsosa}

@cenidet.edu.mx

http://www.cenidet.edu.mx/