Presentacion sesion 3 en MPA del CEU por Pablo de Castro

CEU-MPA|www.pablodecastro.com|Sesion3

SERVICIOS DE LA WEB Y SUS APLICACIONES AL MUNDO EMPRESARIAL

www.pablodecastro.com

Master in People Administration MPA

Area de Organización

Sistemas de Información


HTML

• HTML, siglas de HyperText Markup Language (Lenguaje de Marcas de Hipertexto)

• predominante para la construcción de páginas web.• Es usado para describir la estructura y el contenido en

forma de texto, así como para complementar el texto con objetos tales como imágenes.

• HTML se escribe en forma de "etiquetas", (<,>).• HTML también puede describir, hasta un cierto punto, la

apariencia de un documento, y puede incluir un script (por ejemplo Javascript), el cual puede afectar el comportamiento de navegadores web


TIM BERNERS LEE


HTML

• HTML consiste de varios componentes vitales, incluyendo

• elementos y sus atributos y contenidos– <nombre-de-elemento atributo="valor">Contenido</nombre-de-

elemento>)

• tipos de data• y la declaración de tipo de documento.


Códigos HTML

• <html>: define el inicio del documento HTML, le indica al navegador que lo que viene a continuación debe ser interpretado como código HTML.

• <head>: define la cabecera del documento HTML, esta cabecera suele contener información sobre el documento que no se muestra directamente al usuario. Como por ejemplo el título de la ventana del navegador.

• <title>: define el título de la página. Por lo general, el título aparece en la barra de título encima de la ventana

• <link>: para vincular el sitio a hojas de estilo o iconos Por ejemplo:<link rel="stylesheet" href="/style.css" type="text/css">

• <style>: para colocar el estilo interno de la página, ya sea usando CSS, JavaScript u otros lenguajes similares. No es necesario colocarlo si se va a vincular a un archivo externo usando la etiqueta <link>


Códigos HTML

• <body>: define el contenido principal o cuerpo del documento. Esta es la parte del documento html que se muestra en el navegador; dentro de esta etiqueta pueden definirse propiedades comunes a toda la página, como color de fondo y márgenes. Dentro del cuerpo <body> podemos encontrar numerosas etiquetas. A continuación se indican algunas a modo de ejemplo:

• <h1>, <h2>, <h3>, <h4>, <h5>, <h6>: encabezados o títulos del documento con diferente relevancia.

• <table>: define una tabla

• <tr>: fila de una tabla

• <td>: celda de datos de una tabla

• <a>: Hipervínculo o enlace, dentro o fuera del sitio web. Debe definirse el parámetro de pasada por medio del atributo href. Por ejemplo: <a href="http://www.wikipedia.org">Wikipedia</a> se representa como Wikipedia)

• <div>: área de la página

• <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen. Por ejemplo: <img src="./imagenes/mifoto.jpg" />

• <li><ol><ul>: Etiquetas para listas.

• <b>:<i>: <u>: negrita, italica y subrayado


EJEMPLO HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="es">

<head>

<title>Sesion en el CEU del MPA</title>

</head>

<body> <p>Hola a todos, estamos en la sesion del MPA. Nuestra primera linea de HTML</p>

</body>

</html>


• El World Wide Web ha pasado de ser un medio para la publicación de información y contenidos, a convertirse en una plataforma para – el diseño y desarrollo de aplicaciones informáticas distribuidas – la creación de comunidades participativas ( WEB 2.0)

• El navegador se ha convertido en un “cliente universal” que facilita el desarrollo de aplicaciones y la adopción de nuevas soluciones tecnológicas, al reducir costes de mantenimiento.


• A lo largo de estos últimos años se han popularizado dos nuevos paradigmas en el diseño de aplicaciones informáticas para la web:

- los llamados web services (servicios web).- AJAX ó el intercambio de datos asíncronos con los

servidores


• En el modelo de aplicación web “tradicional” encontramos una importante limitación: la interacción comienza y termina en dos puntos claramente definidos: la petición del usuario y la respuesta de la aplicación informática.

