Anda di halaman 1dari 97

Informtica III

Ing. Wilson Rojas Reales Esp. Seguridad de la Informacin Universidad de los Andes Correo: rojaswilson@unbosque.edu.co Cel: 310 584 1388 / 316 274 7117

Ing. Wilson Rojas Reales

Las pginas JSP estn compuestas de cdigo HTML / XML mezclado con etiquetas especiales y fragmentos de cdigo escritos en Java. Una pgina JSP puede ser escrita en un editor de texto, lo cual quiere decir que podemos incluir lgica de negocio (no recomendable) en la misma pgina. El motor de las pginas JSP, est basado en los servlets de Java. El cdigo se almacena en un archivo con extensin jsp que incluye dentro de la estructura de etiquetas HTML, las sentencias Java a ejecutar.

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

Para qu escribir Servlets si podemos elaborar pginas JSPs ??? El motivo de crear servlets es utilizarlos como controlador, esa es la funcin principal de un servlets. Cuando una pgina JSP es invocada, el servidor la traduce en un Servlet, el resultado es un archivo con extensin java que ser compilado en su correspondiente .class Objetos implcitos: pageContext, request, response, application, config, session, out, page, exception

Ing. Wilson Rojas Reales

Directives: are instructions to the JSP container that describe what code should be generated. They have the general form: <%@ directive-name [attribute=value, attribute=value] %> The specification describes three standard directives available in all compliant JSP environments: page include taglibg

Ing. Wilson Rojas Reales

The attributes are any of those listed: language import session isErrorPage errorPage And more

Ing. Wilson Rojas Reales

Merges the contents of another file at translation time into the .jsp source input stream, much like a #include C preprocessor directive. The syntax is: <%@ include file=filename %> Examples: <%@ include file=/header.html %> <%@ include file=/doc/legal/carta.html %> <%@ include file=odenar %>

Ing. Wilson Rojas Reales

JSP provides a simple means for accessing the value of a Java variable or other expression and merging that value with the HTML in the page. The Syntax is: <%= exp %> Example: The current time is: <%= new java.util.Date() %> where exp is any valid java expression.

Ing. Wilson Rojas Reales

Is a set of one or more Java language statements intended to be used to process an HTTP request. The syntax is: <% statement1, statement2, . %>

Ing. Wilson Rojas Reales

Like scriptlets, declarations contain Java language statements, the syntax is: <%! statement1; [stament2; .] %> Declaration sections can be used to declare class or instance variables, methods, or inner classes.

Ing. Wilson Rojas Reales

Ejemplo 01: para ejecutar el archivo basta con acceder desde el navegador a la pgina. Este ejemplo, simplemente muestra un formulario que solicita login y password. E Incluye la pgina jsp: fecha.jsp. Usted deber acceder a la pgina de la siguiente forma: http://localhost:8080/jsp/ejemplo01/Ejemplo.jsp Sera un grave error acceder a la pgina Ejemplo.jsp sin la existencia de la pgina fecha.jsp (para este primer ejemplo, puesto que podemos controlar el acceso a una pgina que no exista). Observe que en el formulario se hace un llamado (mtodo action) a otra pgina JSP llamada: Mostrar.jsp

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

Las pginas JSP de una aplicacin pueden ser configuradas, como los servlets mediante el descriptor del despliegue web.xml A diferencia de los Servlets, no es obligatorio su uso, aunque SI es aconsejable. Para ello, es necesario utilizar el elemento <jsp-config> , el cual puede aparecer una o varias veces en el archivo web.xml

Ing. Wilson Rojas Reales

Toda aplicacin web tiene 4 partes: Un directorio pblico Un fichero WEB-INF/web.xml Un directorio WEB-INF/classes Un directorio WEB-INF/lib

El rea pblica es la raz de la aplicacin, excepto el directorio WEB-INF El directorio WEB-INF es un rea privada web.xml es el descriptor de despliegue classes contendr clases java (incluyendo las clases compiladas de los servlets) lib contiene cualquier jar necesario para la aplicacin

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