• Únicamente son dos los “interlocutores” que participan en este proceso

• En cada intercambio de información que se produce, la aplicación informática debe “construir” una página resultado en formato HTML para presentar la información al usuario.


• ¿Qué sucedecería si la aplicación informática tuviese que recurrir a un tercer sistema informático para satisfacer la petición cursada por el usuario?

– WEB SERVICES

• ¿Que se puede hacer cuando solo necesitamos actualizar una parte de la información que se presenta y además necesitamos que esa información sea dinámica?

– AJAX


• Un servicio web se suele definir como una unidad de aplicación capaz de ofrecer datos o servicios de procesamiento a otras aplicaciones informáticas.

• Así, una aplicación podría ofrecer distintos servicios a otras aplicaciones. Las características de estos servicios son:

– Que se solicitan a través del web– Que los resultados de su ejecución también se

devuelven a la aplicación peticionaria a través del web

– Que se tramitan según un modelo “estandarizado”.


• El concepto de servicio web está arropado por una serie de estándares publicados por el W3C y apoyados por los principales fabricantes de tecnología (IBM, Microsoft, etc.),

• Estos estándares señalan cómo se deben cursar las peticiones de servicio a servidores remotos, la forma en la cual éstos deben enviar los resultados, y cómo se deben publicar o dar a conocer los servicios que están accesibles a través de un servidor web.

• Ninguno de estos estándares trata la forma en la que debe implementarse o programarse el servicio en sí mismo. En este punto, se deja libertad absoluta a los fabricantes y proveedores para elegir el lenguaje de programación que deseen utilizar.


• Un servicio web consiste en una función disponible en un servidor conectado al web. Esta función puede consistir en cualquier cosa: – Realizar un simple cálculo con unos datos que se le envían

como parámetro, – Acceder a una base de datos para recuperar un conjunto de

registros, – Validar la corrección de una información o contrastarla frente a

otros datos, etc.

• El servicio web podrá ser solicitado desde otro programa informático que se ejecute en un ordenador conectado al web. Junto a la solicitud de la ejecución, se pueden enviar al ordenador que ofrece el servicio unos parámetros que el servicio web remoto tomará como base para el cálculo o la función.


• La aplicación que actúa como cliente debe conocer:– La URL del servidor remoto que ofrece el servicio, – El nombre del servicio que se solicita, y – Los parámetros que se deben enviar junto con la llamada al

servicio.

• Estos datos se enviarán mediante HTTP • El servidor que ofrece el servicio web leerá los

parámetros que se le han enviado, llamará a un componente o programa encargado de implementar el servicio, y los resultados que se obtengan de su ejecución serán devueltos al servidor que solicitó la ejecución del servicio.


• Los servicios web se definen a partir de las siguientes especificaciones:

– SOAP (Simple Object Access Protocol)– WSDL (Web Services Description Language)– UDDI (Universal Description, Discovery and Integration)

• Del mantenimiento de las dos primeras, SOAP y WSDL se encarga el W3C. En el caso de UDDI, se trata de un proyecto en el que participan distintas empresas

• El lenguage XML constituye la base de todos ellos.


• XML es uno de los lenguajes más utilizados para el intercambio de datos sobre la web. Su desarrollo se remonta en el año 1996 por el grupo de trabajo de la World Wide Web Consortium lanzando su primera versión el 10 de Febrero de 1998.

• El lenguaje XML está concebido para describir objetos de datos llamados Documentos XML y describir de cierta forma los programas que los procesan

• El XML es un lenguaje etiquetado.

XML


XML


SOAP (Simple Object Access Protocol)

• La especificación SOAP indica cómo se deben codificar los mensajes que circularán entre las dos aplicaciones.

• Fue definido inicialmente por Microsoft, Userland Software y DevelopMentor, a día de hoy se trata de una especificación mantenida por el W3C que cuenta con el apoyo de otros fabricantes como IBM, HP, Oracle, etc.