Un JavaBean es una clase java. La ventaja de utilizar esta clase de componentes es que pueden ser insertados fcilmente en cualquier pgina JSP, facilitando as la separacin de la lgica de negocio, que incluiremos en los componentes, de la capa de presentacin. Un JavaBean puede implementar la interfaz Serializable, con un constructor sin argumentos y un conjunto de propiedades. En la carpeta de ejemplos, encontrar internamente otra carpeta denominada beans con un ejemplo que ilustra como crear y utilizar un componente JavaBean A continuacin se explica el ejemplo.

Ing. Wilson Rojas Reales

En la pgina Saludo.jsp se crea un objeto (bfecha) de su clase (beans.BeanFecha) a travs de la etiqueta jsp:useBean

Ing. Wilson Rojas Reales

La clase BeanFecha.java (Parte 1)

Ing. Wilson Rojas Reales

La clase BeanFecha.java (Parte 2)

Ing. Wilson Rojas Reales

La clase BeanFecha.java (Parte Final)

Ing. Wilson Rojas Reales

Una forma (existen otras) sencilla de manipular las excepciones es haciendo uso de los atributos isErrorPage y errorPage de la directiva page. Si deseamos capturar una excepcin para su posterior tratamiento, una pgina jsp deber incluir la siguiente lnea: <%@ page isErrorPage=false errorPage=error.jsp %> La lnea anterior indica al motor JSP que cuando ocurra una excepcin que no sea capturada, ejecute la pgina error.jsp la pgina error.jsp deber incluir la directiva page as: <%@ page isErrorPage=true %>

Ing. Wilson Rojas Reales

Ing. Wilson Rojas Reales

En este ejemplo, se debe tener en cuenta la siguiente configuracin: Utilizaremos un archivo de BD de Access. Debe crear el DSN Este ejercicio, realiza la conexin a un archivo de Access, muestra informacin de una tabla. Se valida el ingreso del usuario. Si no existe, se regresa a la pgina inicial. Si existe se redirecciona a la pgina correspondiente. El ejercicio NO est completo al 100%. EL estudiante si as lo desea, deber construir las dems pginas JSP. Adems, es un ejemplo acadmico para entender el funcionamiento de algunas sentencias.

Ing. Wilson Rojas Reales

El archivo de Access, se denomina hotel.mdb y la tabla utilizada para este ejercicio:

Ing. Wilson Rojas Reales

La configuracin ODBC desde el panel de Control de Windows:

Ing. Wilson Rojas Reales

La pgina inicial de acceso al ejercicio y un ingreso exitoso:

Ing. Wilson Rojas Reales

El siguiente paso en el desarrollo web

El objetivo de la tecnologa JSF (Java Server Faces) es desarrollar aplicaciones WEB de forma parecida a como se construyen aplicaciones locales con Java Swing, AWT, SWT o cualquier otra API similar. Los dos componentes principales son:
Una librera de etiquetas para JSP Una API para manejo de eventos, validadores, etc.
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

Permite a los desarrolladores pensar en trminos de componentes, eventos, backing beans y otras interacciones, en vez de hablar de peticiones, respuestas y marcas. JSF promete reutilizacin, separacin de roles, facilidad de uso de las herramientas. JSF tiene una meta especfica: hacer el desarrollo web ms rpido y fcil.

JSF (en J2EE) es similar a ASP .NET:


Interfaz de usuario dirigida por eventos, Abstraccin del protocolo HTTP

HTML Controles en ASP .NET De validacin De servidor

Tienen correspondencia en JSF

Servlets
Inconvenientes:
Poco legible Mantenimiento costoso El diseador grfico debe saber Java A cada cambio: recompilar, empaquetar, desplegar.

Uso actual de los servlets:


Controlador en la arquitectura MVC Preprocesamiento de peticiones

Java Server Pages (JSP)


Pginas HTML con scripts (por defecto Java) Se traduce a un servlet en la primera peticin Semnticamente equivalente a los servlets Facilitan el desarrollo y mantenimiento

JSP 1.x
Facilidad para manejo de JavaBeans
<jsp:useBean id=user class=Cliente scope=session> <form method=POST action=actualiza.ctrl> <input type=text name=nombre value= <jsp:getProperty name=user property=name/> /> </form> </jsp:useBean>

JSP 1.x
Otras etiquetas estndar de JSP
<jsp:forward page=registro.jsp <jsp:include page=/servlet/ServletCookie flush=true /> <jsp:setProperty name=cliente property=nif value=53146712F />

JSP 1.x
Etiquetas de extensin
Alternativa a los JavaBeans para encapsular la lgica de negocio Componentes para la edicin web Para usar declarativamente la lgica de negocio Ejemplo: <ssdd:enlace URL=index.jsp textoinicio/>

JSP Standard Tag Library (JSTL)


Librera de etiquetas para JSP. No es parte de JSP ni JSF, los complementa Precursor: libreras de etiquetas de Struts Formado por 4 libreras:
core: core funciones script bsicas xml: xml procesamiento de xml fmt: fmt internacionalizacin y formato sql: sql acceso a base de datos

JSTL (Ejemplo con scriptlets, sin JSTL)


<%@ page import=com.ktaylor.model.AddressVO, java.util.* %> <% List addresses = (List)request.getAttribute("addresses"); Iterator addressIter = addresses.iterator(); while(addressIter.hasNext()) { AddressVO address =(AddressVO)addressIter.next(); if((null != address) && (null != address.getLastName()) && (address.getLastName().length() > 0)) { %> <% =address.getLastName()%><br/> <% } else { %> N/A<br/> <% } } %>

JSTL (Ejemplo sin scriptlets, con JSTL)

Librera bsica

<%@ taglib prefix="c"uri="http://java.sun.com/jstl/core" %> <c:forEach items="${addresses}" var="address"> <c:choose> <c:when test="${not empty address.lastName}" > <c:out value="${address.lastName}"/><br/> </c:when> Etiqueta <c:otherwise> N/A<br/> Lenguaje de expresiones Iterador </c:otherwise> </c:choose><br/> </c:forEach><br/>

JSP 2.0
Evolucin de JSP 1.2 Separacin completa de roles Todava se habla de cabeceras, sesin, Elementos principales:
Lenguaje de expresiones (EL) Ficheros de etiquetas SimpleTag vs Tag Mejorada la sintaxis XML

JSP 2.0
Lenguaje de expresiones (EL)
Mismo EL que JSTL, pero soportado nativamente Meta: que lo use gente que no sabe programar Inspirado en JavaScript y XPath Se puede desactivar los scriptlets y habilitar EL ${ <expresin> }

JSP 2.0
Ejemplos de EL
Sin EL Con EL

((Duck) pageContext.getAttribute(duck)).getBeakColor()

${duck.beakColor}

<jsp:useBean id="foo" class="FooBean" /> <%= foo.getBar() %> ${foo.bar}

JSP 2.0
Archivos de etiquetas
Escribir etiquetas slo con cdigo JSP Mecanismo de reutilizacin para autores de pginas Empaquetado de la aplicacin ms flexible
Etiquetas en /WEB-INF/tags TLD implcito
<%@ taglib prefix="..." tagdir="/WEB-INF/tags" %>

JSP 2.0
Ejemplo de archivo de etiqueta.
<%@ tag name=tableTag %> <%@ attribute name=items %> <table width= bgcolor=> <th> <td>Name</td> <td>IQ</td> </th> <c:forEach var=i items=${items}> <tr> <td>${i.fullName}</td> <td>${i.IQ}</td> </tr> </c:forEach> </table>

Componentes de interfaz de usuario Eventos Beans manejados Validadores Internacionalizacin y localizacin Conversores Navegacin