• La especificación SOAP define dos modelos de mensajes: – Un mensaje que se enviará desde la aplicación cliente a la

aplicación servidor, solicitando la ejecución de un método al que se pasan una serie de parámetros.

– Un mensaje que se enviará desde la aplicación servidor a la cliente, y que contendrá datos XML con los resultados de la ejecución del método solicitado.


Ejemplo mensaje SOAP petición

<?xml version="1.0" encoding="UTF-8" ?><SOAP-ENV:Envelope

xmlns:SOAP-ENV=”http://schemas.xmlsoap.org/soap/encoding/"> <SOAP-ENV:Header> </SOAP-ENV:Header> <SOAP-ENV:Body>

<catalogo:buscaIsbn xmlns:catalogo="http://catalogo.org/cat">

<catalogo:isbn>84-4553-3334-2X

</catalogo:isbn> </catalogo:buscaIsbn>

</SOAP-ENV:Body></SOAP-ENV:Envelope>


Ejemplo mensaje SOAP respuesta

<?xml version="1.0" encoding="UTF-8" ?><SOAP-ENV:Envelope

xmlns:SOAP-ENV=”http://schemas.xmlsoap.org/soap/encoding/"> <SOAP-ENV:Header> </SOAP-ENV:Header> <SOAP-ENV:Body>

<catalogo:buscaIsbnResponse xmlns:catalogo="http://catalogo.org/cat">

<catalogo:titulo>Catalogar materiales especiales

</catalogo:titulo> <catalogo:autor>Marta de Juanes</catalogo:autor> </catalogo:buscaIsbnResponse>

</SOAP-ENV:Body></SOAP-ENV:Envelope>


WSDL (Web Services Description

Language) • Permite describir los distintos métodos o funciones que

están disponibles en un servicio web, así como su signatura, es decir, el número de argumentos o parámetros que se les debe pasar, y el tipo de dato que devolverá la función como resultado.

• Se establece una equivalencia entre el documento WSDL y un “contrato” que especifica los servicios que el servidor se compromete a ofrecer al cliente, siempre que éste los solicite de la forma adecuada


WSDL (Web Services Description

Language) • Los documentos WSDL deben estar disponibles en el

servidor web que ofrece los servicios. • Como su creación resulta compleja, las distintas

implementaciones de SOAP permiten generar estos archivos de forma sencilla, sin necesidad de conocer los elementos y la estructura del esquema XML en el que se basan.


UDDI (Universal Description, Discovery and Integration)

• A medida que el número de proveedores de servicios web aumente, será necesario disponer de un sistema de referencia que permita localizar estos servicios. Este es el propósito del proyecto UDDI

• UDDI es uno de los estándares básicos de los servicios Web cuyo objetivo es ser accedido por los mensajes SOAP y dar paso a documentos WSDL, en los que se describen los requisitos del protocolo y los formatos del mensaje solicitado para interactuar con los servicios Web del catálogo de registros.


Arquitectura Orientada a Servicios (SOA)

Servicios publicadosServicios publicadosServicios publicadosServicios publicados

Registro UDDI

AplicaciónAplicaciónClienteCliente

AplicaciónAplicaciónClienteCliente

DescubrimientomedianteUDDI

Servicio 1Servicio 1Servicio 1Servicio 1

ServicioServicio

Servicio Servicio WebWeb

Servicio Servicio WebWeb

Invocación y acceso mediante SOAPTransporte mediante HTTP / Otros… MensajeMensaje

SOAPSOAP

MensajeMensajeSOAPSOAP

PublicaciónmedianteUDDI

Descripción mediante WSDLXMLXMLSchemaSchemaWSDLWSDL

XMLXMLSchemaSchemaWSDLWSDL


• AJAX es una técnica de desarrollo WEB, por la cual se pueden crear aplicaciones WEB más rápidas y cómodas para el usuario. Por medio de esta técnica el cliente puede interactuar con el servidor de manera asincrónica, actualizando las páginas, sin necesidad de volver a cargarlas.

• Esta técnica, no solo es más cómoda y amigable para el usuario (ya que se asemeja a las aplicaciones de escritorio) sino que además es más rápida, porque cada vez que se necesita actualizar un dato en una página, no es necesario recargarla nuevamente (solo se recarga la sección necesaria de la misma).


• AJAX, no es una tecnología en si, sino que es un conjunto de tecnologías aplicadas de manera que logran el resultado explicado anteriormente (es decir, logran AJAX).

• AJAX significa Asynchronous JavaScript And XML, y como su nombre lo indica, se trata de la combinación de JavaScript y XML. JavaScript hace las peticiones al servidor, el mismo le devuelve un resultado (response) en XML, y este es procesado por JavaScript para actualizar los datos de la página, sin tener que recargarla por completo (logrando así una interacción asincrónica entre el servidor y el cliente).


• Para entender como funciona AJAX, primero vamos a hacer un sintético repaso de como funcionan las aplicaciones web “tradicionales”.

1. El cliente le hace una petición (request) HTTP al servidor WEB (generalmente por medio de un navegador WEB).

2. El servidor WEB, procesa la petición dinámicamente. Por medio de un lenguaje de lado de servidor (como PHP o Perl).

3. Una vez procesada la petición HTTP por el servidor WEB, este le devuelve una respuesta en HTML al cliente (lo que se conoce como “página WEB”).

4. Por medio de esa página generalmente el ciclo vuelve a empezar, ya que el cliente puede hacer otras peticiones HTTP al servidor, que a su vez van a ser procesadas y el servidor WEB va a devolver otros resultados HTML, etc.


• Con AJAX, cuando el cliente hace una petición HTTP al servidor, la hace por medio de JavaScript. El servidor procesa la petición y en vez de devolverle al cliente una página HTML, le devuelve un resultado en XML, que es procesado por JavaScript, y este actualiza solo las secciones de la página necesarias (sin tener que cargar una nueva página).

1. El cliente por medio del navegador produce algún evento. Este evento es procesado por JavaScript y le envía al servidor WEB una petición HTTP.

2. El servidor WEB, procesa la petición como siempre, pero devolviendo el resultado en XML.

3. Este resultado es procesado por JavaScript. Que recarga las secciones de la página necesarias para mostrar el resultado al usuario.

4. Por medio de esta misma página, el ciclo comienza de nuevo. Sin haberse tenido que recargar la página.


Data, data, data…everywhere!


Information…that’s another story!


Especially, the right information @ the right time!


Clasificación de la información

1 2 3

4 5 6

7

A B

C

A INFORMACION QUE SE RECIBE (suele ser mucha…….) B INFORMACION QUE SE BUSCA (también es bastante…) C INFORMACION QUE SE NECESITA (es la menor de todas…) 1 Información que se busca, pero que no se necesita ni se recibe. Es una pérdida de recursos 2 Información que se busca y se recibe, pero no se necesita, Es otra pérdida de recursos 3 Información que se recibe, pero ni se busca ni se necesita. Es ruido que distrae recursos 4 Información que se busca y se necesita, pero no llega. Es una debilidad estratégica 5 Información que se busca, se necesita y llega. Es todo beneficios. 6 Información que se necesita, se recibe pero no se busca. Es una pérdida estratégica 7 Información que se necesita, pero ni se busca ni se recibe. Es una debilidad estratégica.


Then, what is Knowledge?


Natham.com


Transformation data WORKFLOW

INNOVATION WISDOMS

KNOWLEDGE

INFORMATION

RAW DATA

ACTIONS FACTS

RESULTS Products Services Processes

DECISIONS

DW - Networks

Technological Survilliance

Experts

VIRTUAL WORLD REAL WORLD


Unstructured information


Structured information


“You can’t have your cake and eat it, too.”

Presentacion sesion 3 en MPA del CEU por Pablo de Castro

Technology

Transcript of Presentacion sesion 3 en MPA del CEU por Pablo de Castro