Los componentes de la interfaz de usuario


Son JavaBeans Se ejecutan en el lado del servidor Tienen estado Se organizan en rboles de vistas Representacin especfica: renderer Familia de representaciones: kits de renderer

<%@

taglib uri="http://java.sun.com/jsf/html" prefix="h" %>

Los componentes de la interfaz de usuario


<h:commandButton id=siguiente value=#{msg.buttonHeader} action=sigPagina/>

<h:inputTextarea id=textArea rows=4 cols=7 value=Text goes here/>

Los componentes de la interfaz de usuario


Ejemplo (traduccin de JSF a HTML) (1 de 2)

Enter address: <h:message style="color: red" for="useraddress" /> <h:inputText id="useraddress" value="#{jsfexample.address}" required="true"/> <h:commandButton action="save" value="Save"/>

Los componentes de la interfaz de usuario


Ejemplo (traduccin de JSF a HTML) (2 de 2)

Enter address: <span style="color: red"> Validation Error: Value is required. </span> <input id="jsftags:useraddress" type="text" name="jsftags:useraddress" value="" /> <input type="submit" name="jsftags:_id1" value="Save" />

Eventos
Los componentes UI generan eventos Los listeners se implementan en backing beans o clases aparte 4 tipos:
Value-change events Action events Data model events Phase events

Eventos
Ejemplo: value-change event
<h:inputText valueChangeListener=#{myForm.processValueChanged} />

public void processValueChanged(ValueChangeEvent event){ HtmlInputText sender = (HtmlInputText)event.getComponent(); sender.setReadonly(true); changePanel.setRendered(true); }

Eventos
Ejemplo: action event
<h:commandButton id="redisplayCommand" type="submit" value="Redisplay" actionListener="#{myForm.doIt} />

public void doIt(ActionEvent event){ HtmlCommandButton button = (HtmlCommandButton)event.getComponent(); button.setValue("It's done!"); }

Beans manejados (Managed beans)


Beans de respaldo (Backing beans)
JavaBeans especializados Contienen datos de componentes UI, implementan mtodos de oyentes de eventos Controlador en el Modelo Vista Controlador(MVC) Backing bean por pgina, formulario, Componente UI y backing bean estn sincronizados

Son backing beans que usan la facilidad Manager Bean

Creation Facility

Beans Manejados (Managed Beans)


Ejemplo de declaracin (faces-config.xml):
<managed-bean> <managed-bean-name>helloBean</managed-bean-name> <managed-bean-class> com.virtua.jsf.sample.hello.HelloBean </managed-bean-class> <managed-bean-scope> session </managed-bean-scope> </managed-bean>

Beans Manejados (Managed Beans)


Ejemplo de uso:
<h:outputText id="helloBeanOutput" value=#{helloBean.numControls} />

Utiliza EL parecido al de JSP 2.0

Validadores
Aseguran la correcta introduccin de valores Evitan escribir cdigo Java y/o Javascript JSF provee de validadores estndar Podemos crear validadores propios Generan mensajes de error 3 tipos:
A nivel de componente UI Mtodos validadores en los backing beans (validator) Clases validadoras (etiqueta propia anidada)

Validadores:
Estndar de JSF: campo con valor requerido, validadores de la longitud de una cadena, y validadores de rango para enteros y decimales Ejemplos:
<h:inputText id="userNumber valuevalue="#{NumberBean.userNumber} required=true /> <h:inputText> <f:validateLength minimum="2" maximum="10"/> </h:inputText>

Internacionalizacin y localizacin
Internacionalizacin: habilidad de una aplicacin de soportar diferentes lenguajes dependiendo de la regin del planeta en que nos encontremos. Localizacin: El proceso de modificar una aplicacin para que soporte la lengua de una regin. JSF ofrece el soporte, no las traducciones El usuario indica su lengua mediante el navegador

Internacionalizacin y localizacin
Ejemplo (declaracin en faces-config.xml):
<application> <locale-config> <default-locale>en</default-locale> <supported-locale>en</supported-locale> <supported-locale>en_US</supported-locale> <supported-locale>es_ES</supported-locale> </locale-config> <message-bundle>CustomMessages</message-bundle> </application>

Conversores
Convierten el valor de un componente desde y a una cadena Cada componente se asocia a un slo conversor El renderer lo usa para saber mostrar los datos JSF tiene definidos para fechas, nmeros, etc. Podemos crear los nuestros propios Tienen en cuenta la localizacin y formato

Conversores
Muestran un error si la entrada no es correcta Por defecto JSF asigna uno adecuado Se pueden definir de 4 formas:
Conversores no predefinidos

Etiqueta propia anidada en la del componente En la etiqueta del componente con converter Etiqueta <f:converter> anidada Etiquetas predefinidas (otras) anidadas

Conversores
Ejemplo (conversor predefinido):
<h:outputText value="#{user.dateOfBirth}"> <f:convertDateTime type="date" dateStyle="short"/> </h:outputText>

03/18/06

18/03/06

Navegacin
Habilidad de pasar de una pgina a la otra Lo controla el manejador de navegacin Correspondencia salida/pgina: caso de navegacin Hay que definir las reglas de navegacin

Navegacin
Ejemplo de declaracin (faces-config.xml):
<navigation-rule> <from-view-id>/login.jsp</from-view-id> <navigation-case> <from-outcome>success</from-outcome> <to-view-id>/mainmenu.jsp</to-view-id> </navigation-case> accin <navigation-case> <from-outcome>failure</from-outcome> <to-view-id>/login.jsp</to-view-id> </navigation-case> </navigation-rule> o Pgina
destino Pgina origen

JSF con Struts

JSF con Spring e Hibernate

JSF es una tecnologa de interfaces de usuario centrada en el MVC, interesante y en creciente auge Pretende reducir el salto entre las aplicaciones de escritorio y las web, abstrayendo del protocolo HTTP Promete reutilizacin, separacin de roles, facilidad de uso y reducir el time-to-market Se puede combinar con otros frameworks para obtener un soporte ms potente

Java Server Faces In Action, K.D. Mann Ed. Manning. 2005 Integrating JSP/JSF and XML/XSLT
http://www.theserverside.com/articles/article.tss?l=BestBothWorlds

JSF KickStart: A Simple JavaServer Faces Application


http://www.programacion.com/java/tutorial/jap_jsfwork/

Integracin de JSF, Spring e Hibernate para crear una Aplicacin Web del Mundo Real
http://www.exadel.com/tutorial/jsf/jsftutorial-kickstart.html

JSP 2.0 and JSTL: Principles and Patterns


web.princeton.edu/sites/isapps/jasig/2002WinterOrlando/presentati ons/jsp20-jasig-2002.ppt

Una aplicacin JSF, se ejecuta en un contenedor de Servlets de java. Contiene componentes JavaBeans (llamados objetos del modelo) Pginas principalmente JSPs Beans para acceder a las BD Una librera de etiquetas personalizadas para dibujar componentes UI en una pgina. Una librera de etiquetas personalizadas para representar manejadores de eventos, validadores y otras acciones. Componentes UI representados como objetos.

Un primer ejemplo (Carpeta Carpeta: ser Carpeta: Ejemplo01 Ejemplo01), 01 construir un formulario para el ingreso de un login y password. Al analizar el cdigo, encontraremos etiquetas estndar de HTML: body, body, table, table, etc Algunas etiquetas tienen prefijos: f:view y h:inputText estas son etiquetas JSF Los campos de entrada son conectadas al atributo del objeto. Cuando el usuario ingresa el nombre y la contrasea aparecer una pgina de bienvenida. El mensaje de Bienvenida, contiene el nombre del usuario.

Dos pginas JSP (index.jsp y hola.jsp) Un Bean para el manejo de los datos de usuario. Archivo de configuracin para la aplicacin que contiene recursos del Bean y las reglas de navegacin. Este archivo se llama facesconfig. .xml faces-config Los archivos necesarios para el servlet: el archivo web. web.xml y el archivo index. index.html que redireccionan al usuario a la direccin correcta para la pgina de entrada al sistema.

Ing. Wilson Rojas Reales

Recomendacin: Utilizar un IDE como Eclipse. Se debe crear un proyecto Web Dinmico. Es importante tener en cuenta los parmetros de configuracin:

Ing. Wilson Rojas Reales

Permite separar la lgica de control, la lgica de negocio y la lgica de presentacin. En el ejemplo estudiado, el modelo se ve reflejado en el archivo UsuarioBean.java, es la clase que contiene todos los elementos necesarios para manejar los datos de la aplicacin. El modelo se le comunica al Sistema JSF por medio del archivo faces-config.xml, exactamente donde se detalla la parte managed-bean. Observe que hay un bean denominado usuario que est mapeado con la clase UsuarioBean.java y con un mbito de sesin.

Ing. Wilson Rojas Reales

La vista se trabaja mediante pginas JSF; es decir, mediante las pginas index.jsp y hola.jsp. JSF conecta la vista y el modelo. En el ejemplo, se puede observar claramente que los componentes de la vista estn relacionados a los atributos de un Bean del modelo. En lo referente al Controlador, se puede observar en la pgina index.jsp que existen unas lneas para la captura de los datos de usuario y contrasea as como el botn de Aceptar. Adicionalmente, est el control para las reglas de navegacin, que aparece en el archivo faces-config.xml.

Ing. Wilson Rojas Reales

Por ltimo, tambin hace parte del controlador algunas lneas del archivo web.xml. En la directiva <servlet> se establece el nico servlet de nuestro ejemplo que es el propio framework JSF. En el contexto JSF, la lgica de negocio est contenida en los Beans. El diseo est contenido en las pginas web. Un Bean es una clase Java que contiene atributos y los mtodos get/set por cada uno de sus atributos. En una aplicacin JSF, se deben usar Beans para todos los datos accedidos por una pgina.

Definicin del Bean. La etiqueta <managedbean-class> indica la clase a la que pertence el bean usuario definido en <managed-bean-name> El Bean estar disponible para un Cliente, todo el tiempo que est conectado al sitio web. Los valores se mantienen.

Ing. Wilson Rojas Reales

Cuando se carga la pgina es invocado el mtodo getNombre para obtener el valor del atributo nombre. Cuando se pulsa el botn Aceptar, es invocado el mtodo setNombre para establecer el valor que se ha digitado sobre el componente.

En la pgina h:commandButton

index.jsp,

observamos

la

etiqueta

Ing. Wilson Rojas Reales

Tiene un atributo denominado action (su valor es String) es usado para activar una regla de navegacin que est registrada en el archivo faces-config.xml

Ing. Wilson Rojas Reales

La pgina hola.jsp

En la etiqueta outputText se puede especificar un valor inmediato

Ing. Wilson Rojas Reales

Una aplicacin JSF requiere un Serlvet llamado FacesServlet. Este acta como controlador. La configuracin est en el archivo web.xml El contenedor de Serlvets usa la regla del mapeado servlet para activar el serlvet JSF, quien elimina el sufijo faces y carga la pgina index.jsp

Ing. Wilson Rojas Reales

Navegacin esttica: Ocurre dentro del navegador del cliente. Navegacin dinmica: para implementar este tipo de navegacin, el botn de ACEPTAR debe tener un mtodo referencia. Por ejemplo:

en este caso, loginControlador hace referencia a un Bean y ste debe tener un mtodo denominado verificarUsuario Un mtodo de referencia en un atributo de accin, no tiene parmetros de entrada y devolver una cadena de caracteres, que ser usada para activar una regla de navegacin.

Ing. Wilson Rojas Reales

De acuerdo al ejemplo anterior, tendramos: