0% encontró este documento útil (0 votos)
133 vistas155 páginas

Modelos de Programación 2

Cargado por

GustavoLadino
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
0% encontró este documento útil (0 votos)
133 vistas155 páginas

Modelos de Programación 2

Cargado por

GustavoLadino
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 155

....

·····

Modelos de programación 2

····· ...
··. ·· ... ..··

__ ...··············'·· ...

Autor: Gustavo Enrique Tabares Parra

•••
Modelos de programación 2 / Gustavo Enrique Tabares Parra, /
Bogotá D.C., Fundación Universitaria del Área Andina. 2017

978-958-5459-35-9

Catalogación en la fuente Fundación Universitaria del Área Andina (Bogotá).

© 2017. FUNDACIÓN UNIVERSITARIA DEL ÁREA ANDINA


© 2017, PROGRAMA INGENIERIA DE SISTEMAS
© 2017, GUSTAVO ENRIQUE TABARES PARRA

Edición:
Fondo editorial Areandino
Fundación Universitaria del Área Andina
Calle 71 11-14, Bogotá D.C., Colombia
Tel.: (57-1) 7 42 19 64 ext. 1228
E-mail: [email protected]
http://www.areandina.edu.co

Primera edición: noviembre de 2017

Corrección de estilo, diagramación y edición: Dirección Nacional de Operaciones virtuales


Diseño y compilación electrónica: Dirección Nacional de Investigación

Hecho en Colombia
Made in Colombia

Todos los derechos reservados. Queda prohibida la reproducción total o parcial de esta
obra y su tratamiento o transmisión por cualquier medio o método sin autorización escrita
de la Fundación Universitaria del Área Andina y sus autores.
Modelos de programación 2

Autor: Gustavo Enrique Tabares Parra

••••
i
Índice

UNIDAD 1 Java web Servlet y JSP


Introducción 7

Metodología 8

Desarrollo temático 9

UNIDAD 1 Arquitectura Modelo- Vista-


Controlador
Introducción 23

Metodología 24

Desarrollo temático 25

UNIDAD 2 Java Sever Faces Tecnología


Introducción 42

Metodología 43

Desarrollo temático 44

UNIDAD 2 Servicio web


Introducción 58

Metodología 59

Desarrollo temático 60
i
Índice

UNIDAD 3 Beans Enterprise


Introducción 81

Metodología 82

Desarrollo temático 83

UNIDAD 3 Java persistence API JPA


Introducción 101

Metodología 102

Desarrollo temático 103

UNIDAD 4 Seguridad web


Introducción 128

Metodología 129

Desarrollo temático 130

UNIDAD 4 ISeguridad en aplicaciones web


Introducción 139

Metodología 140

Desarrollo temático 141

Bibliografía 153
1
UNIDAD

1 Unidad 1
·· ...,.··
..··· ··.
···· ...
··· ...

Java web Servlet y


Modelos de programación II
JSP
••• Autor: Gustavo Enrique Tabares Parra
Introducción Aquí se debe explicar los alcances y propósitos generales de la
cartilla y hacer referencia a los temas que lo integran, se debe
mostrar por qué los temas serán útiles e interesantes, puede
hacerse desde la aplicación del tema a situaciones reales.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 7
3
U1 Metodología

Aquí se deben presentar orientaciones metodológicas: cómo leer, comprender y asimilar de


mejor manera los contenidos.

Fundación Universitaria del Área Andina 4


8
U1 Desarrollo temático

Java web Servlet y JSP mente, presentando ciertas ventajas como


la portabilidad, son más potentes, mucho
En esta cartilla el estudiante aprenderá a más eficientes y más fáciles de usar.
usar Java para el desarrollo de aplicaciones
web, aplicaciones que están del lado del Un contenedor “controlador” Servlet es un
servidor y nos basaremos en las tecnologías programa en Java que recibe las peticiones
como Servlet y JSP Java Server Pages. de una página web y redireccionan estas
peticiones a un objeto Servlet.
El desarrollo de aplicaciones web con Ser-
vlet es usado en la mayor parte del mercado El modelo de Servlet la máquina virtual
de las empresas, donde se aplica esta tecno- de Java siendo el entorno de ejecución de
logía de desarrollo, como son: El gobierno, los Servlet se arrancar al iniciar el servidor,
entidades financieras y grandes empresas permaneciendo activo durante todo la eje-
tienen bajo se organización el servicio de cución de la aplicación con el objetivo de
aplicaciones bajo esta arquitectura de soft- atender cada petición o proceso solicitado
ware en el API de Servlet. por el usuario, creando un hilo (thread) pro-
cesos muchos más rápidos.
Para el desarrollo de esta unidad se requiere
contar con algunas herramientas de proto- Las páginas están basadas en informar e
colos http, manejo de HTML, comprender interactuar con los usuarios, como ejem-
el paradigma cliente servidor, el protocolo plo encontramos los motores de búsqueda
TCP/IP y programar en el lenguaje Java. dando respuesta a los diferentes peticiones
que generan los usuarios, Las aplicaciones
Los Servlet web que procesan pedidos desde sus sitios
web a través del comercio electrónico. Los
Es un programa que se ejecuta en un ser- Servlet ofrecen una infraestructura en el de-
vidor web, construyendo una página web sarrollo de aplicaciones web, proporcionan-
para ser devuelta al usuario, se construye do métodos para el análisis automático y
dinámicamente conteniendo información de codificación de los datos de formularios
procedente de bases de datos, respuestas html.
a peticiones mediante datos introducidos
por el usuario, los Servlet en Java es una cla- En constante cambio que enfrenta la infor-
se que presenta una serie de ventajas a las mación, por ejemplo el cambio de dólar, la
anteriores CGI que se desarrollaban inicial- información que se da con el cambio del cli-

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina 9
Andina 5
ma, o noticias que cambian dinámicamente ejecución para su procesamiento. Los Ser-
en la cabecera de las páginas web, en muchas vlet también tienen más alternativas que
ocasiones construyendo la página con el re- los programas normales CGI para optimiza-
sultado de la consulta que el cliente solicito. ciones como los cachés de cálculos previos,
mantener abiertas las conexiones de bases
También encontramos información que de datos, etc.
usan las páginas web desde Bases de Datos
corporativas u otras fuentes, el uso de la in- Potencia: con los Servlets se controla fácil-
formación a través de una tienda en línea, mente las deficiencias que su presentaron
la información de los productos debe estas anteriormente en el desarrollo de los CGI
almacenada en un BD, para que los clientes al ejecutarse, Los Servlets mantiene las una
puedan interactuar con ella. También la in- comunicación directa entre la aplicación y
formación del cliente es importante alma- el servidor web. Pueden compartir datos en-
cenarla para llevar un control de quienes tre ellos. Como puede ser la conexión a una
adquieren productos en línea. BD, un repositorio de almacenamiento, etc.
Son clases desarrolladas en Java, por lo que
El acceso a las cabeceras de las peticiones
se pueden emplear en toda la aplicación
http a través de dos tipos get y post, donde
que la requiera.
el post viene por el cuerpo de la petición,
conteniendo ficheros y el GET la petición Seguridad: es controlada por la máquina
viene por la cabecera URL. virtual de Java, que corrige la mayoría de
problemas detectados de seguridad en los
Los Servlet en Java permiten realizar mu-
CGI, y ya no se aplican en los Servlets.
chas más cosas que en la programación tra-
dicional es imposible, los Servlet permiten Portabilidad: se puede utilizar bajo cual-
compartir datos entre sí, conexiones a bases quier plataforma de ejecución (S.O.) y en la
de datos, ficheros, etc. mayoría de los servidores web como Apa-
Ventajas de los Servlets che, Microsoft IIS, WebStar. Están soporta-
dos directamente por plug-in.
Eficiencia: cada petición por parte de un
cliente crea un hilo, no un nuevo proceso Precio: normalmente todo el software utili-
como ocurría con los CGI tradicionales, don- zado con los Servlets es gratis, para el uso
de se presentaba la sobrecarga de procesos personal o sitio web de bajo nivel, a diferen-
de arracada y dominaba el tiempo de eje- cia de Apache como servidor web gratuito,
cución. Los Servlets, la máquina virtual de la mayoría de los servidores web comercia-
Java permanece activada corriendo, y cada les son caros, cuando se tiene un servidor
petición de la aplicación se maneja como un web comercial, se debe añadir en soporte
thread Java muy liviano y no como un pro- para Servlets en alguno es gratuito y de
ceso del sistema que requiere memoria de muy bajo costo.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 10
6
Servidor web basado en CGI Servidor
web
Petición al CGI 1 Proceso hijo del CGI-1

Petición al CGI 2 - -
Proceso hijo del CGI-2 i

Petición al CGI 3 .-----


Proceso hijo del CGI-3 I

Servidor web basado en Java Servlet Servidor web

Petición al Servlet 1 JVM

------------------ 1 Servlet 1
Petición al Servlet 2

Petición al Servlet 1
><:::~~~~~~::I
Thread Servlet 2

Figura 1. Funcionalidad de Servidor basado en CGI – Servlet


Fuente: Propia

JSP Java Server pages Los elementos HTTP que componen los Ser-
vlets están predefinidos en los JSP, como:
Java JSP se aplica en las páginas web con la
combinación del código HTML en un Java • request: objeto HttpServletRequest
embebido de dos formas: que permite acceder a la información
de la solicitud.
1. Scriptles: código Java-JSP multi-mensa-
je entre símbolos <% %>, donde cada • response: objeto HttpServletRespon-
instrucción debe ir separada por “;” pun- se para generar la respuesta
to y coma. • sesion: Objeto HttpSession asociado
2. Expresiones: son variables que mues- a la petición, Si no se define la sesión
tran un resultado, estas no finalizan con esta será null.
punto y coma, deben escribirse dentro • application: el objeto ServletContext
de los símbolos <%= %>. del contenedor web.
3. Declaraciones se insertan en la clase, no
en un método <%! Declaraciones %>.
• out: Objeto JspWriter-Similar a un
PrintWriter para ejecutar la salida
4. Comentarios JSP <%-- Comentario --%>. para el usuario.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 11
7
Puede ser llamados de forma directa, sin definirlos con anterioridad, veamos un ejemplo.

<%--
Doctllllent index
Created on 13/08/2015, 01:21:04 PM
Author gtabares
--%>

<%@ page contentType= "text/html" pageEncoding= "UTF- 8" %>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/htm14/loose.dtd">
<htm1>
<head>
<meta http-equiv="Content-Type 8 content= "text/ btml; charset=UTF-8 8 >
<title>Pagin a JSP</title>
</head>
<body>
<hl>Pri er aplicaci6 n J SP</hl>
La Hora act u al es del s i stemas es <%= n ew java . util . Date()\>
</body>
</html>

Imagen 1. Archivo html generado automáticamente.


Fuente: http://www.programandoconcafe.com/2011/03/Java-manejo-de-fechas-Javautildate.html

¿Cuáles son las Ventajas de JSP? demos poner diferentes personas en


• Contra Active Server Pages (ASP). ASP
diferentes tareas: nuestros expertos
en diseño de páginas Web pueden
es una tecnología propia y similar de
construir el HTML, dejando espacio
Microsoft. Las ventajas de JSP están
para que nuestros programadores de
duplicadas. Primero, la parte dinámi-
Servlets inserten el contenido diná-
ca está escrita en Java, no en Visual
mico.
Basic, otro lenguaje específico de MS,
por eso es mucho más poderosa y • Contra Server-Side Includes (SSI). SSI
fácil de usar. Segundo, es portable a es una tecnología ampliamente so-
otros sistemas operativos y servido- portada que incluye piezas definidas
res Web. externamente dentro de una página
Web estática. JSP es mejor porque
• Contra los Servlets. JSP no nos da nos permite usar Servlets en vez de
nada que no pudiéramos en princi- un programa separado para generar
pio hacer con un Servlet. Pero es mu- las partes dinámicas. Además, SSI,
cho más conveniente escribir (y mo- realmente está diseñado para inclu-
dificar) HTML normal que tener que siones sencillas, no para programas
hacer un billón de sentencias println “reales” que usen formularios de da-
que generen HTML. Además, sepa- tos, hagan conexiones a bases de da-
rando el formato del contenido po- tos, etc.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 12
8
• Contra JavaScript. JavaScript puede generar HTML dinámicamente en el cliente. Este
una capacidad útil, pero sólo maneja situaciones donde la información dinámica está
basada en el entorno del cliente. Con la excepción de las cookies, el HTTP y él envió
de formularios no están disponibles con JavaScript. Y, como se ejecuta en el cliente,
JavaScript no puede acceder a los recursos en el lado del servidor, como bases de
datos, catálogos, información de precios, etc.

Para la implementación de los Servlet, se hace uso de las librerías básicas y de extensión para
http:
• Javax.Servlet: entorno básico
• Javax.Servlet.http: extensión para Servlet http

Generic aetver--4i de
GenericServlet fum:,tionality

HttpServlet IHTTP protocol


functicmality

Applicalion &pecil'ic
MyS ervlet
functionality

Imagen 2. Estructura del uso de Servlet básico


Fuente: http://ramannanda.blogspot.com.co/2009/06/Java-Servletsintroductioncompilingdeplo.html

Estructura básica de la definición de un Servlet:

import j a v a . i o-. IOExc ept ion ;


import j a v a . i o,. PrintWri te r ; // Para so de entrada y sa11das
import j a v ax.se rvl et.Se rvl e t Exc eption;
import j a v ax . se rv1 et . annotation . WebServ1 et;
import j a v ax.se rvl e t . http . HttpSe rvl e t ;
import j avax . se rv1 et . h ttp . HttpSe rv1 et Re guest;
import j a v ax.se rvl et. h ttp . HttpSe rvl etResponse;
I""
"
"@author gtabares
"/
@W eb Se rvl et {ur lPattern s = {"/ModeloServlet" }}
public class Hode loServle t extends HttpSe rvle t
protect ed void processReqnest( HttpSe rv1 etRe guest r e que s t, Ht tpS e rv1 e tRe spons re s p onse)
throws Se rvl etExcep ti on , IOExc e p t ion {
/" E1 objeto "request" se uti1iza para 1eer 1a cabecera HTTP, cookies,
datos env1ados por (GET o POST), El objeto "response"
para indicar la respuesta /
respo n se.s e tCo-nten t Type( "text/htn:l;charset=tJTF-8" ) ;
try (Pr i n t Wri te r ~ = r esponse . get.Write r [ )) {
// out Se utiliza para enviar el contenido al cliente

@Override
pro t e c ted voi d doGet( HttpSe rvl etReques t re quest, Ht t pServletRespon se respons )
throws Se rvl etExc eption, IOExc eption
processRequest(reguest, r esp o n se ) ;

@Overri de
protected void doPos t (HttpSe rvl e tRe que st r e ques t, HttpSe rvl e tRe sponse r e spo e)
t hrows Se rvl etException, I OExcep t ion
p ro cessRe quest( r e quest, r esponse ) ;

@Override
public Strin g getS e rv1e tlnfo ( ) {
r e turn "Short description" ;
) // </editor-fold>

Imagen 3. Servlet Java imagen de código generado por el autor dese IDE Netbeans
Fuente: Propia.
Ejemplo de la aplicación de un Servlet

import j a.v.a . i o . ., ;
import j a v.a x . ::ie rvl et . ., ;
import j a v ax.::ie rvl et. h ttp.

publi c clas::, ModeloServlet extend::, BttpSe rvlet {

public void doGet (HttpSe rvl et Reque::it r e que::it, HttpSe rvlet Respon se r e::ipo n se )
throws Servl etException , IOExcept i on {
respo ::ie.setCo n ten t Type ( "text/htmlff ) ;
Pr int Wri ter o t = r espo n se . getWr i ter () ;
o u t . p rin t ln( <~DOCTYPE HTML PUBLIC \" - //W3C//DTD.,
+ HTML 4 .0 Transitional//EN\">"
+ <html> <head><title>Hola Mundo</ title></head>"
+ < body> <hl>Hola M' do</hl> </body></html>,, ) ;
}

Imagen 4. Método doGet del Servlet imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

Normalmente es más práctico usar scriptlets que expresiones jsp.


• Muchas veces hay que comprobar valores, realizar acciones mucho más complejas,
realizar un bloque de instrucciones cortas, etc.
• Por ejemplo, la siguiente expresión la podemos simplificar a través de un scriptles.

<p>Au to r = <%= application . getln itParameter ( "A tor" ) %>< / p>

S cript l et
<%
String a u tor = application . getln itParameter ( "A·tor ) ;
if (( a.u tor = null ) II (a u tor . trim () . equal::i ( "" ))) {
a u tor = "Ano i mo" ;
}
ou t . prin tl n( "A tor=" a u tor ) ;
%>

Imagen 5. Scriptles en JSP imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

En el ejemplo <p>Autor = <%= application.getInitParameter(“Autor”) %></p> Lo que trata


es de ejecutar una instrucción directamente lo que venga a través de “autor”.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 14
10
Con el Scriptles, se asigna sobre una variable de tipo String el parameter (Autor) y se valida a través
de un condicional if si el autor esta en nulo y si al ejecutar el Scroptles no escribieron nada el algún
formulario. Este se valida con autor.trim().equals(“”). En caso de que sea nulo o este en blanco se la
asigna a la variable autor la etiqueta de Anónimo.

Declaraciones de variables en un scriptlets


Se pueden incluir declaraciones en la clase del Servlet con la instrucción <%- declaración %>.
• Este código se inserta fuera de los métodos de la clase, como nuevas declaraciones
en la clase.
• Variables del Servlet.
<%! private int edad; %>.
• Si se declaran variables con <% …. %> serán locales al scriptlet
• Métodos.
Es mejor declararlos en una clase Java aparte.
<%! private int contador = 0; %>
<p> Número de visitas que registra esta página <%= ++contador%>
</p>
Directivas

Las directivas se aplican a la clase Servlet generada, sintaxis de directiva.

<%@ directiva atributo = “valor” %>.

O bien

<%@ directiva atributo1 = “valor1” %>

atributo2=”valor2”

atributoN = “valorN” %>

Directivas comunes:
• Include: incluye otros ficheros que son de tipo jsp, pueden ser de tipo jsp, html o un
Javascript.
• El fichero se referencia con una URL relativa a la página JSP o al servidor si va prece-
dido de “/”.
<%@ include file=”/URL” %>.
• Page Permite importar un paquete <% page import=”Java.util.*” %>

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 15
11
Ejemplo de Servlet con Netbeans

Servlet Básico en NetBeans.

Vamos iniciar con la creación de Servlet sencillo con el IDE de desarrollo de NetBeans:

Primera aplicación JSP

Primer paso: creamos un nuevo proyecto, File/New Project…

Steps Choose Project

L Choose Project Q. Riter:


2.
Categories: Projects:

Web AppliCiltion with Existing Sources


Java Web Web Free-form Application

Java ME Embedded
Java Card

Description:
Creates an empty Web apprlCiltion in a standard IDE project. A standard project uses an
IDE-generated build script to build, run, and debug your project.

< Back Next> Finish

Imagen 6. Creando un nuevo proyecto imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

En la sección de categorías, seleccionamos de la lista Java Web y en la lista de proyectos se-


leccionamos la opción Web Application.

Clic en el botón Next (Siguiente), y le asignamos el nombre al proyecto: “JavaServlet”.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 16
12
Ste ps Name .ind Location

1. Choose Project Project Name: IJavaServlet


2. Name and location ~-: :::::::::::::::::::::::::::::::::::::::::::=:
3.
4.
Server and Settings
Frameworks
Project Location: IC: lµsers ¥,uentabares \')orumentsV>!etBeansProjecits I ["y«iwse7

Project Folder: ~ : lµsers ¥,uen tab ares \')oruments V.etBeansProjects \Javaservle·'

D Use Dedicated Folder for Storing Libraries


Libraries Folder: Browse . ..

Different users and projecll. can share the same compilation


libraries (see Help for deta·ls).

[ <Back 1 1 Next> Finish [ CancU [ H~p =:J


Imagen 7. Asignando nombre al proyecto JavaSerlvet imagen de código generado por el autor desde IDE
Netbeans
Fuente: Propia.

Siguiente paso configurar el servidor web con el que realizaremos el ejercicio, es necesario
para la ejecución del Servlet, ya que estos solo corren en un servidor web. Para este ejemplo
utilizaremos el servidor que trae NetBeans por defecto llamado GlassFish.

Steps Server and Settings

1. Choose Project Add to Enterprise Application : G None>


2. Name and Location
3.
4.
Server and Settings
Frameworks
Server: ~ s h Server 4.1 ......... '"G I Add,,,

Java EE Version: ~va EE 7 Web::::;J

Context Path: c.l/_Ja_v_a_S_er_vl_e_t_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ __ ,

Imagen 8. Seleccionar el servidor GlassFish Server 4.1 imagen de código generado por el autor desde IDE
Netbeans
Fuente: Propia.

Fundación Universitaria del Área Andina 13


17
Seleccionamos el botón Finish (Finalizar), y tendremos la siguiente estructura de nuestro
proyecto.

8··· JavaServlet

8',,·· ,.... .
L... liJ
$·· Source Packages
· ··· <olefault package >
Libraries
f,·· $·· · ] DK 1. 7 (Default)
@-·· EE GlassFish Serv er 4. 1
e-- Configuration IFiles
L.... ~ MANIFEST.MF

Imagen 9. Estructura de archivos del proyecto imagen de


código generado por el autor desde IDE Netbeans
Fuente: Propia.

En la estructura tenemos un archivo que se llama idex.jsp, en el cual podremos crear un for-
mulario para llamar al archivo Servlet de la aplicación.

En la siguiente figura muestra el código del archivo index.jsp y en el escribiremos el código


para crear un formulario. En la etiqueta <form action=”Servlet” method=”post”>, se define
el nombre del Servlet.

<!DOCTYPE html>
< ! --
A t h or: Gtabares
-->
<html>
<head>
<title>TODO s ppl y a t i t l e</title>
<meta charset= ff0TF - 8ff>
<meta name = nviewportff concenc = nwidth=d.evice - width, initial - scale=1 . on >
</head>
<body>
<div>TODO wri te con ten t </div>
<form action= nservlet" ~ ethod= npost" >
Escri be t n o mbre :
<input type="text" n ame="nombre" >
<input type='"sub.mit" v al e=·nenviarn >
</form>
</body>
</html>

Imagen 10. Formulario en HTML imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 18
14
Vamos a crear el código, del Servlet del proyecto para esto damos clic derecho sobre el pro-
yecto JaveServlet seleccionamos New / Servlet.

New

Build
Cle n ood Buid
Cl• n

~.
V ~1

Run
doc

D~
Dsug
Prof,!.
T lifSTI el>
tsl Al\.F&

Scta,MoinP,qect
o.-~. e<1P,.,,.m
CIOH

Imagen 11. Crear el Servlet de la aplicación imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

En la siguiente imagen se define el nombre del Servlet (para este ejemplo lo llamaremos Ser-
vlet, ya que fue el que definimos en la etiqueta del formulario), y pulsamos el botón clic, con
esto hemos creado un archivo llamado Servlet.Java, el cual debemos de programar en Java.

Steps Name and Location

1. Choose File Type Class Name: Servlet


2. Name and Location
3. Configure Servlet Deployment
Project: [Java"Servlet

Location: ISource Packages


Package: ..,
Created File: f'µs ers \Guentabares 'i)OOJments',,letBeansProjects \]avaServle t\src\iava \Servlet. java]

Warning: It is highly recommended that you do not place Java dasses in the default package.

[ < Bacx I I Next > I[ Finish I[ Cancel 1[ Help J

Imagen 12. Definir el nombre del Servlet imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 19
15
Código generado del Servlet.Java
(;] import java . io . IOException;
import java.io.PrintWriter;
import javax .servl et . ServletException;
import javax .servlet . annotation . WebServlet;
import javax .servl et . h ttp . HttpS e rvl et;
impo rt javax .servl et . http . HttpSe rvl etRe quest;
impo rt javax . se rvl et . h ttp . HttpS e rvl etRespons e;

lr /:*@author Guentabares
L */
@WebServlet(urlPattern s = { "/Servlet" })
public c lass Servlet exten ds HttpServlet

pro tected void processRequest (HttpServl etRequest request, BttpServl etRespon se response )
El t h r ows ServletException, IOException {
response.setContentType( "text/html;cbarset=tJTF-8" );
try (PrintWriter out= response . getWriter[)) {
/• TODO output your page here. You may use following sample code. *I
out . println( "<!DOCTYPE htm.1> 0 ) ;
out . println( "<html>" ) ;
out . println( "<head>" ) ;
out . println( "<title>Servlet Servlet</title>" ) ;
out . println( "</head>" );
out . println( "<body>" ) ;
out . println( "<hl>Tu nombre es: " + request . getParamete~ ("nombre" ) + "</bl>" );
out . println( "</body>" ) ;
out . println( "</html>" ) ;

0 !HttpServlet meth ods . Click on the+ s ign on the left to edit t h e code .I

Imagen 13. Personalizando el código del Servlet imagen de código generado por el autor desde IDE
Netbeans
Fuente: Propia.

Modificamos y agregamos el siguiente código:

out . println,( <hl>Tu nombre es: . request . getParameter ("nombre ) </hl>"')

Imagen 14
Fuente: Propia.

En el código anterior, hacemos uso de la instrucción request.getParameter(“nombre”) para


obtener el nombre que se digita por el formulario en el archivo index..jsp.

Podemos ejecutar nuestro proyecto para verificar los resultados. En el botón run.

Situado en la parte superior del IDE.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 20
16
Salida del proyecto en el explorar google Chrome.

Ej emplo de Ser d et
I
Esc.ribe tu nombre: J.-P-ed-ro- Pe-,-ez_ _ _ _ _ enviar I
Imagen 15. Formulario de salida de la aplicación web imagen de código generado por el IDE Netbeans
Fuente: Propia.

Al digitar el nombre y pulsar sobre el botón enviar nos da como salida nuestro Servlet:

Tu nombre es : Pedro Perez


Imagen 16. Salida de la aplicación web. Imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 21
17
1
UNIDAD

1 Unidad 1
·· ...,.··
..··· ··.
···· ...
··· ...

Arquitectura Modelo-
Vista-Controlador Modelos de programación II

••• Autor: Gustavo Enrique Tabares Parra


Introducción Un patrón de diseño en programación es un conjunto de bue-
nas prácticas o un modelo estandarizado que permite ordenar
la forma programación, es decir ordenar el código de alguna
manera que nuestro proyecto se mantenga con el tiempo y
facilitando a otros desarrolladores la comprensión de forma
fácil del código y estructura del proyecto.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 23
3
U1 Metodología

El desarrollo de esta cartilla este desarrollada bajo en tema de patrones de diseño MVC, se
recomienda al estudiante seguir de forma adecuada el desarrollo del tema, apoyándose en
el material complementario. Lecturas de referencias, Videos capsulas. Es importante estar
muy activo en la video conferencia es un espacio donde se pueden aclarar muchas dudas
que se presenten con el tema.

En esta semana se realizara la primera evaluación a través de un Quiz, enfocado a los con-
ceptos del tema de la semana 2. Adicional hay una actividad de repaso que le permitirá al
estudiante poder aplicar los conocimientos adquiridos hasta el momento.

Fundación Universitaria del Área Andina 4


24
U1 Desarrollo temático

Arquitectura Modelo-Vista-Controlador
El patrón de desarrollo Modelo-Vista-Controlador establece unos lineamientos de buenas
prácticas de programación, según la cual todo programa orientado a objetos bajo este pa-
trón consta de tres partes: el Modelo, La Vista y el Controlador.

4. El controlador selecciona
3. El modelo devuelve una vista.
Modelo los datos. Vista

2. El controlador solicita al modelo los datos.


5. Se devuelve la vista seleccionada al controlador.
Controlador
I
1. El usuario envía una petición al controlador vía una URL.
ll
Usuario
6. El controlador devuelve una vista (página aspx) que
carga los datos del modelo seleccionado.

(navegador)

Figura 1: Patrón de desarrollo Modelo-Vista-Controlador


Fuente: Propia.

Esta arquitectura pretende que el programador separe la parte lógica del programa, de la
parte de presentación. Como siempre, al dividir un problema, se disminuye la complejidad
de su solución, y permite que más tarde el mantenimiento sea mucho menos costoso en tér-
minos de tiempo y dificultad, ya que dependiendo de la naturaleza (del modelo, de la vista
o del control) del aspecto sobre el que se requiera un cambio o un ajuste, su ubicación es
más rápida y los efectos de efectuar sobre ella el mantenimiento serán más claros y predeci-
bles. Si por ejemplo lo que se quiere es cambiar un logo en una pantalla, pues este cambio
solo afecta una parte de la vista, sin alterar al modelo o al controlador. Si por el contrario se
requiere un cambio en un método de un objeto como por ejemplo el cambio en el cálculo

============================• Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 25
5
de retención en la fuente, solo se tendrá que modificar el método dentro de la clase corres-
pondiente al objeto dentro del modelo.

La aplicación del patrón MVC facilita también la reutilización de partes del programa. Si por
ejemplo una interface igual a una ya programada es requerida, pues se puede utilizar sin
problema aunque la lógica que la vaya a utilizar sea diferente.

Controlador

Modelo Vista

Figura 2. MVC Simplificado imagen tomada del sitio


Fuente: http://juandarodriguez.es/cursosf20/unidad2.html

Modelo
El Modelo es la parte del programa que contiene las clases correspondientes al modelo de
datos y es el encargado de interactuar con la base de datos.

Controller
,r --------------------
t I
I

Model
I
I
I
I
I

t
•L------------ ------ ------
I
I
View

Maneja el comportamiento y los datos de dominio de la aplicación,


responde a los requerimientos de información acerca de su estado
(usualmente desde la vista) y responde a las instrucciones para
cambiar de estado (usualmente desde el controlador).

Figura 3. Descripción del Modelo imagen tomada del sitio


Fuente: Propia.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
26
6
Vista
La Vista es la encargada de las interfaces con las cuales el programa se relaciona con el usua-
rio, permitiendo las entradas y las salidas de datos, es la interfaz visible a los operadores y/o
a otros sistemas.

f ------------------- Controller


'
I
I

Model
I
I
I
I


I

•L------------ ------------
I
I
View

Maneja el despliegue de información.

Figura 4. Descripción del Vista


Fuente: Propia.

Controlador
Es el encargado del bloque de control, su función es recibir y/o enviar datos al a la interfaz
y además crear instancias de los objetos del modelo con el objetivo de poder ejecutar sus
métodos dependiendo de la funcionalidad del programa.

Interpreta las acciones del usuario de teclado y ratón. Informando al modelo y/o a la
vista para cambiar apropiadamente sus estados.

f ------------------- Controller


'
I
I

Model
I
I
I
I


I

•L------------ ------------
I
I
View

Figura 5 Descripción del Controlador


Fuente: Propia.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
27
7
Ejemplo

Escenario: desarrollar un programa para simular una calculadora que pueda sumar, restar,
multiplicar y dividir dos operandos que un usuario digita. Se deben mostrar los operandos,
la operación y el resultado.

Un ejemplo sencillo en el que se aplicaran cada uno de los conceptos tratados hasta el mo-
mento, es decir desde el planteamiento del escenario hasta su arquitectura MVC.

Escenario

Identificación de objetos en el escenario.

Para identificar los objetos se seguirá el procedimiento de elaborar una lista de los sustanti-
vos que están mencionados en el texto del problema:
• Calculadora
• Operando
• Operación
• Usuario
• Resultado

Después de esta operación analizamos cada uno de ellos, para encontrar aquellos que den-
tro del escenario existen independientemente.

Calculadora tiene existencia propia, no depende de otro objeto, luego es válida su inclusión
como objeto.

Operando es un dato que será utilizado por la calculadora para efectuar alguna operación,
por sí solo no tiene sentido su existencia, luego no es un objeto. En este caso aparecen 2.

Operación solo tiene existencia dentro de la calculadora, esta es quien realiza la opera-
ción, de lo cual se deduce que No es un objeto.

Usuario, es quien utiliza el programa, luego aunque se menciona dentro del texto, está por
fuera del escenario, luego no es un objeto.

En conclusión este escenario únicamente tiene al objeto calculadora.

Abstracción de objetos
Como el único objeto identificado es calculadora, solo se efectuara la abstracción de él, co-
locándole un nombre e identificando sus componentes (o atributos o características), lo
mismo que los métodos que permiten que los valores de esos componentes puedan ser
modificados.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 28
8
Los componentes normalmente son los sustantivos que hemos rechazado como objetos,
pero que están dentro del escenario, es decir que forman parte de la solución del problema:
• Operando1
• Operando2
• Operación resultado

Teniendo la lista de componentes, podemos elaborar una lista de metodos, analizando cada
componente y deduciendo que modificaciones puede tener el valor del componente y
como se pueden efectuar:

Para operando1 se requiere que el valor sea uno de los que interviene en la operación,
luego el cambio de valor se obtiene “poniendo” dentro del valor correspondiente. Debemos
tener un Método que permita hacer esto:

Establecer_operando1 ()

Como el resultado pide que “se muestren los operandos”, hay que tener otro método que
“extraiga” el valor del OPERANDO1:

Obtener_operando1 ()

Con operando2 sucede lo mismo, luego también se requieren dos métodos:

Establecer_operando2 ()

Obtener_operando2 ()

Existen cuatro posibles valores para el componente operación: “suma”, “resta”, “multiplica-
ción”, “división”. El componente como es normal, solo tendrá uno de ellos y hay que “ponerlo”
dentro de él. Para este efecto se utilizará el método:

Establecer_operación ()

Al final también hay que mostrar el valor de operación, luego hay que extraer el valor de
OPERACIÓN para mostrarlo:

Extraer_operación ()

Como su nombre lo indica, el componente resultado no es “cargado” con un valor específico


predeterminado (como sí lo son los operandos y la operación), sino que resulta de efectuar
la operación correspondiente, luego se necesita un método que defina qué operación se
debe efectuar y que la realice:

Calcular_resultado () Y para “extraerlo”

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 29
9
posteriormente:

Obtener_resultado ()

En este punto ya tenemos todos los elementos que conforman el objeto calculadora del
problema y lo podemos diagramar:

Abstracción del objeto calculadora

Calculadora

Operrando1 Numérico

Operrando2 Numérico

Operador Carácter

Resultado Numérico

Establecer_operando1()

Establecer_operando2()

Establecer_operación()

Calcular_resultado()

Obtener_operando1()

Obtener_operando2()

Extraer_operación()

Obtener_resultado()

Figura 6. Abstracción de la clase


Fuente: Propia.

En el diagrama para cada componente se debe especificar el tipo de datos que recibe. Este
diagrama es el mismo diagrama de clase del objeto calculadora.
Diagrama de clases del problema

Usando la arquitectura MVC, se debe especificar el modelo y el control, para este caso la vista
estará incluida dentro del control.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 30
10
Como solo hay un objeto, entonces el número de clases que conforman el modelo es solo
una:

Modelo

Calculadora

Operrando1 Numérico

Operrando2 Numérico

Operador Carácter

Resultado Numérico

Establecer_operando1()

Establecer_operando2()

Establecer_operación()

Calcular_resultado()

Obtener_operando1()

Obtener_operando2()

Extraer_operación()

Obtener_resultado()

Figura 7. Modelo lógico Bean


Fuente: Propia.

Bloque modelo del diagrama de clases del problema


Necesitamos el bloque de control, el cual constara únicamente de la clase principal que
debe tener siempre todo controlador. A esta clase la llamaremos Calculadora_basica ()
y el diagrama completo quedara de la siguiente forma:

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 31
11
Modelo

Calculadora

Operrando1 Numérico

Operrando2 Numérico

Operador Carácter

Resultado Numérico
Control
Establecer_operando1()
II( Calculadora_basica()
Establecer_operando2()

Establecer_operación()

Calcular_resultado()

Obtener_operando1()

Obtener_operando2()

Extraer_operación()

Obtener_resultado()

Figura 8. Diagrama de clases del problema


Fuente: Propia.

Diagrama de clases del problema


Desarrollo Web: MVC. Patrones de diseño web.

Una calculadora básica como aplicación, Queremos sumar dos números.

Inicialmente vamos a separar las cosas que hace el servidor y las cosas que van de la parte
del cliente.
1. El cliente hace una petición desde la página principal (index.jsp) de la app Calculadora.
2. El servidor procesa la pantalla inicial, que permite ingresar dos números.
3. El cliente suministra dos números y presiona el botón Sumar del formulario.

~-------· Fundación Universitaria del Área Andina


Fundación Universitaria del Área Andina 32
12
4. Esto genera que se haga una solicitud a un pedido a otra página, que debe tomar los
valores ingresados por el cliente (a través de los métodos get o post), efectuar la suma y
mostrar ese resultado por pantalla.

El formulario de index.jsp dice:

<form method=”post” action=”calcular”>

¿Qué se puede colocar como parámetro en la opción action de un form?


■ links externos («http://....»)
■ links internos dentro del mismo proyecto
• páginas html
• otros recursos (archivos pdf, xls, con un formato que el browser pueda mostrar)
• o se puede redireccionar al destino a una clase Java que se ejecute del lado del servi-
dor y devuelve una página html al cliente. Tenemos dos posibilidades: 

• páginas JSP

• servlets

El method hace post/get a un action «calcular». ¿Dónde va a parar ese pedido entonces?

Abrimos el archivo web.xml de src/main/webapp/WEB-INF y vemos que es un xml que


mapea nombres con .... servlets.

<:.erv let >


<se rvlet - name >ca lc ula r </ se rv l et - name >
<se rvlet-class >a r . ed u .u nq . tp i . la bso . ca lculador a.co nt r ol . Ca l cu l a rSe r vl et </ servl et - class >
</ servl et >

El código anterior permite relacionar un nombre («calcular») con un package name + nom-
bre de la clase del servlet.

Podemos probar en el archivo web.xml cambiando el contenido de la url-pattern y el packa-


ge y analizar los errores que arroja.

Un Servlet
Es una clase Java que extiende HttpServlet. CalcularServlet en este ejemplo implementa un
único método doPost. El servlet está pensado para recibir un pedido (http request), proce-
sarlo y devolver código html que pueda ser formateado por el browser.

Métodos son importantes para un servlet


• doPost(), cuando recibimos un http request vía post.
• doGet(), ídem pero vía get.

~-------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 33
13
Estado de un servlet

Si un servlet es una clase Java, ¿puede tener estado?


■ Técnicamente e Java, los servlets son singletons, entonces por más usuarios que haya co-
nectados al web server, sólo se tiene una instancia de cada servlet de la aplicación.
■ Los atributos o variable que se han definido en un servlet, estas son compartidas entre
todas las sesiones activas, el acceso a esas variables es concurrente.
■ entonces el manejo del estado de una página no es trivial:
• El servidor no retiene información por sesión de usuario. 
• y encima al pasar entre página y página pasó por el cliente que está limitado por lo
que el HTML me deja hacer.

MVC en Web

Variables
session/ reque st/application
($~~·

3: del~ga en o ·etos
b7
home/ de negoc io, guard a · e
~ ~ses-i6n

Web Server
1: se ver procesa
pagin yvue lve al
li e nte

JSP se randeriza
a HTML

Cliel'lte (Bro I/Ser)

Figura 9. Diagrama del patrón MVC para aplicaciones web. Imagen tomada del sitio http://algo3.uqbar-
project.org/temario/03-intro-web/java/web-mmvc

A través del siguiente ejemplo implementaremos un ejercicio para aplicar el patrón de desa-
rrollo MVC en aplicaciones web.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 34
14
Crearemos los siguientes archivos que describen lo siguiente:

Archivo Entradas.jsp página (vista).

Archivo User.Java Bean (Modelo).

Archivo Procesos.Java Servlet (Controlador).

Archivo Resultado.jsp página (vista).

Creamos una aplicación Java Web / Web Application, con el nombre de implementación-
MVC, definimos el servidor GlassFish Server y clic en finish.
0.. Fit.er :
Categories:
Java
JavafX Web Application with Existing Sources
Java Wei> Web Free-form Application
Java EE
HTMLS
Java ME Embedded
Java Card
Maven
Pt-IP
Groovy
C/C++ V

Figura 10. Creación aplicación web


Creates an empty Wei> appfocation in a standard IDE project. A standa,d project uses an
IDE· g"'1eratied build script to l>uid, n.11, and debug your project.
imagen de código generado por el autor
desde IDE Netbeans
Fuente: Propia.
Ya tenemos el proyecto creado, con la estructura de archivos generado y el index.html que
lo podemos eliminar para crear el jsp.

,___~x. -Se
_ ,_·-~ Fi - ~-----<
_ll_e s _ P_r_o_.. ~ ~ index.html X ~--------------------------

. -- Implemen--,.r,c So.xae 1-ts1nry I!© • • • • 'O.. ~ ¢l ~ =-~ I'i? ~ l?o I~ ~ I D


S-- Web Pages < ! DOCIYPE h=1>
] I t [il ::::~ <!--
~ ..
$,..
rf}..
Soll"ce Packages
Lbraries
Configlsalion Fies
l To chanqe th15 license header, choose L1.cen.se Header!! in P
To cha.."lge th.:..:!1 t.e.!!p_ace file,choose Tools I Templates
a..'ld ope:n ~he te..!!:p-at:.e in the edi c.or.
-->

<head>
<title>TODO supply a title</title>
<Jc.eta chazset= "UTF-8" >
<Ee:ta nazt.e- RvLewport" content= nwidth=device-width ,
</ head>
<body>
14 <d.iv>TOOO wric e content < / div>
15 < / body>
16 < / html.>

Figura 11. Estructura de archivo proyecto Web Application imagen de código generado por el autor desde
IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 35
15
Para crear el primer archivo entrada.jsp correspondiente a la vista, da clic derecho del mouse
sobre Web Pages, new, JSP…
8 Ul"!)lementacionMVC
II

l+I
New

Find ...
- ... ,~
~o Folder...
Servlet ...
JSP ...
Figura 12. Creando el archivo JSP imagen
generada por el autor desde IDE Netbeans
Fuente: Propia.

Creamos el siguiente código en el archivo Entrada.jsp para el formulario de entrada de los


datos del usuario.

<%@ page conteutType = rrt ext / htllll." pa.geEncoding= '"OTF- 8"'%>


< ! DOCTYPE html>
<html>
<head>
<meta h ttp- equiv="Content- Type content ="text/ ht:ml; charset=UTF- 8 " >
<titl e >Infor-maci6n del Usuario</title>
</head>
<body>
<bl>Informaci6n del Usuario</bl>
<foi:111 etbod= "'pos t" action= "'" >
Nombre : <input type= "text" name=" priNombre" /><br>
Apellido : <input type="text name="priApe~lido /><br>
Email : <input type= "'text"' name= "email /><br>
<input type = nsu.b.mit" value = " env i ar" />
</faun>
</body>
</html>

Figura 13. Código archivo entrada.jsp imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

Para crear el siguiente archivo clic derecho sobre Source Packages, seleccionamos new, Java
class con el nombre de User.Java, y creamos el paquete com.ejer.modelo.

En el archivo User.Java es importante crear el constructor de la clase con los argumentos


definidos de la clase, ejemplo.

publ i c User(String priNombre, String priApellido, String email ) {


this . priNombre = priNombre;
t hi s . priApellido = priApellido;
t hi s . email = e mail ;
}

Figura 14. Definición del constructor de la clase User.Java imagen de código generado por el autor desde IDE
Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 36
16
A continuación creamos los métodos Getter y Setter de la clase en el archivo User.Java como
se muestra a continuación.

• lautb<lr 1: !:Ar "

p11bl1c class Osot


pr~••t~ 3tr1n9 ~r~Noabre :
pr1••t• S,E1M pr1A 1110
pr,vate ~tr~ 1 ;

.i:e, Su·1 U lt
th.u1 , s,r1. .. .. • pr1lf0trilre;
~h1~ . pr Apell1do • prLAF~ll1do:
itl\U . I 1 • -11. :

•I
e.- rn

r@)

pub 1<! !itCltiq get.PrtApe.l.lld<l 0


r•~~r~ r l ~~ :

pru.pal lClO •

p;.bljc vc•d sctfTlApc:J.li<lo jS;r1n; pr1~llldQJ


th1• , r • • Ptl.1,J>tlUdo;

re llTD . 11

p,.J;,11,; lltri..ov Q ll()


:te-ca:n. e-~ ! :

., 11 I!

p11l1Uc VOld
• 11 (S~rl.l'IO u,
~h-1:s. - 4.11 - er!A-11;

Figura 15. Código clase Bean User.Java imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 37
17
Para crear el siguiente archivo clic derecho sobre Source Packages, seleccionamos new, Java
class con el nombre de Proceso.Java, y creamos el paquete com.ejer.controlador, y creamos
el siguiente código:
package co~.cJcr.conerolador;

1~~ort java .1o . IOExccpt1on;


jav x.s rvlct.ScrvlctExc ption;
javax.s rvlct.http.HttpS rvlct;
rt j v x.s rvl e .h tep.HtepS rvl tR qu st:
j av x.servlct.ht p.HttpServletResponsc;

i~ort co .ejer.n:.odelo.Oser;
i~ort javax,servlet,RequestDispatcher;

,..
~ 0

public class Procesos extends HtepServlet(


public void c1oPost(HttpServletRequest request , HttpServletResponse response) throvs Servlettxcept1on, IO-xcept1on(
String pr1N0Jmre • request . qetPar&!l.e&er( "P-1~ombLe ):
String priApell1do • reque~c .gecParameter( ~p-iApe~~1do );
String ~11 • reque5t ~qetParatteeer( R~t." ):

05er user• nev 05er():


uscr.scePr Noir.brc(pr No~.brc);
scr . scePr Apell1do(pr Apell1do);
uscr . sceti:.a1l(cma1l);

r qu st. s tAttribut c· ~ •, us r);

RcquestDispatchcr dispatcher - rcqucst .qetRequestD1spatchcr (" ·csultado.J p" );


di~patchcr.for~ard( rcquc3t , rc~pon~c);

Figura 16. Código controlador clase Procesos.Java imagen de código generado por el autor desde IDE
Netbeans
Fuente: Propia.

Editamos el archivo web.xml, si este no está en la estructura del proyecto, lo creamos con
clic derecho sobre el proyecto, new, other y buscamos en web el tipo de archivo Standard
Deployment Descriptor (web.xml). Choose File Type

Project:

Q.. Filer:

Web
KTM..S
Javi!Server Faces
Bean Valdation
Struts
Sp,-ngFrameworl<
Enterprise JavaBeans
Contexts and Dependency lnj,

~ipbon:
Figura 17. Creando el archivo web.xml imagen ICreates new web.xml deployment descriptor for web application.
generada por el autor desde IDE Netbeans
Fuente: Propia.

~-------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 38
18
Adicionamos el siguiente código:

ersion••1 .o• encod1no-"CTf-8"?>

xs1:3c h em.a.Locat1.cn• =='-'-----"=='--'---===-=---==-=---'-==ccc htc p :1/~n~. cp.cr / ~Ins/ avaee/web-ag~ 3 1 .xsd"


version• "'.! . .1. ,. >

rvlet>
<s rvlet- name>Proc sos</s rvlet - no:r. >
<scrvlct-class>com.cjcr.controlador.Procc#Os</scrvlct-class>
e:rvle:~>

rvlec-i.appino>
<5ervlec-~~@>Proceso5</serv1ec-na."t.e>
<url-pactern>/Procesos</url-paccern>
ervl c-m pp1no>

s:u.on-conf1.q>
<session- timeout>
30
</sess1on- ~1:~ou~>
•ss10n- cont10>
lcore - file - list>
<w lcorr. -f1l >e ncrado . jsp</v lco - f1l >

Figura 18. Código xml del archivo web.xml imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

Creamos un nuevo archivo Resultado.jsp para mostrar al usuario la información en la vista


resultado.
<%--
Document Resultado
Author gtabares
>

<%@page contentType= "text/html" pageEncoding= "UTF-8" %>


<%@page :ur.port= " com . e j er.modelo . User " %>
<!DOCT'iPE htn:.1>
<h t ml>
<he ad>
<me t a http-equiv="Content-Type" content;"text/html; charset;UTF-B" >
<titl e >Res ult ado< /title>
</he ad>
<body>
<hl>Informaci6n del Us u ario</hl>
<\
User user=(User ) request.getAttribuce( " ser~ ) ;
%>
<%=user.getPriNombre() %X br>
<%=user . getPriApellido ()\ X br>
<%=user . getEmail () \ X br>

</body>
</html>

Figura 19. Código Archivo Resultado.jsp imagen de código generado por el autor desde IDE Netbeans
Fuente: Propia.

~-------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 39
19
Ejecutamos la aplicación y muestra el formulario de ingreso de datos


Informacion del suar10
ombre: .,__ _____.....,
Gustavo
Apellido: Tabares
Email: [email protected]
[ enviar I
Figura 20. Formulario de datos imagen generada por el autor desde IDE Netbeans
Fuente: Propia.

Clic en botón enviar, el controlador procesa los datos y los muestra en la vista Resultado.jsp

Informacion del Usuario


Gustavo
Tabares
gus@gus_com

Figura 21: Datos de respuesta imagen generada por el autor desde IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina 40
20
1
UNIDAD

2 Unidad 2

Java Sever Faces Modelos de programación II


Tecnología
•••• Autor: Gustavo Enrique Tabares Parra

AR€ANDINA MIEMBRODELARED
Fundaci6n Universitaria del Area Andina I LU M N 0
Introducción El uso de plantillas para el desarrollo de aplicaciones web, nos
permiten cumplir con una estructura de desarrollo definida
de forma estándar y cumplir con la calidad que se requiere a
la hora de programar, JSF ofrece una variedad de sentencias
que aplicadas correctamente se puede lograr construir aplica-
ciones exitosas.

~---------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 42
3
U2 Metodología

El desarrollo de esta cartilla está desarrollada bajo en tema referentes a JSF, se recomienda
al estudiante seguir de forma adecuada el desarrollo del tema, apoyándose en el material
complementario. Lecturas de referencias, Videos capsulas. Es importante estar muy activo
en la video conferencia, es un espacio donde se pueden aclarar muchas dudas que se pre-
senten con el tema.

En esta semana se realizara la primera evaluación a través de un quiz, enfocado a los con-
ceptos del tema de la semana 3. Adicional hay una actividad de repaso que le permitirá al
estudiante poder aplicar los conocimientos adquiridos hasta el momento.

~---------· Fundación Universitaria del Área Andina 4


43
U2 Desarrollo temático

Java Sever Faces Tecnología


La tecnología JavaServer Faces, es un componente de trabajo integrado por interfaces de
usuario que están del lado del servidor permitiendo la generación de aplicaciones web con
tecnología Java.

Los principales componentes de la tecnología JSF


La implementación de una API y una referencia: para generar componentes UI y controlar su
estado; el control de eventos, validaciones del lado del servidor  y conversión de datos; per-
mitiendo la navegación entre páginas, soportando los estándares de internacionalización y
accesibilidad; proporcionando extensibilidad para todas estas características.

Esta implementación de tecnología facilita la construcción de aplicaciones web con UIs del
lado del servidor, con una programación bien definida y las librerías necesarias para su co-
rrecta implementación. Con un mínimo esfuerzo de programación, podemos lograr:
■ Conectar los eventos que se generan del lado del cliente al código de la aplicación del
lado del servidor.
■ Mapear los componentes UI a una página de datos del lado del servidor.
■ La construcción  de Interfaces de usuarios UI con componentes reutilizables y extensibles.
■ Una tecnología que se ejecuta del lado del servidor y no del lado del cliente.
■ La interfaz de usuario es tratada como un conjunto de componentes UI.
Características principales
■ Generar las vistas a través de JSF, incluyendo una biblioteca de etiquetas propias para los
elementos de los formularios.
■ Desde el código HTML, asocia a las vista con formularios, un conjunto de objetos Java ma-
nejados por el controlador (Beans) que permiten la captura, manipulación y visualización
de los datos mostrados en los diferentes elementos de los formularios.
■ Proporciona una serie de etapas en el procesamiento de la petición, como la validación,
reconstrucción de las vistas, recuperaciones de los datos de los elementos.

~---------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 44
5
■ Utiliza para el controlador un fichero de configuración con el formato XML.
■ Permite la creación de nuevos elementos de la interfaz o modificar los ya existentes.
■ Hace parte del estándar J2EE, lo que permite muchas posibilidades de la creación de la
capa de presentación logrando el control de una aplicación web Java, como Struts y otros
frameworks.

Aplicación Java Server Faces


Los pasos para realizar una aplicación Java Server Faces son los siguientes:
■ Extracción de los objetos del modelo lógico, que contendrán los datos necesarios de la
aplicación.
■ Añadir las declaraciones del Java-bean al controlador del fichero de configuración de la
aplicación.

La siguiente grafica muestra los archivos que hacen parte de una aplicación Java Server Fa-
ces.

- i Backing Bean

+ Backl
Web !
+C]) + ._._w.e,._b.,
Componentes
+
Valoresde Listeners Reglas de Descriptor de
Graficos Componentes Navegaci6n Despliegue
Graficos

Figura 1. Conjunto de aplicaciones que hacen parte de una aplicación JSF


Fuente: Propia.

Aplicación Java Server Faces


Las etiquetas usadas en JSF

JSF, contiene una colección de básica de etiquetas disponibles que permiten crear de forma
fácil, páginas con los componentes dinámicos de una página web. A continuación veremos
algunas:

- - - - - '- -------· Fundación Universitaria del Área Andina 6


45
■ h:inputText. Está incluye un campo de texto normal para la entrada de datos.
■ h:inputHidden. Está etiqueta incluye un campo de entrada oculto del formulario.
■ h:commandButton. Las acciones que se generan en los formularios son asociadas a los
botones.
■ h:inputSecret . Campo de tipo contraseña editable.
■ h:form. Etiqueta Formulario JSF.
■ h:outputLabel. Etiqueta para mostrar etiquetas de tipo texto.
■ h:outputText. Etiqueta para salida de tipo texto.
■ h:selectOneRadio. Permite crear botones de selección única.
■ h:inputTextarea. Permite crear un campo de texto multilínea.
■ h:outputLabel. Muestra un texto de salida fijo.
Iniciaremos el proceso para crear una aplicación web con tecnología JavaServer Faces, es un
proceso fácil y amigable, para desarrollar una aplicación se requiere de las siguientes tareas:
■ Desarrollar beans mejorados.
■ Agregar declaraciones de manejo de bean.
■ Crear páginas web utilizando etiquetas.
■ Mapear la instancia FacesServlet.
Durante esta semana describiremos estas tareas, creando una aplicación de ejemplo en Ja-
vaServer Faces.

Inicialmente crearemos una aplicación Hello que contendrá un backing bean y una página
web, que le permitirá al cliente cuando ingrese y ejecute la aplicación, imprimir un mensaje
de HelloWord.

Creando el bean de respaldo (backing bean)


En la tecnología JSF el componente backing bean, es un complemento de JavaBean, Los
componentes se asocian a una página con un backing bean, donde se provee la lógica de
la aplicación. El siguiente código del ejemplo Hello.Java muestra un ejemplo aplicable de
backing bean.
package hello;
import Javax.faces.bean.ManagedBean;
@ManagedBean
public class Hello {
final String world = “Hello World!”;
public String getworld() {
return world;
}
}

~---------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 46
7
Analicemos un poco, el backing bean asigna un valor a la variable mundo con la cadena
“Hola Mundo” la anotación @ManagedBean se encarga de registrar el backing bean como
un recurso de la implementación JSF.

Creando la página Web


En una aplicación JSF, las páginas son creadas en XHTML, En el siguiente ejemplo de página
web XHTML, tiene el siguiente código.

package hello;
import Javax.faces.bean.ManagedBean;
@ManagedBean
<html xmlns=”http://www.w3.org/1999/xhtml”
xmlns:h=”http://Java.sun.com/jsf/html”>
<h:head>
<title>Facelets Hello World</title>
</h:head>
<h:body>
#{hello.world}
</h:body>
</html>

El lenguaje de expresiones EL (Expresision Language), conecta la página web con el backing


bean, la expresión con el valor #{hello.world}, es el encargado de recuperar el valor de pro-
piedad world del backing bean Hello. Se usa la referencia hello al backing bean Hello. Si no
se especifica nombre en la anotación @ManagedBean, Se puede llamar al backing bean con
el mismo nombre y la primera letra de la clase en minúsculas.

Mapping De Faces Servlet Instancia


El mapeo de Faces Servlet, se realiza modificando en deployment descriptor web.xml, un
mapeo típico del servlet Faces Servlet es como sigue:

<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>Javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>

El segmento de archivo precedente, representa parte de un archivo de descripción de des-


pliegue. El archivo de despliegue puede contener más información de configuración de la
aplicación con JavaServer Faces.

~---------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 47
8
El mapeo de FacesServlet se realiza de forma automática cuando se usa el IDE de desarrollo
Netbeans.
El ciclo de vida de la aplicación Hello

Las aplicaciones web tienen un ciclo de vida. Las acciones más comunes como el manejo
de solicitudes entrantes, la decodificación de los parámetros, la modificación y el almacena-
miento de estado de páginas web como salida hacia el navegador, todas se ejecutan durante
el ciclo de vida que tiene la aplicación web. Algunas ventanas de trabajo web ocultan los
detalles del ciclo de vida mientras que otros requieren ser manejados manualmente.

Por defecto, JavaServer Faces, las acciones que se presentan en los ciclos de vida son mane-
jadas de forma automática en una página web. Es posible acceder a los diferentes escenarios
del ciclo de vida y poder modificar e incluso ejecutar diversas acciones si se requiere.

No se requiere conocer todo el ciclo de vida de la aplicación para quien está comenzando a
desarrollar aplicaciones JavaServer Faces.

A continuación se describe como comienza y termina el ciclo de vida de una aplicación Java-
Server Faces. Inicialmente el cliente hace una petición a la aplicación a través de una página
web, y la respuesta del servidor se da a través de una página web. Como se ve el ciclo consta
de ejecutar y renderizar dos fases principales.

Durante la fase de ejecución se realizan varias acciones:


1. La capa de la vista de la aplicación es construida o restaurada.
2. Los valores almacenados en los parámetros de petición son aplicados.
3. Las validaciones y las conversiones son ejecutadas desde los valores de los componentes.
4. Los beans lógicos de respaldo son actualizados con los valores de los componentes.
5. Se invoca la lógica de la aplicación.

La creación de páginas
Para este tema vamos a realizar un ejemplo práctico para el desarrollo de una aplicación
haciendo uso de JavaServer Faces. Pueden seguirlo en su IDE de desarrollo para que practi-
quen la realización del ejercicio.

El ejemplo a desarrollar consta de dos páginas, en la primera página se ingresa el nombre de


usuario y la contraseña y la segunda página mostrará un mensaje de saludo de bienvenida
al usuario. Utilizaremos en IDE de desarrollo NetBeans.
Pasos:
1. Iniciamos creando un nuevo proyecto: Nuevo proyecto / Java Web / Web Application, se-
leccionamos el servidor, utilizaremos: Glass Fish; utilizaremos la sexta versión de Java EE
(Java EE 6 Web), y por ultimo seleccionamos Java Server Faces y luego clic en Terminar.

~---------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 48
9
2. En el archivo web.xml, en este se modifica para que las páginas sean procesadas por el
servlet de JSF, de la siguiente forma:
< ?xml vers i on-~1.0" encodinq-"OTF- 8"?>
<web-a.pp

<contcxt-parom>
<param- na.n:e>Java..x.faces .PROJtct_STAG!</ param- nan:..e>
<para.n.-value>Oe:velopmenc</ param-value>
</ coneext-para.."11>
<se::vlee>
<3c,:vlct-n=c>tJcmplo JavaScvcrracc3</ 3c,:vlce-n=c>
<servle&- class>Javax .faces . webapp .FacesServlec</ servlec- class>
<load-on-sea.Icup>l </ load-on-startup>
</ servle~>
<se::vlee-ir.appinQ>
<3crvlc~-n«m.C>facc3 Scrvlc t </ 3crvlct-nA1:tc>
<url - paeeern>/taces/ ~</ url - paccern>
</ servlee-mapping>
<sess10n-conr1q>
<session-ein:eo ue>
30
</ sess1on- tl.lt.eout>
</ sess1cn-cont10>
<welc01C~-!1le-l1St>
<velco , -file> fac s/1nde x.xhe"'1 </velc -file>
</ wclco~c-f1lc-l1st>
</ web- app>

Figura 2 Archivo web.xml, código creado por el autor desde el IDE Netbeans
Fuente: Propia.

3. El siguiente paso es crear el beans el cual estará asociado al modelo lógico de usuario
y se encargara de guardar la información. Los atributo nombre y contraseña serán las
propiedades que también generan los métodos get y set del beans.
package com;

//Bean parte L6gica de la app JSF

public class Usuario {


private String non:bre ;
private String contrasena ;

Metodo lor.-.ore
public String g etNombre ()
return nombre ;

public void se t Nombre (String nombre)


this . nombre = nombre;

Meccdo co~tr sena


public String getContrasena ()
return contrasena ;

public void se tCo ntrasen a (String contrase na)


this . contrasena = contrasena;

Figura 3. Archivo Beans, métodos get y set. Código genera por el autor desde IDE Netbeans
Fuente: Propia.

-----'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 49
10
4. Posteriormente creamos la página index.xhtml, que será la página principal de la aplica-
ción y la que se cargara según el mapeo definido en el archivo web.xml

<welcome-file-list>

       <welcome-file>faces/index.xhtml</welcome-file>

    </welcome-file-list>

Y el resultado es el que tenemos a continuación.

Intl'oduzr u oomb1·e y root1· eii

Nombre:
Contrac;etia:

Aceptar

Figura 4. Ingresando datos. Imagen generado por el autor


Fuente: Propia.

El código del index.xhtml es el siguiente:


<? v r31on- 1 l.O' cncod1nq-•O'ff-8' ?>
~YFE i P....,-SL!~ ~- - ~C DTD X ~ __ n T~a 1t100al//£N• • r.91 1or.al. d d·>

<heal xmlns• ""-" ..:.


' .::.
"P= ' :. .:. .:=:.:..:======== I ">
. n~: h- '"".:,;,,;;.;;.L.:.:.,;.::::::,;a.;:;:..L,:;.t..:~.lf.:..J.a:.:.:..=c:!.
<h:heac1>
<t1t:lc> lntroduc1r dat03 dcl 0.1uaz10</t1tlc>
</h:head>
<11:body>
<c nt r>
<h : .tora>
<atylc type ""text csa">
body Cbaclcoro nd : ye lovoreen}
</~tyle>
<h3>Introdu~c• ~u no r y contro~ Oa</h3>
<table>
<tr><td>Nombre: </td>
<td><h :inpotText v~l~ - · t cu~u~r~o . no: re) • / x /td>
</tr>
<tr><t.d>Cont.ra.tcr.l.a : </td><t.d>
<h:lrtpatSecret value•• { 9uar~o .concra9ena) / ></td> 1111

</tr>
<It bl>
<p>
<h:coaaandButton valuc-•Accptar• action•""saludo.xht -" / >
</p>
</h : 1'.or.>
</center>

</h:body>
</ht >

Figura 5. Archivo index.xhtml. Código generado por el autor desde el IDE de Netbeans
Fuente: Propia.

------'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 50
11
5. Luego creamos el archivo de la página de saludo saludo.xhtml, el cual tendrá el siguiente
código.

Biennnido

. lodelos de pl'Ogramal'ion

Gustno

Figura 6. Salida archivo saludo.xhtml.


Fuente: Propia.

<? ncodl.nq- "OTF-8 ' ?>


•- DTD lC'TIC. •. o -rar.sl.t:1onal// LI" " _h _i:-'-
c"--'-:_/ _/ _v_..c.
vv · _w_3..c.·..c
o..c_..c.....c...c.-'-'----'-'--'-'-'--'--'--'-~'--~~--'--'----''-'-'-"-'"-'-

.xr:.ln:s :h · ==.:..:..===~ ~==.:..-=..:...::=..c." >


<b :bead>
<t1tl >Arch1vo d 8 ludo ol U8U r1o< /t1tl >
</h :head>
<b :bocy>
al) CCC col -->
<atyle t~,:,c ~et: c >
y (boc kqround :yellowqr n)
</ s ty e >
<ce nt e r>
<h3>B enven do</h3>
<h3>
~ lo8 d proqT c16n
</h3>
<h : f o na>
<b><h : ootpotText ,ale ti s ar o.nombre) / >< /b>
</h : fona>
< r/xbr/>
<a. hre:t• .. x,xht:::..." >Iru.c1o< /a>
<le n r>
</h : body>
</htn:.l.>

Figura 7. Código de salida archivo saludo.xhtml. Código generado por el autor desde el IDE de Netbeans.
Fuente: Propia.

6. Continuamos creando el archivo faces-config.xml, este archivo es el encargado de la


configuración de la aplicación JavaServes Faces es donde se realiza el Mapping de Fa-
cesServlet. Es necesario registrar en beans dentro del archivo para que sea usado poste-
riormente. Se diseña e implementa la navegación de la aplicación en este archivo, el cual
tendrá el siguiente código.

-----'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 51
12
< ? lOal ve_s ol\•' -o·· ,-e • ?>
<:Cc -con:C1q v r
xm.l.ns • · .....::...:..::...:..:....:..===-=-:....:.=..:...::=::....:===c:....=.:..::.=

xai:scl'I ttp://xr.i ns.Jcp. rq/ 2 2.x d" >

x . xhe. </ fro~-vi v-i >


<naviqae1on• caae>
<!re - o econ:.e>ex c o< / !r -o cccice>
<to - v- d>/ lu o .xh <I to-vi v-1d>
</ nav1qae10n-case>
</ nav o c cn-ru e>

<~aged-bean>
<u:.anaqed-been-n.-uc.e> suar~o< / c.Anaged-bean-ner.e>>
<manaqed- bean• claas>com.Usuazio</ naqed- bean- class>
<n:.a.~aoed-bea~-scope>sess on</ icanaoed-bean-scope>
</ re: no d-b n>
</ :Cace11• con:C1q>

Figura 8. Mapping de FacesServlet faces-config.xml. Código generado por el autor desde el IDE de Netbeans
Fuente: Propia.

Segundo ejemplo de creación de páginas

Uso de elementos Select y Option en JavaServer Faces (JSF).

En este ejemplo, vamos a crear una aplicación donde implementaremos Select y Option
con JavaServer Faces (JSF), con una entrada de texto mediante el uso de inputText, adicio-
nalmente tendrá una lista desplegable que le permitirá elegir una o varias opciones, el es-
tudiante puede seguir el ejemplo e implementarlo en el IDE de práctica Netbeans o Eclipse.

El ejercicio consta de dos páginas que se describen a continuación.

Index.xhtml: en esta página se le pedirá al usuario unos datos de entrada, donde digitará el
nombre, apellido y la edad y el país lo seleccionará de una lista que se le suministrará.

Saludo.xhtml: esta página de la bienvenida, mostrando los datos que seleccionamos inicial-
mente.

------'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 52
13
Index.xhtml es código es el siguiente:

<?xml version=’1.0’ encoding=’UTF-8’ ?>


<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”
xmlns:h=”http://xmlns.jcp.org/jsf/html”>
<h:head>
<title>Facelet Title</title>
</h:head>
<h:body>
<center>
<h:form>
<style type=”text/css”>
body {background:orange}
</style>
<h3>Introducir sus Datos</h3>
<table>
<tr>
<td>Nombre:</td>
<td><h:inputText value=”#{Usuario.nombre}”/></td>
</tr>
<tr>
<td>Apellido:</td>
<td><h:inputText value=”#{Usuario.apellido}”/></td>
</tr>
<tr>
<td>Edad:</td>
<td><h:inputText value=”#{Usuario.edad}”/></td>
</tr>
</table>
<p>
<td>Elija su País</td>
<SELECT name=”Elegir Componente”>
<OPTION>Argentina</OPTION>
<OPTION>Brasil</OPTION>
<OPTION>Chile</OPTION>
<OPTION selected =”componente5”>Colombia</OPTION>
<OPTION>Ecuador</OPTION>
<OPTION>Mexico</OPTION>
<OPTION>Paraguay</OPTION>
<OPTION>Peru</OPTION>
<OPTION>Venezuela</OPTION>
</SELECT>
</p>
<p>
<h:commandButton value=”Aceptar” action=”saludo.xhtml”/>
<h:commandButton value=”Reiniciar” type=”reset”/>
</p>
</h:form>
</center>
</h:body>
</html>

~---------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 53
14
Vista del formulario que solicita los datos de entrada

Intl'oducil· us Dato

Nombre:
Apdhdo:
Edad:
________..,..
Aceptar
Figura 9. Formulario ingreso de datos
Fuente: Propia.

El archivo saludo.xhtml se encarga de mostrarla salida con los datos capturados el código
es el siguiente.

<?xm.l. versi.on• ' 1.0' e:ncod.1n;- 1 0TF-8 1 ?>


., • v Trana1t.1onal/ /t.l'" ,.:.".:cc.:c
c= : ':..:':..:"=:..:
"" ·.=vc:..:.·::.
~=:..:..:==========:::..:==c...::==
<h t.ml xmln~-"- ~['-'- ' - --'----'--'-- -'-- -"---'-~
xm.lna: h• "_,._c_cp~: ----~------
<h: head>
<title:> tace:le:t T1.tle: </ t1.tle:>
</h : he~d>
<h : body>

<.sty l.e: t\-pe•"te:xt css >


body { boc k'Q-round :orono
</styl.e:>
<c nt. rXh3>8i nv n1.do</h3>
<h:rono
<h : ootpatTcxt v lu - t{ua:uor1.o.noss.br ) t(ua:uor10.apell1do) • / >
<h : outpotText value:•" f {usua!:'l.o . .se:xo} " / >
</h : fona>
<b~/>
<• href• " ... nClcx.xtJ.t. '" >In.1c1.o</a>
</ce nte r>
</b :boey>
</ht.ml.>

Figura 10. Código salida archivo saludo.xhtml. Código generado por el autor desde el IDE de Netbeans
Fuente: Propia.

La salida del archivo saludo.xhtml es la


siguiente: Bienvenido

Gusta\·o Tabares 20

Figura 11. Interfaz de salida archivo saludo.xhtml


Fuente: Propia.

-----'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 54
15
El archivo web.xml, se debe modificar para definir la estructura de páginas a ejecutar

<?im.l version•"l.0" e.ncodinq-"OTF-SN?>


<we..b-app version• 3. ~n5 . cp . ora/X!tl/n5/ avaee"

X5i:5che..~Locat1on• •http :''JCllll.ns.~ cp .e~a'xr.tl'nsl~a aee ht~ p ://xrn r.s . c . or / x:Jtl/ns/ avaee/veb-app 3 l . X5d· >
<contexc-param.>
<param-n4J!le>java x. faces . PROJECT_STAGE</par m-nan:e>
<param-v lue> v lop,r. nt <I P<Or -volue>
</contcxt-param>
<servlet>
<servlet - n&J:e> ~aces Servlet </servlet- nan:.e>
<servlet-class>Javax . taces.~ebapp.racesServlet</servlet-class>
<load-on-scarcup>l </load-on-scart p>
</servlet>
<• rvl t -:n4ppin9>
<~ rvl t-n >Foes S rvl t </s rvl t -no >
<url-pattcrn> / facc~/ · </url-pattcrn>
</servlet - u:.appin9>
<ses81on- cont10>
<sess1on-c1.1r.;eout>
30
</sess1on-t1meo t>
</sess1on-conf1Q>
<w le -fil -lit>
<wclcc c-filc>facc3/ 1..ndcx.xht.ml</wclco c-f1lc>
</welcon:.e - tile- list>
</web- app>

Figura 12. Estructura de navegación web.xml. Código generado por el autor desde el IDE de Netbeans.
Fuente: Propia.

package com;

3ea~ pa~te ·cgica de la app ~SF


public class Usuar i o {
private String nombre ;
private String apellido ;
private int edad ;

public String getNombr e ()


return nombre ;

public void setNombre (S t ring nombr e )


this . nmtbre • no11lbre ;

public String getApelli do ()


El siguiente paso es crear el bean es cual es- return apellido ;
tará asociado con al usuario y nos permitirá
almacenar la información, en este archivo public void set.Apel l i do (String ape llido)
this . apellido = a p e llido ;
se crearan los métodos set y get correspon-
dientes a los atributos del usuario. El archivo public int ge t Edad ()

tendrá la siguiente estructura. return edad ;

public void setEda d ( int edad)


this . edad = edad ;
Figura 13 Beans clase usuario. Código generado por
el autor desde el IDE de Netbeans.
Fuente: Propia.

_ ________. _ _ _ _ _ _ _ _ Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina •
55
16
Ahora en el archivo faces-config.xml, vamos implementar las reglas de navegación, debe-
mos de registrar el bean para que sea usado en el archivo faces-config.xml, el código del
archivo es el siguiente.

<?xml v rsion-"1 . 0 ' nc:od1no-'11TF-S'?>


<tacea- cont1q ver310n• 2 2"
x.mln.!: • "'
-----------------
<naviqa~ 0n-r11 e>
<tro - v1ew- 1d>/1ndex . llhtml </ troa-v1ew- 1d>
<nav19ae1on-ea!:@>
<fro -outc: > xito</ tr -outc:o >
<co-v1ew-1d>/saludo.llhclll</ co-v1ew-1d>
</ nav 9ac on-ea!:@>
</ nav1oat1on - rule>

<tr4::o.qed - been>
<inanaoed- bean- n~>usuar1o< / 11t11.naoed- bean- nllllle> >
ona..~a9ed-bean-c:lass>c:=.us ar10</ aeana9ed-bean-c:lass>
<=n•o d-b on-sc:op > ion</ no d-b n- cope>
</man aqe:d-be:an>
</ fac:es-c:cnho>

Figura 14. Mapping de FacesServlet faces-config.xml. Código generado por el autor desde el IDE de Netbeans.
Fuente: Propia.

-----'- -------· Fundación Universitaria del Área Andina


Fundación Universitaria del Área Andina 56
17
1
UNIDAD

2Unidad 2

Servicio web Modelos de programación II

•••• Autor: Gustavo Enrique Tabares Parra

AR€ANDINA MIEMBRODELARED
Fundaci6n Universitaria del Area Andina I LU M N 0
Introducción Hoy el día encontramos mucha tendencia en el diseño del
software hacia una programación más modular, donde la
aplicaciones esta compuestas de una serie de componen-
tes reutilizables que podemos entenderlos como
servicios, estos pueden estar distribuidos a los largo de una
red de computadoras generando información y recursos que
a la vez pueden ser consumidos por alguna aplicaciones
que los requieran.

Los servicios web nos permitirán distribuir nuestra aplicación


a través de la Internet, donde una aplicación puede hacer uso
de los servicios ofrecidos por cualquier servidor de internet
que comparta un servicio.

~---------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 58
3
U2 Metodología

El estudiante encuentra en el inicio toda la información sobre el módulo, que le permite


abordarlo y comprender su dinámica de funcionamiento.

Para cada unidad el estudiante cuenta con un texto que se conoce como guía de actividades,
el cual semana a semana le informa qué actividades tiene para la semana y qué debe hacer.
Así mismo le informa las actividades calificables en su módulo. En dicho texto se incluyen los
objetivos de aprendizaje de la unidad.

La cartilla le permitirá abordar el tema de los web services bajo la programación Java. Se re-
comienda leer cuidadosamente y en forma secuencial la semana para tener una compresión
adecuada del tema.

~---------· Fundación Universitaria del Área Andina


Fundación Universitaria del Área Andina 59
4
U2 Desarrollo temático

Servicio web
Un servicio web es un componente al que podemos acceder a través de protocolos web
estándar, haciendo uso del XML, SOAP, WSDL y UDDI sobre protocolos de la Internet como
(HTTP, SMTP, TCP, FTP) como intermediario para el intercambio de información.

XML: permite describir los datos que ofrece el servicio.

SOAP: es el encargado de la transferencia de los datos.

WSDL: es el encargado de describir los servicios disponibles en el web service.

UDDI: es el encargado de conocer cuáles son los servicios disponibles para ser consumidos.

Un servicio web es una colección de procedimientos que son compartidos a través de pá-
ginas de internet, son llamados desde cualquier lugar de internet, esta invocación es to-
talmente independiente de la plataforma y del lenguaje de programa en el que se haya
programado el servicio.

Cuando nos conectamos a la Internet y hacemos una petición al servidor web desde el na-
vegador, el servidor devuelve la página solicitada, con la información para ser visualizada
por el usuario, y difícil de entender por una máquina, los servicios web se ofrecen con un
formato estándar para que sea entendido fácilmente por otra aplicación.

Los servicios web son componentes de aplicaciones totalmente distribuidas que están dispo-
nibles a las aplicaciones de forma externa. Pueden ser utilizados para integrar aplicaciones
en diferentes lenguajes y plataformas, debido a los estándares web de algunos servicios web.
Características de los servicios Web
■ Cualquier servicio web debe ser posible su acceso a través de la web. Para esto debe estar
basado en protocolos de transporte estándar como el HTTP, y los mensajes se deben co-
dificar en un lenguaje que pueda ser interpretado fácilmente por el cliente.
■ El servicio debe tener una descripción de sí mismo, esto para que las aplicaciones que lo
invoquen sepan la función determinada de un servicio web.

~---------· Fundación Universitaria del Área Andina 5


60
■ Debe ser de fácil localización, se debe desarrollar un mecanismo de fácil localización del
servicio web que realiza una determinada función. De esta forma podemos localizar a
través de una aplicación el servicio de forma automática, sin saber con antelación como
es el servicio.

Un servicio web es un componente de software que se ofrece a través de una página por me-
dio de un endpoint y es accesible a través de la red. Los servicios web tiene la funcionalidad
de ser producidos y consumidos intercambiando información a través de mansajes invoca-
dos por peticiones y respuestas en forma de documentos auto-contenidos.

A nivel técnico los servicios web pueden implementarse de varias formas para ser consumi-
dos por los usuarios, tenemos dos tipos de servicios web: los servicios Web “grandes” (big
Web Services), que también se llaman SOAP, y los servicios Web RESTful.

Servicios web Soap


Los servicios web SOAP, utilizan mensajes bajo el estándar XML y comunicarse entre pági-
nas con el servicio SOAP (Simple Object Access Protocol), a través de un XML que define la
estructura y formato de los mensajes que se comunican, las operaciones que se brindan por
el servicio, estas están escritas en WSDL (Web services Description Language), este lenguaje
está basado en el lenguaje XML que permite definir las interfaces sintácticamente.

Hoy en día los IDE de desarrollo como Netbeans y Eclipse, etc. Permiten reducir la comple-
jidad para el desarrollo de aplicaciones que implementen servicios web para los usuarios,
estos están bajo un formato SOAP (formato de mensajes) y WSDL (lenguaje de definición de
interfaces) Se que se ha extendido y utilizado por muchos IDE de desarrollo.

El diseño para la implementación de un servicio basado en SOAP este permite implementar


una especie de contrato formal en el cual se describe la interfaz que ofrece el servicio Web
de la aplicación. WSDL permite utilizarse para dar una descripción los detalles del contrato,
donde se puede incluir mensajes, las operaciones a realizar, los bindings, y la localización
del servicio Web para su consumo. Los requerimientos no funcionales deben de tenerse en
cuenta, como son las transacciones de la aplicación, la necesidad de mantener el estado
(addressing), la seguridad y coordinación de la ejecución del servicio.
Servicios web (RESTful)

Otro tipo de servicio web es el RESTful (Representational State Transfer Web Services), son
ideales para espacios web de integración básicos ad-hoc. Este servicio se integra mejor con
HTTP que los servicios basados en SOAP, debido a que no es necesario mensajes XML o las
definiciones del servicio en forma de fichero WSDL.

El servicio web RESTful está basado en estándares muy utilizados como son HTTP, MIME,
SML, URI, posee una infraestructura muy práctica (ligera), lo que permite que los servicios se
vallan construyendo con herramientas de forma mínima. Debido a esto es tipo de servicios
es muy económico y no tiene muchos obstáculos para su implementación.

~---------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 61
6
Arquitectura de los servicios web
Los servicios Web entre aplicaciones están basados en una arquitectura orientada a servicios
que permite crear una definición abstracta de un servicio, para poder proporcionar la infor-
mación e implementar de forma concreta dicho servicio, que permita publicar y localizar un
servicio a través aplicaciones, seleccionar una instancia de un servicio, y utilizar el servicio
con una seguridad y calidad. Es posible desacoplar la implementación del servicio Web y su
uso por parte de un cliente. Las implementaciones concretas del servicio pueden desaco-
plarse a nivel de lógica y transporte. La siguiente figura muestra en detalle la arquitectura
orientada a servicios web.

(2) Find
WSDL+UDDI

Figura 1. Arquitectura de los Servicios Web


Fuente: http://www.jtech.ua.es/j2ee/publico/servc-web-2012-13/sesion01-apuntes.html

La página que ofrece el servicio define una descripción abstracta del servicio utilizando el
lenguaje WSDL (Web Services Description Language) Lenguaje de descripción de servicios
web. Lo que permite la creación de un servicio concreto a partir de la dicha descripción. Esta
información descriptiva del servicio puede ser publicada en un servicio de registro como
UDDI (Universal Description, Descovery and Integration). Un consumidor de un servicio
puede utilizar el servicio de registro para localizar una descripción de un servicio, lo que le
permitirá seleccionar y hacer uso de los métodos, eventos y funciones implementadas del
servicio.

El documento WSDL describe de forma abstracta el servicio como un PortType, es este una
instancia concreta de un servicio se define mediante un elemento port de un WSDL, el cual
consiste en una serie de combinaciones de un PortType, un binding de codificación y trans-
porte, más la dirección.

_ __________. _ _ _ _ _ _ _ _ Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina •
62
7
Servicios Web Soap y Java

Características de los componentes de un servicio web.


■ Los métodos se implementan bajo una interfaz que se describe con un lenguaje de defini-
ción de interfaces (WSDL). Estos se implementan con EJB o un componente web JAX-WS.
■ Un servicio web puede estar publicado en varios registros para su posterior despliegue.
■ Cualquier servidor que este con Java EE, permite el despliegue de un servicio web que
tenga una funcionalidad descrita WSDL.
■ Los servicios se consumen en tiempo de ejecución (run-time).
Java cuenta con un API, la API Java para XML basada para los Web Services (JAX-WS), es una
parte importante de la plataforma JavaEE, tiene como función la simplificación de las tareas
de desarrollo de los web services utilizando tecnología Java. La versión cuenta con soporte
para protocolos SOAP 1.1, SOAP 1.2, XML, permitiendo utilizar también otros protocolos adi-
cionales juntos con HTTP.

JAX-WS utiliza JAXB 2.0 para enlazar datos y soportar la personalización de los servicios que
se vayan creando.

Mediante un ejemplo crearemos un web service y este será consumido por tres aplicaciones
clientes de la siguiente forma:
■ Una clase Java dentro de una aplicación Java SE.
■ Un Servlet dentro de una aplicación Web.
■ Una página JSP dentro de una aplicación Web.
Crear un Web Service

Para crear un Web service lo primero es elegir el contenedor a utilizar “Deployment Contai-
ner” para desplegar un web servicies se puede hacer en un contenedor Web o en un con-
New Project
tenedor EJB (Enterprise
JavaBeans).
1. Choose Project
2. .••
Pro~ts: Seleccionamos File – New
Java
JavaFX
COfmti,. ,
Wd>-bon wdhEx,stng Sou-ces
Project, seleccionamos
.lavaWUJ Web Frtt-Forrn ADPkation
en categorías “Java web”
y en Projects selecciona-
JavafE
HTM.5

mos Web Apllication.


Jav•MEEn'bedded

-
Javac..n:t
Maven

<in>cwy
C/C++

Cn:atcs a.n c.mpty Wc.b application in a standsd IDE project. Astand.d project.uses_,
lOE·oenerated build sonpt t o ~, n.ri, and debug yo,.s p,o,ect.

Figura 2. Creación aplicación


Web imagen generada por el
autor desde el IDE Netbeans
<Bad<. L~ _,, Cancel
Fuente: Propia.

~---------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 63
8
Clic en siguiente, y asignamos el nombre al proyecto “AplicacionCalculadoraWS”

e New Web Application

teps Name and Location

L Choose Project Project~: ~akuladoraVIS


2. Name and Location
J. s= end ~1:mgs Pro,ect LocatJon: C:Vsers~tabares~ents'{llelSeansf'ro)ects Browse ...
4. Fr-orks
Project Folder: ~tabares'Oocunents\'letflcansProjects~a

0 Use Dcdcab!d Folder for Storing lharics


..t:, es Folder: Browse •
~-------------------~
Different users and proj«ts can .tlare the same ~oon
banes (sec Help for dci.1,,.

< Bad< Next >

Figura 3. Definiendo nombre aplicación Web imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Seleccionamos el servidor GlassFish, y Java EE Version seleccionamos la Java EE7.

-G)

Steps
I,
2,
3.
4.
Oioose Project
Name and ~lion
Serve r and Settings
Ff"""'worlcs
Server and Sdtings
New Web Apphcat,on

Add to Ent<l'l)flse Al>Pll<alion: <None>

Server : GaissFish-4. 1
-
Add .. .
I
Java EE Vers,on: ~va EE 7 l'ld>] ..,
Contttt Path: /AplicacionCala.ladoraWS
I

< Bade L,,..•• > Fnsh Cancel

Figura 4. Selección servidor GlassFish imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

------'- -------· Fundación


Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 64
9
Clic en finish, con esto ya tenemos el contenedor para el web service.

El paso siguiente es crear el web service, para esto damos clic con el botón derecho del mou-
se sobre el proyecto y seleccionamos new – Web Service…

0
Steps

1.
2.
Choose File Type
Name and Location
Name and Location
New Web Service

Web Service Name: CalculadoraWS


- I
Proj ect: AplicacionCalculador aWS l

Location: Source Packa9es 'I

Pad<age : lcom .calculadora 'I I

@ Create Web Service from Scratch


0 Create Web Service from Existing Session Bean

Enterprise Bean: j Bro se ..

- /
< Bade Next > ~i~ Cancel Help
-

Figura 5. Crear Web Services imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Asignamos el nombre Web Service Name “CalculadoraWS” y creamos el paquete com.calcu-


ladora y clic en finish.

Si observamos la estructura de archivos del proyecto vemos que nos ha creado una carpeta
Web Services.

8··
;... index .html
ges

ices
Calcu adora S
Figura 6. Estructura de archivos
hello: String AplicacionCalculadoraES imagen generada por el
+· Con gur ation Fi es autor desde el IDE Netbeans
Fuente: Propia.

------'- -------· Fundación Universitaria del Área Andina 10


65
Y nos ha generado el código del web services, como vemos en la gráfica.

package ca . calcu ladara;

Iy import · avax.. jws . WebServi ce;


L import · a ax . jws . WebMeth od;
import javax. . jws . WebParam;

.
1 ~ @author G e.tabares

@WebServ ice(serv ice ame = Cale ladoraWS )


public class CalculadoraWS {

l his is a sample web service operation

WebMeth od( operatio ame = ello )


public S rin h ello ( WebParam( n ame n e" Sri g xt ) {

l }
return ello + txt +

Figura 7. Código del Web Services código creado por el autor desde el IDE Netbeans
Fuente: Propia.

Vamos a añadir una operación al web service, cambiamos a modo Desing ubicado en la par-
te superior del código. Con esto no muestra el modo de diseño del web service.

~-c,,i,_.ws
....,,., - - - -

Param1Mn

·-
Paramttt, Name Paramettt rw,1
j.,,... .Siring

r Ootlmln Trarwfff 01 Binuy Dato IIITOIII


r Rit61blt ......* DtlMry
r SecLnS.nice

Edit Web SeNce Annbutes

Figura 8. Diseño del Web Services imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

- - - - - - -- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 66
11
Para crear una nueva operación damos clic en el botón Add Operation… lo que nos arroja la
siguiente ventana, donde damos en nombre “add” y en Return Type: escribimos int que es el
valor que va a arrojar el web service.

En la pestaña parameters se adicionan los valores, en este caso vamos a realizar una opera-
ción de suma.

0 Add Operation ... IEI


I Name: add

Reb...-nType : int Browse ...

---,
Parameters Exceptions
l

Name Type Final [ Add


Remove
I Int I D
Up

Down

OK Cancel

Figura 9. Definición del método y atributos del Web Services imagen generada por el autor desde el IDE
Netbeans
Fuente: Propia.

Con esto ya tenemos una operación en nuestro web service, como se ve en la gráfica.

- Pa11m 1e, N:wne


I
Faults
Pa, :uMI l'fl)t
lfll
0.1alplion

J lfll

@WebMetbod(operat i.onName = "add" )


pu.b1ic int add (@WebParam(name = "i" int i, @WebParam(name = .. int j)
_o rite yo r i p~e entation code here:
ret u r n O;

Figura 10. Atributos enteros del método del Web Services código creado por el autor desde el IDE Netbeans
Fuente: Propia.

------'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 67
12
También ha creado el código de la operación en el source, donde debemos modificarlo para
adicionar el método para sumar las variables.

>Me od (opera i ooName = add" )


.ic int add ( @WebParam (. ame i L int i, @WebParam (. ame " L int j
int k = i + j ;
ret rn k ;

Figura 11. Creación de la programación del método add código creado por el autor desde el IDE Netbeans
Fuente: Propia.

Con esto hemos creado un Web Services que recibe dos números y devuelve el resultado.

Para realizar un test web service, y probar si funciona nuestro ws, damos clic derecho sobre
el proyecto y seleccionamos la opción Deploy. Después damos clic con el botón derecho del
mouse sobre el web service y seleccionamos test web sevice.

ws

Open
Ref res

Add Opera ion...

Test ebSeMce
Figura 12. Test del Web Service imagen generada
por el autor desde el IDE Netbeans
Fuente: Propia.

Para tener como salida la vista del web service que se ha creado.

Calculadora WS Web Service Tester

Tws form will allow you to tes t your web sen·ice implementation QVSDL File)

To inrnke an operation. fill the method parameter(s) input boxes and click on the button labeled with the method na

::Vletbods:

public ab tract int com calculadora Calculadora '\\ S add(int.int)


I~ ~ ·· .... ~

Figura 13. Resultado del Web Service imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

- - - - - - -- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 68
13
Damos clic en el botón add y tendremos la descripción del web service, con la respuesta del
SOAP Request y SOAP Response.

aclcl . iethod invoc. tion

• lethod p:n mfl s

. lethod 1·ehl1'Dtd

mt : "II "

OAPRtquts t

c- > 1 trnon.s· 1.•- t n< 1 .. ,-- IJT• -, -~>-<S ien tlopt -1.nsis-· i,-:tp ://sef'!ff!ls . ho,,p.ort)10-1p1• r t o"r lfa.l ns ~~ - v . - ~ tP / JC tftls. :11. lso.JC1.0J"l/so,,p f•,. t10Pf r,
~-!!: N !l'kJ-:1, .. />
S:~ y
cru: i ..;;:i :: 1n:::!:•"ht:~ 1//c.alcula~.a . ca./ "
~- <lb
<j ~4</ j >
c'rs2 :•dd>
</ 5i eod/>
</S : E"l"il >

OAPR poase

l US!.Or_.,• 1 . e· Cod t"-Cs "\,i-,-.1 .. ?>d ; t ,.. tlcC:• ulnt : !.a"J'lttp: //scl> ,u. ll-Ol:>,O'l"'C ( t. ( tfl tle:0t r II ns : ~ · t ' i \"s ,.. tto: //ldtMH , .SCIP ,OI" S 0/ t! f'I il I">
<~-tw :ritldtr/>
<~ :aod1>
<l'IJZ:6dO=;tJOOl""st 1ulltu :r.:1:• .. tttt ://Cll(1,1ll60f'"l , CC-J'">
< t1'f"n> U </ turfl
c/r u 10d1t ,pons
</ ~: i>
c/ S; f'l \ tlOOt >

Figura 14. Salida métodos Request y Response, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Con esto ya tenemos creado el web services, a continuación crearemos un cliente para con-
sumir los métodos y funciones que tiene el web service claculdoraWS.

Web Services cliente.

Vamos a crear tres clientes distintos que consuman el web service:


■ Una clase Java en una Aplicación Java SE.
■ Un servlet en una Aplicación Web.
■ Una Página JSP en una Aplicación web.

-----'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 69
14
Primer cliente: Una clase Java en una Aplicación Java SE.

Los pasos para crear se describen a continuación:


1. Crear aplicación Java.
2. Crear Clase Java.
3. Crear un Cliente Web Service.
4. Consumir el Web Service.

Seleccionamos file – New Project, seleccionamos de la categorías Java y de Projects la op-


ción Java Application.

0 New Java ApphcatlOO

Pro,ectlcooon: C:'t,.lsers~t.lbires'Oxunents~l8Milflro,tets &owte,,,

Pl'O)eClf«let': •es'Jloa,-,t1~18e-.sPro,tcts~t1on_c.laJldot•_diente

_]

Figura 15. Creación de la aplicación cliente, imagen


generada por el autor desde el IDE Netbeans
Fuente: Propia.

Asignamos el nombre de Aplication_Calculadora_cliente. Lo que nos dará como respuesta


la clase Java.

1 packaq a lication_calculadora_cliente ;
animation
2
Apl~onCalokdoraWS

author G entabares

Web Services
7 publ i c class Aplication_Calculadora clien te
Calculador aWS
8

©-
II add: int
Configuration Files
Aplication_Calculadora_diente
109 l / ••
par arqs '" h e

13
8---
Source Paclcag s
apkation_calculadora_d ente
Aplication_Calculadora_diente.java
11

12
13
14
l public static void mai.n (String[J args)
-r
r """" n r

Libraries
~ Ji... A-L - FI:_ _ ....,:: _ &- - - h•il&.. -
15

Figura 16. Aplicación calculadora cliente, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

c..-=--_____.--i-- - - - - - - - - - -1 Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 70
15
Con esto damos clic con el botón derecho del mouse sobre el proyecto “Aplication_Calcula-
dora_cliente” y seleccionamos new – Web Service Client…

0 New Web SeMce Client


WSOl ~ncl tlieflt locelion

1, 0 - Fie Type SPeeifv the WSOl fie of the Ivel> 5ervU.


2. WSOL and Olent Location
http://',o<:Nw.;t:8080/AplcaaonCaloJadoraWS(C.lliaJadoralVS!wsdl 8rO¥tse •.•

Q l.ocalfile:

Q WSlllUU.:

O me ~tored:

P!ojcct
Pad<.,ge: ...

D Gener•~ Oispatch code

<Bao: Ne>!>

Figura 17. Definición del WSDL Cliente, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Seleccionamos Project y en el botón browse buscamos el web service CalculadoraWS. Y clic


en Finish.

Observemos que el proyecto del web service client integra el WSDL (lenguaje de definición
de interfaces).

1:;:1 ..

!VETA-INF .wsdl. localhost_8080. AplicadonCalrulado.-aWS


'.!; CalculadoraWS.wsdl
'.', CalruladoraWS.xsd_L xsd
aplication _calaJadora _diente
e,Aplica lion_Calrulador a_diente. java

8 CalruladoraWS
0 ill CalculadoraWSPor
add
Libraries

Figura 18. Estructura aplicación calculadora cliente, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

_ ______. _ _ _ _ _ _ _ _ Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina •
71
16
Observemos como el proyecto Aplication_Calculadoraa_cliente, adiciona los paquetes con
WSDL Lenguaje de descripción de servicios web. Lo que permite la creación de un servicio
concreto a partir de la dicha descripción. También adiciona el Web service References, con el
web service “CalculadoraWS” y sus métodos creados en nuestro proyecto web anteriormen-
te para ser consumidos.

Para consumir el método del Web Service solo arrastramos el método dentro del main y
asignamos valores a las variables para probar la funcionalidad del web service. El código de
la clase quedaría de la siguiente forma, con el web service incorporado para ser consumido
dentro de la clase Java:

public class Aplication_ Ca.1culadora_ cliente

,..
• l!pat args - .. co nd ll.ne ar
•/
p\lbl1c stat1c vo1d m.al.D(Str1ng(J args) <

add( , 4);

private static int add (int i, int J ) (


ccm.calculadora . CalculadoraWS_ Service service• new ccm.calculadora.CalculadoraWS_ Service () ;
ccm.calculadora . Ca cu adoraWS port= serv ice.getCa cu adoraNSPort () ;
int resu tado = port.add(i, J);
System. out .println( e ~ es • +resultado ) ;

return o:

Figura 19. Consumiendo el método add, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Ejecutamos la clase Aplication_Calculadora_cliente para probar la salida del web service.


Segundo cliente: un Servlet en una aplicación.

Los pasos para crear se describen a continuación:


1. Crear aplicación Web.
2. Crear un Servlet.
3. Usamos el Servlet para consumir el Web Service.

Seleccionamos File – New Project, seleccionamos en categorías “Java web” y en Projects se-
leccionamos Web Apllication.

------'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 72
17
0 ew Project

1. Cl>oofC Projcd
2. . ..

C.tc901,....~_._: - - - - - - - - ,
,..
Jlr,,

.w1•Web
Java EE
HlM. 5
la\' MEEl'!lbedd!d
llwac:ard
M.wcn
Ptf>
<irOOYY
C/C.++
0-,,pt,on:
CrHtes an ~mpty Web appkation ria standard a pro)lCt. A~1andlrd proieausesan
[ D>E-9ffl"l'ated buld solpt tobuld, run. and debug 'f«ll lll'O)'!CL

Figura 20. Creación de la una aplicación Web, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Le asignamos el nombre al proyecto de ProyectoCalculadoraWSServeltCliente y clic en si-


guiente.

New Web Application

St eps Server and Settings

1. Choose Project Add to En terpnse Application: <None >


2. Name and ocation
3. Server nd Setting
Server : GlassFish Server 4. 1 V Add ...
4. Frameworb

Java EE Ver j)ava EE 7 We~j v

Conte Pa tproyectoCalculadoraWSServtetC

< Back > Finish Cancel Help

Figura 21. Definición del servidor web, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

~---------· Fundación Universitaria del Área Andina 18


73
Dejamos por defecto aparece en la ventana, clic en finalizar, y se crea el proyecto

Ahora para consumir el web services, damos clic con el botón derecho del mouse, seleccio-
namos new – Web Service Client.

()
SttDS

I. 0.:-: T~
WSOt. •nd knt ocaii-
New Web Serv1ce Chent

W<nl and C""'1t lOQt,on

*°fy d>eW50l lie of die Wl!b S<tvtt.

• Projoct: ht1;1:/~&N!IJ/~1WS~1WS'-1 er....1e-...


-
Q LoalAI!:

Q W50LI.Jll.:

Q ltE~od: Bro,u,,

s,,edfy •~-""""the dent JaV• •afacts.,. be-•~


Pro,oct: Allbt1on..calo.Jodo,1_donu!
P~: ...

0 Gtner• Ollpotd, CDdt

<Bad< Not> fnot, cancel Hot,

Figura 22. Consumiendo el Web Services, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

8 ProyectoCalruladoraWSServ letcliente
S· Web Pages
~ -· WEB-INF
$ · wsdl
•·· ~_!;. j ax -ws-catalog .xml
······ l!J inde .html

!
$ a j ~ e~ d
Seleccionamos Project y en el botón browse
~ It) JDK 1. 7 (Default)
buscamos el web service CalculadoraWS. Y
clic en Finish.
l±J ··El:J Glassfish Server 'l.1
8· Web Service References
Observemos que el proyecto del web servi-
8 Calculadora 15
ce client integra el WSDL (lenguaje de defi-
0 · Ca culadoraWS
8 Calculadora WSPort
nición de interfaces).
add
8· Configuration Flies
ltl··· xml-resources Figura 23. Estructura de la aplicación Web, imagen
,..... ~ MA IFEST.MF generada por el autor desde el IDE Netbeans
Fuente: Propia.

-----'- -------· Fundación Universitaria del Área Andina


Fundación Universitaria del Área Andina 74
19
Ya tenemos integrado en la aplicación web el web service para ser consumido, como se ob-
serva en la estructura del proyecto en la carpeta Web Service References.

Ahora vamos a crear el servlet para poder usar nuestro web service.

Damos clic con el botón derecho sobre el ProyectoCalculadoraWSServletCliente, selecciona-


mos new – Servlet.

New I Cl Folder. ..
Web Servi ce Client. ..
Bui ld
eb Servi ce ...
Clean and Build
Java Class ...
Clean
JFrame Form .. .
Verify
Java Package...
Generate Java doc
JSP ...
Run Standard Deployment Descriptor (web.xmO,
Deploy ,~ Servlet. ..

Figura 24. Creación del servlet de la aplicación web, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Donde tendremos que darle el nombre “ClienteServlet”, creamos el paquete com.calculado-


ra.cliente, dejamos el resto de opciones por defecto y clic en Finish.

0 New Servlet .,.

Steps Na me and Location


-
I,
2.
Choooc Fie TYP<
Name • nd l oaHon
Closs _,., - - · J
3, Conf;ouro s.rvt.t o.,,loymmt

Pacbge: • • • •• • -

Nut>

Figura 25. Definiendo la clase Servlet, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

- - - - '- --------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 75
20
Con esto tenemos ya nuestra clase servlet, donde podremos llamar al web service, antes
debemos dejar nuestro servlet como punto de entrada a nuestra aplicación, para esto debe-
mos dar clic derecho sobre el proyecto y seleccionar propiedades, en la opción run agrega-
mos el nombre del servlet “ClienteServlet”que creamos y clic en ok.
Categories:
o
o
o
Sources
Frameworks
Libraries
~-: Glassfish~ver 4. 1

Java EE Version: Java EE 7 Web

o Java5crl>t Fdes c.onlext Path: ,i'royectoealaJadoraWSServletdiente


o CSS Preproc=ors
0 EUd ~ Display Browser on R1.n
0 Corrcmo Relabve URL: ClenteSe!vlet
O Pad<agng ~ f y lheURL relalhle ID lheccntextpalh ton.n, eg , f~ -Jsp
0 Doa.monllng
Browser: IDE's default browser
o Rl61
o License Headers ~ Deploy on Save
0 Formattt,g If selected, filos are compiled and depoyed ..tie,, you save lhem .
11-.s option saves you time v.ti.n you ru, or debug you- appkation in the IDE.

1/MOpbons:
(used for n.ning main classes or Lrlit lests; e.g. -Xms!Om)

Figura 26. Definiendo el Servlet como punto de entrada de la aplicación, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Ahora vamos a agregar el método “add” de nuestro web service, en el servlet que hemos
creado dentro del método “processRequest”, donde podemos observar código HTML, arres-
tramos el método “add” dentro de las etiquetas <body> </body> del serlvet, y modificamos
el método para que muestra la información de la variable resultado.

El cual debe quedar de la siguiente forma:


proceeted void prooessReq-aest(HttpServletRequesc requesc, HttpServletRespoMe respoase)
thrc¥~ Se rvl c t! xcept.1.cn , IOEx cept.1.on <
rc•ponac.~etCon~ ntTyp (•- x r- :~ - ~· " ):
try (Pr1ntWr1ter out• r esponae,qe tWrlter()}
e • 9 s e code. •
out.pr.1.ntl.n( • · >;
out.prl.ntln c·
out..pr1ntl.n , ..
out.prinel.n( • t~t. s _ l t Cl entese=-vlet</t tl • );
out.println( • e •);
ou •. puntln (" "Cl, · 1:
out..pr1ntl.n( • + requeae .qe tContex t.Path() + • hl>" ) ;
add( , 4 ) ;
out..pr.1.ntl.n( • • + r • .:iultado ~ ..... ,,
out. .pr1ntlnc •

•Se t. t. read safe .


'I 1a re:q--..11red.
co .colculadoro . CalculadoraNS par~ ~ rv,c . vctCalculadoraWSPortC);
re•u.~ad • port..acld. (i, j):
ret.urn L~s.ilta.

Figura 27. Código del Servlet, código creado por el autor desde el IDE Netbeans
Fuente: Propia.

------'- -------· Fundación Universitaria del Área Andina


Fundación Universitaria del Área Andina 76
21
Con esto ya tenemos el web service para ser consumido dentro de la aplicación web que
hemos creado, dando como resultado lo siguiente.

en let at /Pro e to al uladora


Re ultado 11

Tercer cliente: Una aplicación JSP.

Seleccionamos File – New Project, seleccionamos en categorías “Java web” y en Projects se-
leccionamos Web Apllication.

0 New Pro,ect
ste

me-:

,. ....,.,-----------,
Pto,octs:

V,'f!:, ~ - ,.,11, Exdlr!Q so.. ...


Y, eb fftt-Form ""'*'°ban

.
Oooac>bon:
Ctt.ates an empty Web application n a st.,nd«d !OE prD)Od. A stond«d pro,ect uses..,
Il)(-9ene,~ted 11<,ld so.pt II> buld,-. and deb.,g .,..,, prcje(t,

Figura 28. Creación aplicación Web, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Le asignamos el nombre al proyecto “Pro-


ProyectoCalcu adoraWSClien teJSP yectoCalculadoraWSClienteJSP”, dejamos
$·· por defecto el resto de opciones y clic en
Finish.

$ ·· Figura 29. Estructura archivos de la aplicación


[B Libraries web, imagen generada por el autor desde el IDE
[B Configuration Files Netbeans
Fuente: Propia.

-----'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 77
22
Creamos el web service cliente para consumir los métodos, fusiones y variables en la aplica-
ción JSP.

8 . . . . .. New
rl-11 '-JV:l l'T'I I

Folder ...
Servlet. ..
Build
Web Service Client. ..
Clean and Build
!ti Source Pa~ eb Service ...
Clean
rB Libraries
Verify
~ Java Class ...
1B Configuration Fl l r:r~m...cir:_,_..

Figura 30. Creación del Web Services Cliente, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.
Ahora para consumir el web services, damos clic con el botón derecho del mouse, seleccio-
namos new – Web Service Client.
~
Ste!!;

,. °""'""""T)II<
L
Clifflt
WSOl and Loa Hon
• Projttt:
New Web Serv,ce Chent

WSDL Md Ckftt Loauon

Spoafy ... W5IJl ffe ol d>e ..... ""'=·

h'11>://loah,&tWJl!IJ/~ a W S ~ a'/15- ~
-
0 ...,,..,.,
Q W51ll~
0 !DE Reg,s....ed, e,...,.

~fy •~NfflCM'l(fc dicdcnt)l'Va. ...-i.~wl b e ~ ~

"-,.ct Aplc:.abon_c.lo.lador. _dtn!c


Padiago: V

Figura 31. Consumiendo el Web


D Gena- • 0opold> code
Serves desde el cliente, imagen
.., generada por el autor desde el IDE
..... > ...... Netbeans
< Bad< Qlnaj Heb
Fuente: Propia.

Seleccionamos Project y en el botón browse


buscamos el web service CalculadoraWS. Y
clic en Finish.
Source Packages
Observemos que el proyecto del web servi-
ce client integra el WSDL (lenguaje de defi- 0
@
nición de interfaces). Libraries
8 Web Service References
Ya tenemos el webservice incluido en la 8 Calculadora WS
aplicación JSP. B CalculadoraWS
El . Ca culadoraWSPor

Figura 32. Estructura de archivos de la aplicación,


imagen generada por el autor desde el IDE Netbeans @
I ·
Configuration A les
add

Fuente: Propia.

------'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 78
23
Para incluir el método del web service en la aplicación JSP, seleccionamos em método “add”
y arrastramos a nuestra aplicación.

<body>
<h >Apl1cac 6n JSP< / h
<e start web service invocation - ><hr/ >
<I
r.ry
com. calc ladora.Calcu adoraws Service service• new com. calc ladora . Calculadoraws Service
com. calculadora.CalculadoraWS porr. = service. ger.CalculadoraWSPorr.();

int i 7;
int j 4;

int result = port . add(! , j) ;


out . println( " es·~ltado = "+result);
catch (E xc e ption ex )
out.println( ~ l cargar el Web Service" ) ;

\>
< -- end web sersnoe invocation --e >< hr / >
</ body>

Figura 33. Código del add del Web Services, código creado por el autor desde el IDE Netbeans
Fuente: Propia.

Ejecutamos la aplicación “ProyectoCalculadoraWSClienteJSP” y la salida debe ser la siguien-


te.

plicacion J p
Resultado = 11

Figura 34. Salida del Web Services, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

El resultado del método consumido del web service.

------'- -------· Fundación Universitaria


Fundación Universitaria del
del Área
Área Andina
Andina 79
24
1
UNIDAD

3 Unidad 3

Beans Enterprise Modelos de programación II

•••• Autor: Gustavo Enrique Tabares Parra

AR&ANDINA MIEMBRODELARED
Fundaci6n Universitaria del Area Andina I LU M NIJ
Introducción Los Beans Enterprise son una de las interfaces de programa-
ción de aplicaciones (API) que forman parte del estándar de
construcción de aplicaciones empresariales J2EE, teniendo
como objetivo encapsular los objetos del lado del servidor
que almacena los datos.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
81
3
U3 Metodología

El estudiante encuentra en el inicio toda la información sobre el módulo, que le permite


abordarlo y comprender su dinámica de funcionamiento.

Se recomienda llenar de forma ordenada la lectura de la cartilla para tener una mayor com-
prensión del tema, no se aconseja saltarse el contenido debido a que la programación orien-
tada a objetos es importante comprender bien el concepto.

Para esta semana hay un material de apoyo video capsula, video diapositiva, que le permitirá
afianzar los conceptos y comprender la herencia que se da en la programación orientada a
objetos.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
82
4
U3 Desarrollo temático

Beans Enterprise
Los Session Beans, es importante para saber cómo una aplicación java negocia con el servi-
dor, una de las funciones principales de java Enterprise, es su construcción de componentes
de software modulares, formada por APIS.

Imagen 1. Componentes Modulares


Fuente: https://morelos.quadratin.com.mx/Efermerides-el-Dia-del-Rompecabezas/

Java Enterprise Edition (JEE) es la encargada de coordinarlas, esta APIS puede ser comunes o
compartidas con Java Estándar Edition (JSE) u otras plataformas de programación que debe
cumplir con ciertos requisitos de conformidad para que se dé una integración con JSE.

Algunas APIS están especificadas como componentes únicos para JEE, esta es la que vamos
a tratar en esta cartilla Java Enterprise Beans (EJB).

EJBs es la encargada de detallar como los servidores de una aplicación mueven los objetos
específicamente JBeans.

Fundación Universitaria del Área Andina


I
5
83
EntreRrise JavaBe-ans

Servidor

()

Cliente

Figura 1. Objetos de Java Beans del lado del servidor y del cliente
Fuente: Propia.

Desde la versión 6 de Java Enterprise Edition, con la integración de JPA, Java Persistence API.
Los EJB quedan limitados a los Java Beans Session que trataremos en esta cartilla.

Los Session Beans, se encargan de encapsular la lógica de negocio de las aplicaciones em-
presariales, permite separar de forma clara para el desarrollo la lógica del negocio entorno
a los requerimientos como la escalabilidad, la seguridad, la apariencia y transacciones, etc.
Esto se puede aplicar tanto a un equipo de trabajo complejo como también para distribuir
de forma racional en trabajo de proyecto individuales.

Los objetos EJB, residen siempre en el servidor y se requiere de un cliente que interactúe con
ellos, entre el cliente y el servidor se dan dos tipos de Beans.
■ Stateful Session (Sesiones con estado).
■ Stateless Session (Sesiones sin estado).
La diferencia radica en que la interacción en los Stateful, no se cierra, esta permanece abierta
entre las invocaciones a los métodos que interactúan entre el cliente y el servidor. Mientras
que en los Stateless se cierra la sesión después de la invocación de método y hay que volver-
la a abrir cuando se invoque un nuevo método que necesite llevar a cabo esa iteración con
el servidor.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
84
6
Entreurise JavaB eans

lninterrumpida
Servidor

Stateful Session

Cliente

EJBs
- ~
lnterrumpida

Dliente

Figura 2. Tipos de sesiones Java Beans


Fuente: Propia.

En Java podemos crear Sessión Beans en tres tipos de proyectos:


■ Enterprise Aplication (Pueden contener EJBs y sus clientes).
■ EJB Module (sólo pueden contener EJBs).
■ Web Application (Integrado con proyecto Enterprise Application, aplicaciones indepen-
dientes).

Esta posibilidad de añadir EJB a aplicaciones web es una nueva característica que se introdu-
ce en Java Enterprise Edition 6.0 y que facilita el empaquetado y el despliegue de aplicacio-
nes web que usen estos Enterprise Java Beans en este caso los Session Beans. Lo que permite
empaquetar de forma fácil el código de la aplicación web y el código EJB en un único archivo
WAR.

En esta cartilla vamos a trabajar con una aplicación web como cliente, para negociar con los
Sessions Beans, podemos también utilizar clientes independientes. Es importante consultar
u poco el link www.java.com/es/download/faq/java_webstart.xml. Allí encontrarán mucha
información relacionada con el Java Web Start.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
85
7
¿Qué es Java Web Start y cómo se ejecuta?

¿Qué es Java Web Start?

El software de Java Web Start permite descargar y ejecutar aplicaciones Java desde la Web.
Características de Java Web Start.
■ Permite activar las aplicaciones con un simple clic.
■ Garantiza que se está ejecutando la última versión de la aplicación.
■ Elimina complejos procedimientos de instalación o actualización.
Recomiendo visitar el link para estar un poco más empapados del tema que relacionaremos
en esta cartilla.

Para iniciar un ejemplo de Session Beans vamos a trabajar con el IDE Netbeans en nuestro
ejemplo vamos necesitar 4 proyectos enlazados entre sí, con la siguiente función.
■ SessionBean : proyecto Enterprise Application.
■ SessionBeanCliente: App de cliente.
■ SessionBeanClienteLib: Proyecto de librería de clases.
■ SessionBean-ejb : Proyecto para la Sesion Beans.

Vamos crear un proyecto Java Enterprise Edition, para esto damos clic en proyecto nuevo,
seleccionamos en categorías Java EE y en proyectos seleccionamos Enterprise Application.

1. a.oo.e Pn>ject Q. Fit«:


2. '''
C.t.9onH:
Java
JavafX
~ .
&,litrpnse ~ b o n - E>astr,o Sc,u-a,s
Java Web t E.11Mod<Je
Jav• EE
t E.llMOd&Jo .. thElo<t,ngSOu'tt<
lffl<lS
• &,btrpnse ~bon a.nt
) & , - Alll>ka1>0n Oent • th EloslllQ Sau-ces
Java f"I: En-bedded
lava CMd
,....,.,,
Ptf>
Gloovy
CIC ++
Oescrc>1>0n:
Create,; a new Oftterprtse appkatiOft In a •tandatd prO)Kt. You can also a ..re an EJ3 n,odAe
r,ro)eCI and Web ai,i,lblXln pro)KI In die ent!<prlse apciiQllOn. A slilfldard pro)eCI uses an
IDE•o.,,..,n,tc,d Ant build saipt ID buid and ru, ywr r,ro)eCls.

Figura 3. Creación del proyecto Java Beans, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
86
8
Damos clic en Next>, asignamos el nombre al proyecto “SessionBeanPrimero”, y dejamos por
defecto, damos clic en Next>.

I
0
Steps

I.
2.
3.
Choos<!ePro)'Ct
Name and location
Server and Settings
Name and location

Project Name:
New Enterprise Application

SessionBeanPrimero

Pro)'ct t.oc,ibon: D:'gt>bares'f'1y Dowments~tBeansProJ- Brows4' •••


-
Project Folder: D:'Qtaba-es\"1y Dowments't/etBeansProjects\SessionBeanPrimero

D Use Dedicated Folder for Stomg Li>raries


LiJranes Folder Browse .••

<Bade [ Next> Fnsh Cancel ~


j
Figura 4. Definiendo nombre del proyecto, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

A continuación debemos seleccionar los módulos que deben der incluidos en la aplicación,
seleccionamos “Create EJB Module”, en este caso no vamos a utilizar “Create Web Application
Module”, lo desactivamos ya que vamos a utilizar una aplicación Enterprise.

0 New Enterprise Application

Steps Server and Settings

1. Choose Project Server: Glassfish Server 4. 1 Add ...


2. Name and Location
3. Server and Settings Java EE Version: Java EE 7 ..,

~ Create EJB Module: SessionBeanPrimero-ejb

D Create Web Application Module~ SessionBeanPm,ero-wa

< Bade Next> Finish Cancel Help

Figura 5. Selección del servidor, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Para finalizar damos clic en Finish, con esto


se hemos creado dos proyecto en nuestro x files Service
ejemplo.
Figura 6. Proyecto Java Beans, imagen generada por
SessionBeanPr·mero ""Ejb
el autor desde el IDE Netbeans
Fuente: Propia.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
87
9
Vamos a crear un cliente, a través de un tercer proyecto que será el módulo de la aplicación
cliente.

Vamos crear un proyecto Java Enterprise Edition, para esto damos clic en proyecto nuevo,
seleccionamos en categorías Java EE y en proyectos seleccionamos Enterprise Application
Client.

Categories : Projects :
Java Enterprise Application
Enterprise Appl·caoon with Existing Sources

Java Web EJB Module

Java EE

< >
Description :
Creates a new Enterprise application dient project in a standard IDE proj ect. "-
Standard projects use an IDE-generated Ant build script to bu'ld, run, and debug the
nrniPrt "'

Figura 7. Creación proyecto cliente Enterprise, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Damos click en Next>, y asignamos el nombre al proyecto “SessionBeans_primero_cliente”,


dejamos el resto por defecto y clic en Next>,

New Enterprise Application Client

Name and location

Project Name: eSS10118eans_pnmero_diente

Project LOG1tion : D:'QtabaresV-,y Documents'#'letBeansProjects Browse ...

Project folder: D:'QtabaresV-,y Documents'#'letBeansProjects\,SessionBeans_primero_c

D Use Dedicated folder for Storing Libraries


Libranes folder: Brov.se ..

Different users and proJects can share the same comptlabon 1branes
(see Help for deta s).

< Back Next > fnsh Cancel Help

Figura 8. Asignando nombre al proyecto cliente Beans, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
88
10
A continuación, añadimos nuestro proyecto a una aplicación Entreprise Application, “Add to
Enterprise Application”, seleccionamos “SessionBeanPrimero”, que es el proyecto Enterprise
que hemos creado incialmente, damos clic en Finish.

0 New Enterprise Application Client

Steps Server and Settings

1. Choose Proj ect Add to Enterprise Application: SessionBeanPrimero


2.. Name and Location .--------------,
<None >
3. Server and Settings
Server : GlassFish Se

Java EE Version : Java EE 7 "

Main dass: [sessionbeans_primero_cliente .Main

< Back Next> Finosh Cancel Help

Figura 9. Selección del servidor cliente, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Y tendremos el tercer proyecto “SessionBean_primero_cliente”, con la siguiente estructura.

S ionB nPr" ro
SessionBeanPrimero-ej b
SessionBeans_primero_ e

ro_di n
a·n.java
Test Packages
·braries
Test Libraries
Con gur a ·on Fi es
Serv er Resources

Figura 10. Lista de archivos del proyecto, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

En este proyecto tenemos la clase Main.java que utilizaremos más adelante. Ahora creare-
mos nuestro cuarto proyecto de librerías de clases. Damos clic en proyecto nuevo, seleccio-
namos en categorías Java y en proyecto seleccionamos Java Class Library.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
89
11
Choose Project

Ater:

Categories: Projects:

Java Free-form Project

Description:
Creates a new Java SE library in a standard IDE project. A Java SE library does not
conta·n a main dass. Standard proj ects use an ID -generated Ant build script to

< Back [""Next > Finish Cancel Help

Figura 11. Creando el archivo de librerías del proyecto, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Damos clic en Next>, y le asignamos el nombre al proyecto “SessionBeanPrimero_Cliente-


Lib”, y damos clic en Finish.

Name a nd Location

Project Name : ~S10nBeanPnmero _C6entelib

Project Location: ID:ljtabaresY.-,y DocumentsV\letBeansProjects Browse ... J


Project Folder: ): 'fltabaresVv!y Doruments V',letBeansProjects\51:

D Use Dedicated Folder for Storing Libraries


Lib aries Folder: Bro se...

Different users and projects can share the


same compilation &branes (see Help for detars).

<Back Ne > Finish cane Hp

Figura 12. Asignando el nombre del proyecto cliente Lib, imagen generada por el autor desde el IDE
Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
90
12
Y con esto, tenemos nuestro cuarto proyec-
to creado, el cual debe tener la siguiente es-
P r o jects x Fi les Se rvfoes

El
tructura.
SessionBeanPrimero
8 Jav a EE Modules
SessionBeanPrimero-ejb .jar

© ··
Se ssion.Beans _prime ro _diente .jar
Configuration R ies
Contamos con 4 proyectos con los nombres:
El ··
Server Resources
Sess,onBeanPrimero_CltenteL,b ■ SessionBeanPrimero
e Source Packages
<default pad<age > ■ SessionBeanPrimero_ClienteLib
■ SessionBeanPrimero-ejb
l±l·· Libraries
8- SessionBeanPrimero~jb

■ SessionBeans_primero_cliente
Source Packages
Libraries
Enterprise Beans
Configuration R ie s
Server Resources
El SessionBeans_primero_diente
El Source Packages
El se-.ssionbeans_primero_ d iente
e;.,ain.jav a
T est Pad<ages
Libraries
Test Libraries
Configuration R ies Figura 13. Lista de archivos de todo el proyecto,
Server Resources imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

A continuación vamos a crear nuestro Ses-


sion Beans, para esto seleccionamos el pro- Choose File Type

yecto “SessionBeanPrimero-ejb” clic botón Project: SessionBeanPrimero-ejb ...


derecho del mouse y seleccionamos new / Q. mer:
Other, en la ventana seleccionaremos en lis- Categories:
ta de categoría “Enterprise JavaBeans” y en Bean Validation Session Bean

tipo de archivos “Sessión Bean”, damos clic .. " Timer Session Bean
Contexts and DepE Message-Driven Bean
en Next>. Java
Service Locator
Caching Service Locator
JavaBeans Object!
Session Beans For Entity Classes
UnitTests Standard Deployment Desa'ptor
Persistence
Groovy
< >
"
Description:
Creates an empty Session Enterprise JavaBean (EJB) component. A
session bean is typical y used to encapsulate busness logic or
"
enterprise resources. This template creates 1he Java dasses for a

Figura 14. Creación de Session Beans, imagen


generada por el autor desde el IDE Netbeans < Back Next > Fnsh Cancel Help

Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
91
13
Le asignamos un nombre al archivo “Car-
New Session Bean
garSession”, creamos un paquete “com.ses-
sionbeanprimero.ejb”, seleccionamos el tipo Name and Location

de Session “Stateless”, creamos una interfaz EJB Name : CargarSession


“Remote” y seleccionamos el proyecto de
“SessionBeanPrimero_ClienteLib” y damos Project: SessionBeanPrimero-ejb

clic en Finish. Location: Source Padcages

Padcage: com.sessionbeansprimero.ejb
"
Session Type:
@Stateless

Q stateful

Q Singleton

Create Interface:
0 Local

~ Remote in project: i;essionBeanPrimero::~~~~~~-~........ 1 "

Figura 15. Definiendo el tipo de Session de la


aplicación imagen generada por el autor desde el
IDE Netbeans
Fuente: Propia.
L< Back Next> Fnish Cancel Help

Vamos a explicar un poco en las opciones de la figura 15:

Sessions Type:
■ Stateless: sesiones sin estado, No se mantiene la comunicación, la aplicación se ejecuta de
modo fluido, pero los valores de las variables no serán consistentes.
■ Stateful: sesiones con estado, mantiene una comunicación entre el servidor y el cliente,
por lo tanto los valores que mantengan las variables miembros son consistentes entre
distintas llamadas de los métodos sin perder la información de los datos.
■ Singleton: este tipo de Session fue incorporado a partir de la versión Java Entrerprise 6.0
y se encarga de crear instancias únicas de hilo para cada Session Beans, se crea cuando
es desplegada nuestra aplicación, trabaja como cache ideal para trabajar con datos que
deban ser leídos muy frecuentemente desde la base de datos.

Create Interface: debemos especificar si nuestra aplicación va a tener una interfaz local o
remote.
■ Local: El cliente se ejecuta en la misma máquina virtual Java donde también se ejecuta el
Java Beans.
■ Remote in Project: Es usada para clientes que se ejecutan en máquinas virtuales java dife-
rentes a las que se encuentran los Beans de Sessions.

Se puede seleccionar las dos interfaces Local y Remote.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
92
14
Los proyectos tendrán la siguiente estructu-
ra: Proj ects X Files Services

[!I SessionBeanPrimero
I
8·· SessionBeanPrimero _Clien teUb
ei
Source Packages
' com. sessionbeansprimero .ejb
~
CargarSessionRemo te.java
ffi·· Libraries
8 SessionBeanPrimero-ejb
I
I, 8· Source Packages

s ,.... ~com .sessionbeansprimero. eJb


~
LB ·
Libraries
Enterprise Beans
[3 Configuration Files
Figura 16. Tipos de acceso a la aplicación, imagen i

generada por el autor desde el IDE Netbeans i


ffi··
Server Resources
SessionBeans _primero _diente
Fuente: Propia.

Al analizar los proyectos SessionBeanPrimero-ejb, donde creamos la clase CargarSession.


java, está también fue creada en el proyecto SessionBeanPrimero_ClienteLib, con el mismo
nombre del paquete y con el nombre CargarSessionRemote.java que es nuestro cliente re-
moto.

La clase CargarSession.java contiene la notación @Stateless que es el tipo de sesión que


hemos seleccionado. La clase implementa la clase “CargarSessionRemote” que es nuestro
cliente remoto.

package com . sess · onbe anspr · mero . e ·b ;

import javax . e ·b . Stateless;

author gtabar s

Stateless
public class CargarSess ion implements CargarSessionRemote {

// Add b s .ess cg c be ow . g.t-c ~ck-· ed_t rand c.oose


// sert Cod > Add0 siness 1et od
}

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
93
15
Veamos la estructura de la clase CargarSessionRemote.java que se creó automáticamente
con la Interfaces que seleccionamos “Remote”.

package co . !!e!!!!ionbean!!primero.e jb;

import j a v ax.e jb . Remote;

author gtabare!!

@Remot e
public i terface CargarSessionRemote {

Para insertar código en nuestra aplicación, vamos a la clase CargarSession.java, y en la clase


nos indica:

/ / ~dd b s1.ess c e_o L. edit r a. d c .. 0:3e


II > Add

Adicionar la lógica del negocio abajo, con el botón derecho del mouse en el editor y selec-
cionar “Insert Code” y posteriormente Add Bussiness Method, con esto el método que vamos
a crear también se creará en la clase CargarSessionRemote.java. Vamos a hacerlo.

B import j a v ax.e jb . State ess;

l @Sta
."

publ "
@

Show Java doc


--
Alt+ Fl
~I
:rarSessio Remote {
Find Usages Alt+F7
Call Hierarchy
l.Ck ed to::: and cnoose
Insert Code ... Alt+ lnsertar
Fix Imports Ctrl+ ayus
}

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
94
16
Seleccionamos “Add Bussiness Method”. Nos cargará una ventana para asignar el nombre al
método, le colocamos “cargar” y colocamos el tipo de retorno del método en este caso escri-
bimos “String” y adicionamos los parámetros de nuestro método, en este caso adicionamos
uno llamado cargando, como muestra la figura.

0 Add Business ethod ...

ame: cargar

Rebsn Type: StrinQ Browse ...

Parameters Exceptions

1··-···Acid-··- ~
Remove

Up

Down

Use in ln rface: Local @ Remote Both

OK C~I

Figura 17. Definición del método del negocio, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Con esto lo que hicimos fue crear un método de tipo String llamado cargar, retornando un
String por defecto. Vamos guardando los cambios del proyecto.

Si observamos las dos clases a las que hemos hecho referencia CargarSession.java y Cargar-
SessionRemote.java, se ha creado el método en la clase CargarSessionRemote.java automá-
ticamente.

emote
public interface CargarSessionRe ote {

String cargar(Stri g carg do ) ;

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
95
17
Y la clase CargarSession.java, la cual vamos modificar para que retorne un valor, agregando
el siguiente código.

package com . sessionbeansprimero . e -b;

irr.port · avax . e · b.State ess;

.
author gtaba_es

Stat l ss
public c ass cargarSess ion irr.p ements CargarS essio err.a e {

@Ove::::-r -de
public String cargar(String car gando ) (
ret rn argada :

Hasta aquí ya tenemos un Session Beans que es accedido por un cliente de forma remota y
devuelve un String.

Ahora nos centraremos en el proyecto SessionBean_primero_cliente el cual debe usar la


librería que se ha creado en el proyecto SessionBeanPrimero_ClienteLib

Desplegamos el proyecto SessionBean_primero_cliente, pulsamos sobre libraries con el bo-


tón derecho del mouse y seleccionamos Add Project…

El- s__p ero - n e


Source Pa ges

dd Project... =i
Co dd Libra ...
sn ddJ older ...

L Properties

Figura 18 Asignando la librería al proyecto, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
96
18
Y buscamos en la lista de proyectos “SessionBeanPrimero_ClienteLib”, donde está la sesión
remote y clic en Add Project JAR Files.

Buscar en: e tf3eansProj ects

S· Project ame:
(±]- SessionBeanPrimero_C ientelib
[±}
Project JAR Flies:
(±]· PreubaCodigoJSF
d1stjSesSlooBeanPrinero_ClienteLib.Jar

[±J-
[±1-

ombre de archive: ~nts etf3eansProj ects\5essionBea1 [ Add Project JAR F. es

chivos de ·po: Project Folder Cancelar

Figura 19. Seleccionando la librería para el proyecto, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Ahora es necesario invocar desde el cliente el método que está en la SessiónBeans, para esto
es necesario crear una instancia o referencia de la clase que implementa la interfaces remo-
ta, nos ubicamos en el proyecto que estamos desarrollando “SessionBeans_primero_clien-
te”, abrimos el archivo Main.java pulsamos con el botón derecho del mouse y seleccionamos
insert código, seleccionamos “Call Enterprise Bean”…

public class Main I

, ..
• @param args the coll'Jlland line argun,ents

public static void m.ain ( String [) args) {


IODO code application logic here

Generate

Constructor .. .
Logger ...
toStringQ ...
Override Method •..
Add Property ...
Cal Ente= Bean ...
Use Da !abase ...
Send JMS Message ...
Send E-mail. ..
Cal Web Service Operation ...
Figura 20. Llamada al Bean, imagen generada por el
Generate REST d ient. .. autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
97
19
Seleccionamos un Enterprise bean de la lista de Bean crados

Cal l Enterprise Bean


Select an enterprise bean from open projects.

Ej emploJSF
FormularioJSF
PreubaCodigoJSF
EjmploWebJSP
SessionBeanPrimero-ejb

Reference Name:

Referenced Interface: No nterface Local @ Remote

Cancel Hep

Figura 21. Llamada al Beans cargarSession, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Ha insertado en el código la notación @EJB y ha importado las librerías necesarias para la


clase, creando una variable “cargarSession” de tipo CargarSessionRemote. Como lo muestra
la figura 21.

package sessionbeans_pri e ro_cli e nt e;

import com . sessionbeansprimero . ejb.CargarSessionRemote;


import java.x.e jb . EJB;

/**

• @author gtabares

public class Main {


@EJB
private static CargarSessi onRemot e car~arSession ;

,....
~ @param args c~e cc=and line argurr.ents

public static void main(St ring[J args ) {


TODO code application logic here

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
98
20
Agregamos el código haciendo uso la libraría que adicionamos al proyecto, llamando al mé-
todo cargar del SessionBeanPrimero_ClienteLib.

cargarSession.cargar(«Mostrando el metodo de la libraria a traves de la Session Remota»);


public static void ma.i.n(Str i ng () args ) {
.uJ.. code app •• cat-O!'l .og.c .. e_e
cargarSession .cargar ( ~Mostrando el metodo de la libraria a traves de la ession emota" ) ;

Ejecutamos el proyecto SessionBeanPrimero.

+ ... es i nBe nPrimero

Para ejecutar el proyecto Enterprise.

Cargado: 09trando el metodo de la libraria a trav es de la Sessio n Remota


run:
BOIL S CC~SSFUL ( total ti.me: -9 second3 )

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
99
21
1
UNIDAD

3 Unidad 3

Java persistence
API JPA Modelos de programación II

•••• Autor: Gustavo Enrique Tabares Parra

AR&ANDINA MIEMBRODELARED
Fundaci6n Universitaria del Area Andina I LU M NIJ
Introducción Introducción a Java Persistence API, más conocida por sus si-
glas JPA es el API de persistencia desarrollada por la platafor-
ma JavaEE.

Proporcionar un estándar para gestionar datos relacionales


en aplicaciones JSE o JEE, de forma que además simplifica
el desarrollo de la persistencia de datos, JPA se encarga de
mapear una clase a una tabla de una base de datos, de esta
manera solo tenemos que escribir el código de nuestra clase
con sus atributos y sus métodos. JPA se encarga de realizar la
persistencia de los objetos de dicha clase en la base de datos.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
101
3
U3 Metodología

Se recomienda seguir en un orden secuencial la lectura y estar muy atento al código que se
utiliza para el desarrollo de la unidad. En cada ejercicio que se expone, en la unidad, encon-
trará la explicación detallada para una mayor comprensión del tema.

Se recomienda realizar ejercicio basados en los ejemplos que están desarrollados en la uni-
dad para comprender mucho más fácil el concepto de interface en Java.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
102
4
U3 Desarrollo temático

Java persistence API JPA


Java Persistence API, JPA permite la persistencia no solo en la base de datos, sino que tam-
bién en otros formatos como archivos de texto plano y XML. Las aplicaciones empresariales
necesitan recolectar, procesar, transformar y reportar grandes cantidades de información,
toda esta información debe estar almacenada en algún lugar. Java ofrece una solución es-
tándar denominada Java Persistence API o JPA que facilita el trabajo al desarrollador de soft-
ware ya que sirve de puente entre el mundo de desarrollo y el mundo de las bases de datos,
permitiendo una mayor gestión de la información que es crucial al mundo de hoy para mu-
chos negocios.

Mencionemos las diferencias entre el modelo orientado a objetos y el modelo relacional,


los datos manejados por algún sistema en algún momento terminaran siendo almacenados
en Bases de Datos para su posterior recuperación y análisis. Las bases de datos relacionales
almacenan los datos en tablas formadas por filas y columnas.

Fecha
Cl veJ Clave_E
Sub_T SUb_T
Total Tot<ll

Cl.we_E
Oiwe_R 00
0-_F Fecha_C
d.,ve_A Clave_A Clave_A
00 Nootire
Cartidad Clave_P Cantidad Oirecoon
I~ e Descripcion Impor e
Sueldo
Existencia
COIIWSIOfl
Precio_V Area
<X>
Punto_R
Clave_T

_T
RF<
Nombre
Oirecc,on
Ciudad
Clave_A
Precio

Figura 1. Modelo Relacional


Fuente: http://www.esandra.com/mysql-i-introduccion-a-las-bases-de-datos-relacionales/

------------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 103
5
Cada registro usa como identificar un único campo de llaves primarias, las relaciones entre
tablas se representan mediante claves foráneas o tablas joins, respetando restricciones de
integridad, toda esta terminología es propia del modelo relacional. Sin embargo es total-
mente desconocido en el modelo orientado a objetos a objetos propio de Java.

En la orientación a objetos se manejan clases y sus instancias denominadas objetos; los ob-
jetos encapsulan su estado y comportamiento mientras está corriendo la máquina virtual de
Java, si se detiene la máquina se caen o se pierden todos los datos del negocio que maneja
el sistema en ese momento, para evitar esto necesitamos mecanismos de persistencia.

La persistencia es el proceso de almacenar el estado de un objeto de forma permanente en


disco duro, el proceso consiste en trasladar los datos de un modelo orientado a objetos a
otro relacional. En Java existen tres formas para logar persistencia.

Métodos para lograr la persistencia


■ Serialización: Java.io.Serializable: que convierte los objetos en una serie de bit almacena-
ble en disco. Tiene la desventaja de que carece de lenguaje de consulta y no da soporte a
altas tasas de acceso concurrente.
■ Java Data Connectivity: JDBC: Permite acceder a sistemas gestores de Bases de datos re-
lacionales, aunque su uso está muy extendido, la tendencia es migrar a herramientas más
potentes de mapeo de objetos relacional, esta herramientas se base en delegar el acceso
a la base de datos relacionales a un framework, Java define el modelo de programación
para la persistencia de entidades, pero deja su implementación a proveedores externos,
entre los que tenemos IBM con Hibernate.
■ Herramientas de mapeo Objeto-Relacional (ORM) JPA: Se encarga de automatizar la asig-
nación de objetos Java a tablas de bases de datos relacionales, sustituyen a las entitys
Beasn.

UmClus

Usertd

Uurf,lame

Use.Address

PhoneNo

0.0.B

Object Relational

I Mapping
I
Figura 2. Mapeo Relacional
Fuente:http://blog.jhades.org/solving-orm-complexity-keep-the-o-drop-the-r-no-need-for-the-m/

--------· Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina 104
6
JPA trabaja a través de entities que son clases Java también llamadas POJOS (Plain Old Java
Objects), no necesitan extender a ninguna otra clase o interface y se definen a través de
anotaciones en código que desarrollemos.

@Entity
@Table(nan1e = "CUSTOI{ER" ,schema = "APP" )
public class Customer implements Serializable
@Id
@Co l umn(name = "CUSTOMER_ID" )
private I nteger customerid;
@Basic(optional = false )
@Column(na.me = "DISCOUNT_CODE" )
private char discountCode ;
@Basic(optional = false )
@Column(name = "ZIP" , length= 10 )
private String zip ;
@Co l umn(name = "MAME" , length= 30 )
private String name ;

@entity: Sirve para indicar que una clase Java es una entidad JPA.

Los proyectos que utilizan JPA requieren de una unidad de persistencia, entre las que permi-
te trabajar en el IDE Netbeans utilizaremos eclipse link por defecto.

IJPA in Ja a nvironmenl (JBo > I


Program Control flow

Figura 3. Flujo de control del programa, Imagen tomada del sitio


Fuente: http://2.bp.blogspot.com/-aBGrV32c0ZE/VDYyN6aDceI/AAAAAAAAizA/Q_xcNr28g44/s1600/jpa-in-
Javaee-env-1.jpg

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
105
7
Figura 4. Creación de una aplicación web, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Persistir consiste en guardar datos de un objeto Java en una base datos, a través de conectar
una base datos mediante una conexión pool y una fuente de datos.

Java define en un modelo de programación de persistencia por el cual, solo es necesario


proporcionarle al motor de persistencia la clase entidad por cada clase de la tabla de la base
de datos.

Entidad son objetos que contienen información de mapeo que viven a corto plazo en me-
mora y persistentemente en base de datos, Java Persistence API dispone de una interfaz lla-
mada entity manager, con una serie de métodos para que podamos operar con ese conjunto
de entidades. Al conjunto de entidades asociadas con los registros de una base de datos se
le llama contexto de persistencia, es importante resaltar que la aplicación lo que maneja
son entidades del contexto de persistencia, cualquier cambio se realice en estas entidades
se trasladara automáticamente a la base de datos subyacente de forma transparente para
nuestro código.

Iniciaremos mostrando un ejemplo para la creación de entidades JPA


Inicialmente se debe crear un proyecto de aplicación Web, con el nombre “ProyectoJAP”

Choose Project

F~ter:

Java
JavaFX
Java Web
Java EE
HTMLS
Java ME Embedded
Java card
Maven
PHP
Groovy
C/C++
Description:
Creates an empty Web application in a standard IDE project. A standard project uses an
IDE-generated build script to build, run, and debug your project.

< Back Next > Finsh Cancel Help

Clic en Next> y seleccionamos como frameworks JavaServer Faces

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
106
8
Frameworks

Select the rrame•Norks you want to use in your V'! eb appl·cation.

Spring Web MVC

D Struts 1. 3. 10

Figura 5. Java Server Faces, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Dejamos por defecto las demás opciones y damos clic en Finish.

Para crear una entity JPA creamos un nuevo archivo y buscamos dentro de la categoría la
opción de “Persistencia” y tipo de archivo “Entity Class”.

Choose File Type

Project ProyectoJPA

Filter:

Categories: File Types:

Swing GUI Forms Entity Classes from Database


JavaBeans Obj ects JPA Controller Oasses from Entity Classes
Awr GUI Forms JSF Pages from Entity Classes
Persistence Unit
Persistence DB Scripts from Entity Classes
,-! Database Schema
L.. Session Beans For Entity Classes
RESTful Web Services from Entity Classes
RESTful Web Services from Database
< >
Description:
Creates an empty Java Persistence API entity dass .

Figura 6. Creación de la Entity Class, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
107
9
Clic en botón Next>, asignamos nombre a la clase “Estudiante”, y creamos un paquete llama-
do com.persistencia, verificamos que este seleccionado la opción “Create Persistence Unit”,
parra cada entity class se crea una unidad de persistencia bajo un archivo xmly damos clic
en Next>.

Name and Location

Ooss Name: Esludante

Project: Pfoyecto.J>A

loc:abon:

P~: com.persistenda

Prrnary~yTYP':: Llong
~----------------------~

Figura 7. Nueva Entity Class, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Asignamos un nombre a Persistence Unit Name o dejamos el que nos da por defecto, en la
opción Persistence Provider seleccionamos el proveedor “EclipseLink (JPA 2.1)(default)” Ele-
gimos la fuente de datos “Data Source”.

New File

Provider and Database

Persistence lht Name: ProyectoFAPU


Speofy the persister<:• p,-ovider aro database for enbty classes.
Persistence Provider: Ecipse!i,k (FA 2. l)(default)

Data SOl.l'ce:

~ Use Javo Tronsoction AP!s

Tobie Gonorotion Strotogy: @Cr••te O Drop ond Cr••te O Nono

.Nl!Name: ProyectoPA
Databaso C........ction:
:dorby:/,1ocallost: 1527/sarrp,, [ - on APP]
:mysq:/fttx,ihost:3306/dba>ntactos?zeroDateTmeBehavior-c
:SQlserver:/fttx,ihost: M3J;databaS<Nam<•Obporsonal (gu<:n

OI canc.i Help

< Bock Next > ~ Concol Help

Figura 8. Definición conexión a la Base de Datos, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
108
10
Data Source: JPA permite la conexión a la base de datos a través de una conexión pool Java,
agrupamiento de conexiones. Estas conexiones nunca se cierran ventaja que tiene frente a
JDBC y permiten tener la información del servidor, nombre de la Base de datos, el usuario y
clave de acceso a la base de datos.

Para esto en necesario utilizar una instancia de JEE de Javax.sql, Interface DataSource a tra-
vés de la API (JNDI) Java Naming and Directory.

La interface DataSource, utilizaremos el método getConnection, el cual permite tener una


conexión a la base de datos.

Crearemos nuestra propia conexión a la base de datos.

Locate Driver

Driver: Java DB (Embedded)


. I
Driver F Java DB (Network)
JDBC-ODBC Bridge
Miaoso~ SQ!. Server 2005
MySQI.. (Connector/J driver)
OradeOCI
Orade Thin Figura 9.Definición del Driver de la BD, imagen
PostgreSQL generada por el autor desde el IDE Netbeans
I
Fuente: Propia.

Aquí encontraremos los Drivers para diferente fuente de datos entre los que encontramos
Microsoft, MySQL, Ocracle OCI, PostgreSQL, etc. Para este ejemplo elegimos “Java DB (Net-
work)”, que significa Java Derby, se despliegan los driver derbyclient.jar y el derby.jar necesa-
rios para este ejemplo, damos clic en Next>. Proporcionamos los datos de conexión, nombre
y usuario a la base de datos.
Customize Connection

Driver Name: Java DB (Network)


"
Host: ~ st ] Port: @ 27 J
Database: ~ oyectojpa

User Name: ~ suario1


I
Password: •••••• I
~ Remember password

Connection Properties Test Connection

jdbc:derby:/f,ocahost: 1527i06Proyectojpa;aeate=true

Figura 10. Parámetros de la conexión a la BD, imagen


generada por el autor desde el IDE Netbeans < Back Next> Fnsh Cancel Help
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
109
11
En la opción JDBC URL: agregamos a la línea jdbc:derby://localhost:1527/DBproyectojpa; la
instrucción de créate=true debido a que la BD no existen para que Netbeans la cree, pode-
mos probar la conexión en el botón “Test Connection”. Damos clic en Next>.

For eaKti databa2 CX>nlleCbon, h ~ -,do.., only dispa'f\5 obj,,cts om one database sdlema.
5eKt ~ SlChenaof~ ~ ID be dsJ:Cay~ .

...

Figura 11. Selección del esquema de la BD, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Seleccionamos el esquema de la DB, por defecto aparece seleccionada APP.

Con esto damos clic en Next>, donde muestra al input de conection a la base de dato, damos
clic en Finish, luego en botón Ok.

En la opción Table Generation Strategy, seleccionamos Drop and Create lo que permite cada
vez que ejecutemos la aplicación borrar y crear la tabla de la base de datos, pulsamos en el
botón Finish.

A continuación se muestra el código generado por Netbeans, para la entity la cual corres-
ponde al archivo Estudainte.Java. Con la anotación @Entity lo que significa que es una clase
entidad JPA.

Fundación Universitaria del Área Andina


I
12
110
package com . persistencia;

rr.po t java . io .S r i l z b l e ;
import j a v ax . persistence . En t ity;
1.~port javax. ersistence.GeneratedVa
import j a v ax . persistence. e n erat ionType·
@Id, es indicada para el campo
import java.x.pers istence . Id ;
de acceso en JPA es la llave pri-
maria @Id, es indicada para el
campo de acceso en JPA es la lla-
• @author G~entabares
ve primaria
@En t ity
public class Estud iante implements Seria iz a ble {
private static final long serialVersionUI L;
@Id C:,
@GeneratedValue(strategy Generation ype. AU'.fO)
private Long id; C:,
@GenerateValue, permite generar auto-
public Long getld ( ) máticamente la llave primaria JPA, me-
return id ; diante la estrategia GenetationType.AUTO

public void setld (Lonq id ) {


this . id = id;

(lOverrid.,
pi.blic int hashCode () I
int hash= O;
hash+= (id ! = nul ? id . hashCode ( ) 0) ;
ret rn hash ;

@Override
public boolean equals (Ob J ect obJ ect ) {
•"• - t ~ t rk in the case the id tie ds are ot set
it (! (object instanceot Est diante))
return talse ;

Estudiante other• (E5tudiante ) object;


if (( this . id •• null && other . id ! • null ) II (this . id ! • null && ! this . id . equals(oth.,r . id))) (
return fa1.5e ;

ret rn true ;

@Overr i de
public Serino toStrino ( ) (
return "co .~ers1.stenc1.a.Estud1.ante[ 1.d=" 1.d + " )" ;

Figura 12. Anotaciones de la clave primaria, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
111
13
En el siguiente cuadro se muestra las diferentes opciones que se pueden utilizar para cada
GenetationType.AUTO.

Enum Constant Summary


AUTO
Indicates that the persistence proYider should pick au appropriate
strategy for the particular database.
IDENTITY
Indicates that the persistence proYider mm t assign primary keys for
the entity using a databa e identity column.
SEQUENCE
Indicates that the persistence proYider must assign primary keys for
the entity using a databas e sequence.
TABLE
Indicates that the persistence proYider must assign primary keys for
the entity using an underlying database table to ensure uniqueness.

Figura 13. Tipos de anotaciones de la entitys, imagen generada por el autor desde el IDE Netbeans
Fuente: Extraída de docs.oracle.com/Javaee/6/api opción GenarationType.

En el archivo Estudiante.Java vamos adicionar los campos nombre y apellido de forma pri-
vate para la clase entity.

@Entit y
public class Est~diante implements Serializable {
private static final long serialVersionUID = lL;
@Id
@GeneratedValu e (strategy = Ge n erationType . AUTO)
private Long id ;
private Str i ng ~ ;
private Str i ng a 1ll1dos ;

Generate d () {
Constructor ...
- Logger .. .
Getter .. .
Setter .. . id) {
Getter and Setter ...
_ Delegate Method .. .
Override Method .. .
Add Property ...
Use Entity Manager ,,,
cal Enterprise Bean ...
Use Database ...
Send JMS Message , ,, ! = null ? 1d . h ashCode() 0) ;
Send E-mai...
- Call Web Service Operation .. ,
Generate REST Ctient. ..

Figura 14. Generación de los métodos Getter y Setter, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
112
14
Presionamos la tecla Alt + Insert, para crear los métodos Getter and Setter, de la clase.

Select fields to generate getters and setters for :

D Encapsulate Fields
Figura 15. Selección de atributos de la clase, imagen
Generate Cancel generada por el autor desde el IDE Netbeans
Fuente: Propia.

Seleccionamos los campos y damos clic en Generar, dándonos como resultado los métodos
dentro de la clase Estudiante.Java

Data Acess Object DAO


Cuando se desarrollan aplicaciones en Java JEE, en al algunas es necesario acceder a los da-
tos, a través de algún método, por persistencia (Hibernate, JDO, iBatis), JDBC, un Fichero de
Texto o LDAP, etc. Cuando tenemos varias opciones para acceder a los datos puede ser un
problema, la forma de acceder a los datos muchas veces depende del fabricante y a la forma
de almacenamiento que utilicemos.

El Data Acess Object o patrón de diseño DAO, permite resolver este problema abstrayendo y
encapsulando el acceso a datos. El DAO se encarga de manejar la conexión con la fuente de
datos permitiendo acezar obteniendo y guardando de forma persistente los datos.

A través del DAO este realiza operaciones de forma automáticas hacia la BD, no son nece-
sarias las transacciones, como ejemplos podemos mencionar las búsquedas por ID, los pro-
cesos de creación, actualizado y borrado de registros, consultas u otras operaciones que se
realicen a menudo en la aplicación.

Lógica de persistencia clases DAO

Welb applicailion

Welb appli,cailion

Figura 16. Data Acess Object (DAO)


Welb application Fuente: http://www.ibm.com/developerworks/
library/j-dao/

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
15
113
Es necesario crear la clase controller JPA de la entity creada anteriormente (Estudiante.Java),
las clases controller siguen el patrón de diseño DAO.

Para crear la clase damos clic en archivo, Nuevo Archivo y seleccionamos en la categoría
Persistence y en tipos de archivos seleccionamos JPA Controller Classes from Entity Clases y
clic en Next>.
New File

Choose FIie Type

Pro)'CI: [ ProyectDPA

Flter :

tI Java
Swilg GUI Forms
i..v.a.onsOb~
AWT GUI Forms
l.k'litTests
Persastence

Clesa<>tion:
Crea tes a set of FA controler das.ses and related dasses from a ~t of entity classes .

Figura 17. Creación del archivo Clase Controller de la


Entity Clase, imagen generada por el autor desde el
< Bade ~ Fnsh
IDE Netbeans
Fuente: Propia.

Seleccionamos la Entity a la cual le vamos a crear la clase controller y clic en botón add>,
luego clic en botón Netx>.

New JPA Controller Classes from Entity Classes

Entity Classes

Available Entity Classes: Selected Entity Classes:


com. per sis tenaa. Es tud,ante Add >

< Remove

Add All »

<< Remove AD
~ Indude Referenced d asses

Select entity dasses.

< Back Next> F1111sh Cancel Help

Figura 18. Controlador de la Entity Class, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
114
16
Verificamos en nombre del proyecto, la ubicación del paquete com.presistencia y damos clic
en Finish.
New JPA Controller Classes from Entity Classes

Steps Generate JPA Controller Classes

l, Choose Fie Type Specify the location of the JPA controler classes and related classes.
2. Entity Oasses
3. Generate JPA Controller
Project: Proyecto.J>A
Classes
Location: Sou-a, Packages .,
Package: com.persistencia .,
/

< Back Next>


L Fnsh J Cancel Help

Figura 19. Clase Controlador, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Nos crea el código de la clase controlador EstudianteJpaController.Java, con los métodos


necesarios para interactuar con la lógica de persistencia de la entity en la Base de datos, en
este archivo encontramos los métodos:
• public void créate: para crear un registro.
• public void edit: para editar los registros.
• public void destroy: para eliminar registros.
• public Estudiante findEstudiante: para buscar registros.
• public List: para listar los registros.

public void cn,ate (E~tudiant e e~tudi onte ) throw~ RollbockFoiluzeException, Except ion {
£nt1tyHa.naqer em• null ;
try
u tx .beqin () ;
e - oetEntityManoqer () ;
~.per919t(e9~udia.nte);
ut x . commit O ;
catch (Exception ex) I
try I
u tx . rollback () ;
catch (Exception re)
~brow new Jtollbacktail re~xcep~ion( "Ji.n error occurred acc9IP~1nq co rel back che cransacc10n." , re);

throw ex;
finally I
if (em!• null )
. clo~e O;

Figura 20. Método créate, código creado por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
115
17
Este método utiliza una instancia de la clase Estudiante como argumento, invocando al mé-
todo em.persist(estudiante) que pertenece a la clase getEntityManager.
public void cdit(E~tudiante estudiance) throws NoncxistentEncicyException, RollbackFailureException, Exception C
tntltyHanaqer em• null :
ery I
ue >< . beqln () ;
em• 9et£nt1.tyMana9er();
seudlanee • roe(estudl nee);
Ut X,CO?tml.t ();
caech (Excepeion ex ) I
ery I
ue x . rollback() ;
catch (Exception re)
thro~ n e w RollbackFailurcExccption( •1'zl error occurred attc.aptinq to roll bac, the transac~i n.• , re);

String n:.:,9 • ex . getLocalized.Mes~aoe();


H (NO -- null 11 NO. lenoeh () . . 0)
Long id • estudiante.qetid();
lf (flndEseud1anee(ld) -- null ) I
throw new None.x.1stent.£nt1ty!:xcept1on( " he es~ud1.a.nt:e with 1.d " + 1d + • no lonqer exis,;s. " );

throw ex;
hnally
if I ! - null )
~ - Cose():

Figura 21. Método editar, código creado por el autor desde el IDE Netbeans
Fuente: Propia.
Este método utiliza una instancia de la clase Estudiante como argumento, invocando al mé-
todo em.merge(estudiante) que pertenece a la clase getEntityManager.
public void de troy(Lono id) throws Nonex1stenttntityfxception, Rollboctfa1luretxcept1on, Exception {
!ntityMa.naqcr ~ • null ;
cry {
ut:x . be<1in();
em• oet!nt1ty>.1anaqer();
tstudiante estu:cuante;
try
estudiante • em.oetReferenc (Estud1onte . closs , id);
c~tudiante.qctld ();
cacch (Ent:1tyNotFound.E.xcept1on ente) {
ehrow new Noncxi3tcn~EntityExcep~ion( •T.c cstudiantc with i d • id+ • no lenocr exists.• , enfe );

e.m . remove (estudiante);


ut-x .coz:mut. () ;
cotch (Excepe1on ex) <
t:ry (
ut x . rol lbacJc () :
catch (Exception re)
~brow ne:w Rollbackra1lure£xcept.1on( "An error occurred at.t~t.in~ t.c roll back the t.ransac~icn.• , re);

throw ex;
Hnolly <
if (em ! • null )
em . close: () :

Figura 22. Método destroy (Long id), código creado por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
116
18
Este método recibe un parámetro id, que es el campo principal de la entity para recuperar el
registro de la Base de Datos.

public List<Estudiante> ftndEstudtanteEntittes ()


return findEstudiante Eneities ( true , -:, -1 ) ;

public List<Estudiante> findEstudianteEntities (int maxResults, int firstRcsult) {


return find.EscudianteEntities( false , max.Results, firstResulc);

private List<Estudiante> ~indEstudianteEntities( boolean a ll , int max.Results, int firstResult ) {


Entit yMan ager e m = getEntityManager();
cry {
Crit:eriaQuery cg - em.get:Crit:eriaBuilder() . creaceQuery();
cq.select(cq.!rom(Estudiante. class ));
Query g • em.creaeeQuery(cq);
if ( ! all) I
q . setMaxResults(maxResults);
q.setFirstResult(firstResult):

return q.qetResultList();
finally {
em. close();

public Est:udi a n,:;e findEstudiante(Long id) {


EntityManager e m = get£ntityManager() ;
cry I
return em.!ind(Estudia...~te. class , id);
finally {
em . close( ) ;

Figura 23. Métodos de recuperación de registros, código creado por el autor desde el IDE Netbeans
Fuente: Propia.

Creando una aplicación partiendo desde un esquema de base de datos


Esquema de base de datos: es una representación gráfica de la estructura de la Base de Da-
tos.

El esquema de la base de datos puede estar representada de forma gráfica y a través de un


Script SQL.

estudiante
materia
ldEstudiante : int(11 )
® Nombres · v archar(25)
® Ma eria : varchar(25)
® Apellidos : varchar(25)
® Direccion : varchar(50)
® Telefono : varchar(12)
L

Figura 24. Esquema grafico de la Base de datos, imagen generada por el autor
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
117
19
Esquema de la Base de Datos Script SQL
CR!A!'! T;.J!LE IF !IOT EXISTS utu~,a.~tc .
ICIEnu'114lltC int (ll ) NOT Nlll.L ,
Nc::hre9 · varchar (2S , !iOI JULL,
' A1:•ll1Clos vo.rc!lor (25 ) !iOT ~1JLL ,
' D1rcee10:, · vo.rcho.r (SO) liOT !iUlL ,
Tclc!ono · varc!lar (1 2) NOT • ll,
PRIMARY iCEY ( ICIEst d16ntc )
£1iGIN!:• Ir:.oD3 DHAUL'! C!'..ltRS!: t!B ;

CJU:11 E TABLE If NOT EXISTS tcna (


Id.'!a'teria · inc ( ! ) "OT NULl 0£FAU!.T 1 0 1,
¥.atcna varellar (25) NOT !IULL,
PRIMARY KH ( . ldl!atcna )
·i;GINE.z ir.noD DEFAULT C:-!ARS t!8 ;

CR!A!t f;.J!LE IF !IOT EXISTS ' nota (


lCIEStU'1l.4lltC · int (ll) NOi l.l. DEfA T '0' ,
ld.'!atcna · int (ll) ·or Nlr...L DEFAULT '0' ,
·eta int (ll) NOT NULL,
PRIMARY iCEY ( ICIEst d14lltC , IdMa:cru ' ) ,
KEY · Id.'!atcna • (' lc:1¥.atcna · )
tliGINE• InnoD3 Dl:fAULT C-AARS!:T-ut!8 ;
f . . i .... u... • : _.....,l r.c-::a
A!.T!R T;.J!L! · no:a
ADD CONSTAAI not _l.bfk_2 FOREIGN KEY ( Id.'!atcria ) REftRENCES ltlltcr1a · ( ' Id.'!atcria ) Oll DELJ:TE CASCADE O!I UPDArt CASCADl:,
ADD CO!ISTRAINT ncta 1b!k ~ · _ REIG!I KEY ( Id!stu'1J.antc . ) RE !l'.RENCES cot diac.tc ' ( . Ic!!'otud1an:c ) OS DHITE CASCADE OS UPDATE CASCADE ;

Figura 25. Esquema de la Base de Datos en Script SQL, imagen generada por el autor
Fuente: Propia.

En Netbeans crearemos las entities JPA de modo automático a partir del esquema y las apli-
caciones Java Server Faces de las entidades JPA.

Abrimos el archivo universidad.sql, damos clic en File, Open Archivo y seleccionamos univer-
sidad.sql, para crear la BD vamos la pestaña Services y seleccionamos Java DB con el botón
derecho del mouse, y damos clic en créate Database ….

Projects Services X files


Databases

©·
$··
lt}
$··
i
Stop Server pro yectojpa;create =tr

r··· Crea Da abase ... pl [ ppon PP


©·· Properties ...
-ontactos?zero ateTim
8·· - Tr - - , __ ·da bas ame= bpe

Figura 26. Creando la Base de Datos, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
118
20
Creamos la base de datos con los siguientes campos:
0 Create Java DB Database

Database Name : ._
Fef
_·_er_sid
_a_d _ _ _ _ _ _ _ _ =:]___,
User Name: § ert

Password:
:=::...--======~
E••••
Conlirm Password: E••••
Database Location: C:'j.Jsers\Guentabares~netbeans-derby Properties ...

Figura 27. Parámetros de la Base de Datos, imagen


generada por el autor desde el IDE Netbeans
Fuente: Propia.

S g: jdbc:derby: / flocalhost: 1527,Universidad [univer 1 on UNIVER 1]


8 UNIV[Rl
Base de datos: Universidad S Tables
User Name: univer1 8Q
Password: 123456

Ya tenemos la BD para ejecutar el esquema


!liffi
, ·
NOMBRES
APELLIDOS

SQL para crear las tablas, para la creación 1- [im DIRECCION


TaEFONO
de las tablas desplegamos en jdbc:derby://
$·..=J Indexes
localhost:1527/Universidad, donde está la 1±1· Foreign Keys
base de datos, damos clic en tables con el eD MATERIA
botón derecho del mouse y seleccionamos I :~ IDMATERIA
créate table….
i
;. MARTERIA
$· Indexes
Adicionamos cada table de nuestra base 1±1 · Foreign Keys

datos para nuestro ejercicio vamos a crear 8·0 NOTA

las tablas estudiantes, materia, nota, como ; [im IDESTUDIANTE

muestra la figura. r:liffi :a~:TERIA


~ - Indexes
I±} _J Foreign Keys
Figura 28. Estructura de la Base de Datos, imagen lt} Views

generada por el autor desde el IDE Netbeans 1±1 U Procedures

Fuente: Propia. 9 ·· Other schemas

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
119
21
Persistencia en nivel web
Para crear las entities de la base de datos vamos a crear un proyecto web application, para
esto creamos nuevo proyecto.

Inicialmente se debe crear un proyecto de aplicación Web, con el nombre “UniversidadJPA”.

Choose Project

Filter:

Projects:
Java
JavaFX
Web Free.form Application
Java Web
Java EE
HTMLS
Java ME Embedded
Java card
Maven
PHP
Groovy
C/C++
Description:
Creates an empty Web application in a standard IDE project. A standard project uses an
IDE-generated build script to build, run, and debug your project.

< Bade Next > Cancel Help

Figura 29. Creación de una aplicación web, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Clic en Next> y seleccionamos como frameworks JavaServer Faces

Frameworks

Select the frameworks you want to use in your web application.

D Spring Web MVC

D Struts2

0 Struts 1. 3. 10

Figura 30. Frameworks JavaServer Faces, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
120
22
Dejamos por defecto las demás opciones y damos clic en Finish.

Para crear una entity JPA creamos un nuevo archivo y buscamos dentro de la categoría la
opción de “Persistencia” y tipo de archivo “Entity Class”.

Clic en botón Next>, asignamos nombre a la clase “Estudiante”, y creamos un paquete llama-
do com.persistencia, verificamos que este seleccionado la opción “Create Persistence Unit”,
parra cada entity class se crea una unidad de persistencia bajo un archivo xmly damos clic
en Next>.

Crear las entities de la base de datos creamos un archivo nuevo, clic en file –> New File, se-
leccionamos la categoria “Persistence” y en tipos de archivos “Entity Classes from Database”.
Clic en Next>.

0 New File

Steps Choose file Type

1. Choose Ale Type ProJect: UniversidadJ>A


2.
Fiter :

Categories:
JavaBeans Objects
AWT GUI Forms
Unit Tests
'Ji'A Controler Classes from EMty Classes
JSF Pages om Entity Classes
Persistence
Persistence I.ht
Groovy
DB S~ts om Entity Classes
Hibernate - Database Schema
Web Services Session Beans For Entity Classes
XML RESTful eb Services from Entity Classes
r.l;ossFish RESTful eb Services from Data base
< >

Creates Java Persistence Af> entity dasses based on an exisu,g relational database , En ·
classes are used to represen objects whose lifespan is longer than a typical program execution ,
1hs template creates an en ·ty class for each selected table, romplete with named query
arnotations, fields representng columns, and relationships representing foreign keys,

<Back Next> msh Cancel Ip

Figura 31. Creando archivo entity Classes from Database, imagen generada por el autor desde el IDE
Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
121
23
Escogemos la opción de “New Data Sourde” de la ventana Data Source para asignar la fuente
de la base de datos.
D.ltabase Tables

Data Source:
Available Tabh~ava:comp,'DefaultDataSource
, - - - - -~,-,dbcj_default
~dbc/_ TmerPool
Udbc/sample
1!lli It. . '

Figura 32. Nueva fuente de datos, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Asignamos un nombre al JNDI Name: y seleccionamos la conexión a la Base de Datos.

0 Create Data Source

JNDI Name: ~ versidad

Database Connecbon: jdbcderby:/,1ocahost: 1527,'IJniversidad [univer1 on UNIVER1] v


·dbc:derby:/flocalhost: 1527/DBproyectojpa;create =true [usuario1 on APP]
·dbc.:derby:/,1ocalhost: 1527/sample [app on APP]
..
"dbc :mysql:/flocalhost:3306/dbcontactos?zeroDateTrneBehavior. -
.dbc:sqlserver: /,1ocalhost: 1'133;databaseName=Dbpersonal [!lu DatabaseConn<
New Database Connection ...

Figura 33. Selección del jdbc:derby, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Nos carga la tablas que integran la base de datos, las cuales seleccionamos y add all >>. Y
clic en Next>>.
0 New Entity Classes from Database llllillll
Steps Databa:se Tables

1. Choose File Type Data Source: jdbc/universidad


2. Database Tables
3. Entity aasses Avadable Tables: Selected Tables:
4. Mapping Options Add>
ESTIJDIANTE
< Remove MATERIA
NOTA

Add >>

<< Remove AD

Any ~ Indude Related Tables

/
<Bade Next >"] Cancel Help

Figura 34. Selección tablas de la base de datos, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
122
24
En la ventana siguiente nos permite cambiar el nombre de las clases de cada tabla de la base
datos, las dejamos por defecto, creamos un paquete para las clases.

“com.jpa”. clic en Next>> y Finish.

New Entity Classes from Database

Entity Classes

Speofy the names and the locabon of the enbty classes.

Class Name:s:
Database Table Oass Name Generation Type

Project: UniversidadJPA

Loo,tion: Source Packages .,


com.jpa .,
Generate Named Query AmotabOnS for Persistent Fields
~ Generate JAXB Annotations
0 Generate MappedSUperdasses nstead of Entities

~ Create Persistence Unit

< Back [ Next> Cancel

Figura 35. Clases Entity, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

El· UniversidadJPA

l
8 Web Pages
Ii) WEB-IF
L. . ~ index.xhtml
- · Source Packages
Podemos observar en el proyecto la crea- !_ 8- ··· com.jpa
ción de las entities para cada una de las ta- i

1
blas que conforma la base de datos.

Figura 36. Proyecto con lista de clases de las Li~M;e,


entidades de la tabla, imagen generada por el autor j f±I .. , JDK 1. 7 (De fault)
desde el IDE Netbeans + EE GlassFish Server 4. t
Fuente: Propia.
8 -- Configuration Files
~ MANIFEST, MF
persistence. xml
web.xml
ffi Server Resources

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
123
25
Ahora crearemos las aplicaciones JSF para cada una de las entidades JPA.

Para esto creamos un nuevo archivo file -> New file, seleccionamos la categoria JavaServer
Faces y en tipos de archivos seleccionamos JSF Pages from Entity Classes.

Choose File Type

Project: Univ rsidadJPA

RI r:

Categories:
leb
HTMLS JSF Managed Bean
JSF Faces Configuration
JavaServer Faces
JSF Composite Component
Bean Validation
Strut:s2 JSF Resource Library Contract
Struts JSF Faces Component
Spring Frame Nork Facelets Temp ate
Enterprise JavaBeans Facelets Template Clien
r.nnh> i',:: ~nn nPnPnnpnrv Tni1 ¥
< >

< Back ext > Frush Cancel He:

Figura 37. Creación de las Pages from Entity Classes, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

En la siguiente ventana nos permite seleccionar las entities para la creación de las páginas.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
124
26
New JSF Pages from Entity Classes
Entity Classes

Av ·1able Entity Classes: Selected Entity Classes:


Add > com.jpa. Esll.Jd·ante
c_om.jpa ,Materia
< Remove com.jpa .Nota

Add All >>

[ << Remove
~ Indude Referenced Classes

< Back ~ ext ~ Fr11sh Cancel [ Help

Figura 38. Selección de las entities JPA, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.
Verificamos el nombre del proyecto y podemos cambiar los paquetes para los Session Bean
Package y las Classes Package de la aplicación, las Sessions Bean es el encargado de la con-
trolar la lógico del modelo con la base de datos. Y clic en Finish.

New JSF Pages from Entity Classes

Generate JSF Pages and Classes

Specify the package of e.,aslslg or ~ w EJBs and the package of JSF dasses.

Project:

Location: Scuce Packages

Session Bean Padcage : com.jpacontroUer

JSF d asses Padcage : _com


_ .pa
_·- - - - - - - - - - - - - - - - -"'~ '

Specify the location of new JSF pages .

JSF Pages Folder: Browse ...

Localization Bundle Name: ,1bde


0 Override exist.lg fies

Choose Templates: Stzind.vd l!lv~ver Faces v Customize Template

< Back Next > Fnsh Cancel Help

Figura 39. Definición del package de la Sessión Bean y las Classes Package, imagen generada por el autor
desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
125
27
Ya tenemos nuestra aplicación con los archivos generados de cada una las entities JPA, los
controladores, las páginas web para cada entidad (Create.xhtml, Edit.xhtml, List.xhtml, View.
xhtml). Aplicación CRUD, la cual podemos ejecutar para ver su funcionamiento.

El··· UniversidadJ ~A
$ Web Pages
$·· WEB-I F
$· es tudiante
r· l!J Create.xhtml
i···· ~ Edit. xhtrnl
L. [!l ust. xhtml
L. ~ Vie .xhtrnl
materia
nota
reso ces
index .xhtml
i .. [!J temp(ate.xhtm
s Source Packages
$·· <default package >
$· com.jpa
$·· com.jpa ,util
El··· com .jpacontro er
?·--- ~ Abstractfacade.java
l···· cti Estudiantefacade.java
r·· Materiafacade ,java
Notafacade.java
L"braries
Enterprise Beans
Configuration Files
Server Resources

Figura 40. Estructura de archivos de la aplicación UnivesidadJPA, imagen generada por el autor desde el IDE
Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
126
28
1
UNIDAD

4Unidad 4

Seguridad web Modelos de programación II

•••• Autor: Gustavo Enrique Tabares Parra

AR&ANDINA I MIEMBRODELARED
Fundacion Universitaria del Area Andina I LU M Ntj
Introducción El uso de la internet, ha abierto multiples alternativas para los
usuarios, desde el comercio, tranferencias de datos, procesa-
miento de informacíon, etc. El desarrollo de aplicaciones cada
vez debe garantizar a los usuarios la confiablidad y el buen
uso de las aplicaciones web. Por eso es importante la seguri-
dad que debe rodear y proteger estas aplicaciones y no per-
mitir que usuarios mal intencionados hagan uso idenbido de
la información y que esta quede alamcenada correctamente
en los repositorios de bases de datos de forma segura.

Durante este curso el estudiante comprendera la importancia


de la seguridad en aplicaciones web y la vulnerabilidad que
pueden llegar a presentar al ser accedidas atraves de las redes.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
128
3
U4 Metodología

Se recomienda seguir de forma ordenada la lectura de la unidad, y analizar de forma cui-


dadosa los ejemplos de códigos donde se plasma tema, logrando comprender el concepto
y permitiéndole avanzar de forma clara durante el desarrollo de la unidad. Es importante
apoyar el tema con lecturas recomendadas en la bibliografía y en los recursos de las lecturas
complementarias.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
129
4
U4 Desarrollo temático

Seguridad web

Una aplicación web segura puede ser tan compleja como necesite el sistema, requiere de
conocer los puntos vulnerables de la seguridad. Identificar de forma clara, las posibilidades
de seguridad que ofrecen algunos sistemas operativos y aplicarlas funciones de seguridad
para contrarrestar las amenazas.

En la siguiente lista encotraremos algunas pautas que seguridad minima que deben aplicar-
se a una aplicación web y que se deberian de tener en cuenta para dar mayor seguridad y
las cuales deberiamos de seguir.
■ Recomendaciones generales de seguridad para aplicaciones web.
■ Ejecutar aplicaciones con privilegios mínimos.
■ Conocer a los usuarios.
■ Protegerse contra entradas malintencionadas.
■ Tener acceso seguro a bases de datos.
■ Crear mensajes de error seguros.
■ Mantener segura la información confidencial.
■ Usar cookies de forma segura.
■ Protegerse contra amenazas de denegación de servicio (Microsoft, 2007).

Fundación Universitaria del Área Andina


I
5
130
La arquitectura de las aplicaciones web típicas que utiliza una base de datos tiene la siguein-
te estructura:

Encontramos tres niveles


1. Interfaz de Usuario: la encargada de gestionar la interacción entre el cliente y el sistema,
en una aplicación web es el navegador de internet.

Imagen 1. Interfaz de usuario, Imagen tomada del sitio http://www.staffcreativa.pe/blog/disenar-interfaz-


usuario/

2. Lógica de la aplicación: se ejecuta en los servidores web y servidores de aplicaciones,


con el uso de diferentes tecnologías podrán generar conocimiento y procesar informa-
ción con un fin concreto.

ntcrface
, , _ _ , de
,,.usuario
._..
' L6 ica de ne '"Ocio

Imagen 2. Nivel lógica de la aplicación


Fuente: Propia.

3. Almacenamiento de datos: es el repositorio de la información donde se guarda la infor-


mación de una organización. Que puede estar bajo diferentes tecnologías de almacena-
miento, como son: LDAP, Base de Datos Relacional, XML o un fichero de datos.

Imagen 3 Nivel del almacenamiento


Fuente: Propia.

Fundación Universitaria del Área Andina


I
6
131
Existe una conexión entre cada uno de los niveles adyacentes . el usuario a traves de la in-
formación que envia por medio del navegador de internet interactua con el servidor web y
a su vez la lógica de la aplicación interactua con el almacenamiento de datos para consultar
y almacenar la información en el sistema. Cada iteración tiene integrada un conjunto de
protocolos y lenguajes entre el nivel de interface y el nivel de aplicación encontramos los
protocolos HTTP Y HTTPS, para enviar la información. El servidor web y los repositorios de
datos se lanzan consultas en lenguajes propios sobre protocolos de red creados especifica-
mente para esta función.

ttTTPS d
docum nos
HTTPS de
XML sat 11t~s
.... documentos

, . ., ,. ', XML entr ntes


'
Red
extema

emo mo

Proxy
'
s, <lo de
segurieiad int no
_____________________ I:::::----------------.
a

• - - - - - - - - -111-
M
Qu ue S

Imagen 4. Arquitectura de seguridad


Fuente: https://msdn.microsoft.com/es-es/library/aa577397.aspx

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
132
7
La gráfica muestra la arquitectura de seguridad, ha sido segmentado y controlado por fi-
rewalls, protegiendo los servidores de contenido, la base de datos etc.

En una base de datos relacional la lógica de la aplicación lanzara consultas en lenguaje SQL
sobre protocolos como Tabular Data Stream Oracle Net y en el caso de un repositorio en
formato por XML utilizará consultas XPATH.

Cuando se presentan fallas en una aplicación web, permitiendo el acceso indebido de usua-
rios no autorizado para estraer información de un sistema informático, se debe en una alta
probabilidad de un fallo de seguridad en el codigo de la aplicación.

Los casos más comunes de ataques a las aplicaciones web según la OWASP (Open Web
Application Security Project) son:
■ Injection.
■ Cross-site Scripting (XSS).
■ Broken Authentication and Session Management.
■ Insecure Direct Object References.
■ Cross-Site Request Forgery (CSRF).
■ Security Misconfiguration.
■ Inseccure Cryptographic Storage.
■ Failure to Restrict URL Access.
■ Insufficient Transport layer Protection.
■ Unvalidated Redirects and Forwards (Institute, 2012).
A traves de estos ataques, intentan explotar fallos de seguridad de aplicaciones web en tec-
nologías de cliente o servidor, con la intención de extraer informacion de la base de datos.
Inyeccion de código SQL en aplicación web

Se presenta cuando una aplicación web no validad correctamente los datos que introduce el
usuario en la interfaz, y que se utilizan en consultas a repositorios de datos.

Employee Logon
Us@rnam@:

Password:

LOQin

Imagen 5. Formulario Login de aplicación Web


Fuente: Propia.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
133
8
Un sistema web, que tiene un sistema de validación de usuario, a traves de un formulario
donde se digita el login y un password, sino se valida por parte del programador correcta-
mente la información que recibe del formulario a traves de una concatenación, construyen-
do la consulta que se envia al servidor de la Base de Datos, el atacante puede interactuar di-
rectamente con la Base de Datos, como por ejemplo inyectando consultas SQL extrayendo,
modificando y eliminando información.

Employee Logon

adm inistrador __J


Pusword : 'or '1 ' ='1
I
I L"')in I

Imagen 6. Inyeccion de SQL en el password


Fuente: Propia.

Los ataques a traves de estos formularios, se dan cuando el atacante no introduce una con-
traseña correcta, al contrario digito una condición utilizando un carácter especial de comi-
llas simple.

Seguridad en aplicaciones Java


Nos centraremos en el tema relacionado con
la seguridad que maneja la plataforma Java,
veremos las caracterisiticas que hacen de
este un lenguaje de programación seguro.
■ La Máquina Virtual de Java como en- . la
torno de ejecución seguro, la ejecución Navega dor web,
de la JVM en el sistema, no es un siste-
ma interpretado ni compilado, funciona D apple tv iewer,
consola j ava
como un sistema hibrido, el desarrollo
de las aplicaciones en Java se compilan
totalmente independiente de la máquna JVM
en un proceso denominado bytecode, y
estos son interpretados de forma simple
nto r10
por la Máquina Virtual, que se encuentra
activo en la plataforma que trabajamos.
La responsabilidad de la seguridad que
tiene incorporado Java esta en la Máqui- Imagen 7. Máquina virtual de Java
na Virtual, por lo que es necesario su co- Fuente: http://Java.ciberaula.com/articulo/
rrecta implementación. tecnologia_Java/

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
134
9
■ Conjunto de interfaces y arquitecturas que son proporcioandas con el programador de
aplicaciones Java API, El API es un biblioteca de componentes que se agrupan en liberias
o paquetes que se integran en las aplicaciones, proporcionando una gran variedad de uti-
lidades para la construcción de interfaces gráficas, acceso a bases de datos, redes, entrda
y salidad E/S, etc. La API tambien nos proporcionan librearias o paquetes que implemen-
tan o permiten el acceso a elementos de seguridad en varios niveles, en los que podemos
mencionar los algoritmos de encriptación, certificados y firmas digitales.

La segurida en Java la podemos analizar desde varios frentes:

Desde el entorno de ejecución y desde las interfaces y arquitectura de seguridad

Enterno de ejecucuión: inicialmente la seguridad para los usuarios esta en la máquina vir-
tual, como mediadora y controladora de lo que se puede ejecutar y bajo que cirscunstancias
se ejecuta.

Interfaces y arquitectura de seguridad: la implentación de técnicas criptograficas permiten


garantizar la seguridad en aplicaciones cliente-servidor. Esta tecnica las proporciona Java
desde su arquitectura para integrar en sus aplicacines componentes seguros que den con-
fialbidad al uso de la aplicación.

Una máquina virtual de Java contiene un mecanismo de verificador de clases, el cual permi-
te asegurar, al cargar las clases, si estas tienen o cumplen con la estructura interna correcta.
Al detecrar un patron o un problema dentro de la clase se genera un excepción, ya que la
estructura de la clases se genera con una estructurra de bytes. La máquina virtual no puede
determinar sin una clase en realidad es un bytecode, con relación a esto la máquina virtual
tiene un verificador de clases que se activa sobre clases no seguras, permitiendo la correc-
ción del código.

Uno de los objetivos del verificador de la máquina virtual de Java es garantizar la construc-
ción de aplicaciones robustas, bien estructuradas y seguras en su codificación, cuando el ve-
rificador detecta un codigo mal intecionado en algun método, generando una incosistencia
en la ejecuación de la clase la máquina virtual no funcionaria si este es invocado.

La verificación del bytecode generado se realiza despues de ser cargado, donde el verificar
inicia su tarea de comprobación en dos fases.
1. Se realiza despues de cargar la clase, comprueba la estructura interna de la clase y la
integrigirdad del bytecodes.
2. Se llave a cado durante la ejecución del bytecode generado de la clase, confirmando las
referencias simbolicas de las clases, atributos y métodos.
El cargador de clases en Java

Es el que se encarga de cargar los bytecodes definidos que definen la clase, para ser veri-
ficados y poder generar las clases finales. La máquina virtual incluye un cargador de clase

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
135
10
primario que a su vez es la clase en Java verificadora de el bytecode de las clases creadas de
la aplicación y el cargador de clase primario esta desarrollado en C.

La seguridad tambien esta presente en el cargador el cual cumple con las siguientes tareas:
■ El cargador primario es el encargado de invocar incialmente el paquete Java.*, donde to-
das las clases tienen un apuntador null. Para la seguridad es importante debidio a que son
las clases basicas de inicialización y correcto funcionmianto del sistema y son cargadas
desde el sistema de archivos local evitando que sean cargadas remotamente o reempla-
zadas.
■ El cargador facilta espacios de nombre de clases diferentes para ser cargadas, evitando
la duplicidad, las coliciones entre los nombre de clases cargas desde difretnes origenes.
■ Dentro de la máquna virtual no pueden cargase ni comunicarse clases provenientes de
fuentes diferentes, evientando la obtención de información de aplicaciones no fiables.
ClassLoader

Es una clase que carga otras clases, ClassLoader se encarga de verificar las clases de una apli-
cación en memoria según el requerimiento que tenga la máquina virtual Java.

Cuando se lanza un programa por consola se ejecuta la siguiente estructura.

BootStrap carga Clases


Classloader - - -- desde • -- - Jd rt.J r S ring, In ager ,etc

Clases
e n ,on ____ carga •••
k/li xt pa,s xml
Classloader d
proveeclor rldcld

System
Class Loader
·---- desd
ClassPa Cla,es
adlcion s

Imagen 8. Estructura de ejecución de una clase Java


Fuente: http://www.arquitecturaJava.com/el-concepto-de-classloader/

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
136
11
Una de la cosas más importantes entre ob-
jetos son las relaciones que se dan en la
ClassLoaders, entre si como padre/hijo.
.....··
····• .

.
Si
, ------------·
.:

9 delega
padre
Integer

. ... ..
. ... No
. --0-. delega
' padre

d a
--
p re

. --
,

, -------- . l

Extension 1n1eger !
ClassLoader
Imagen 10. Delegación de la classLoader
' ' Fuente: http://www.arquitecturaJava.com/el-
' ' concepto-de-classloader/
a
Cuando se carga la clase persona por la
,-- padre
ClassLoader:

System
ClassLoader

• delega
padre

Imagen 9. Relacion Padre/Hijo No


Fuente: Propia.
-- --. delega
0 padre
Cuando una clase Loader va a cargar una --·
clase, esta consulta a su claseLoader padre

Persona
y si la tiene disponible la carga. En caso de
no poderla cargar este consulta a la siguien-
te claseLoader hasta llager a BootTrap-
ClassLoader.Si ninguno de los ClassLoader Persona I'
padre puede cargar la clase, el cargador de
clases actual intentará cargarla de sus rutas Imagen 11. Cargar la clase Persona
disponibles. Sino la encuentra se procudirá Fuente: http://www.arquitecturaJava.com/el-
un ClassNotFoundException (Caules, 2013). concepto-de-classloader/

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
137
12
1
UNIDAD

4 Unidad 4

Seguridad en
aplicaciones web Modelos de programación II

•••• Autor: Gustavo Enrique Tabares Parra

AR&ANDINA I MIEMBRODELARED
Fundacion Universitaria del Area Andina I LU M Ntj
Introducción La protección de las aplicaciones web es un requerimiento
que debe estar muy presente entre el desarrollo de dichas
aplicaciones, los constantes ataques que sufren las aplicacio-
nes por diferentes medios, es sin lugar a dudas el quehacer de
los atacantes a diario.

Es por esto que aplicaciones deben estar desarrolladas con


los niveles de calidad cumpliendo los estándares en el desa-
rrollo de software, que den confiabilidad al usar la aplicación
por parte del usuario.

En este curso vamos a tratar el tema de protección de aplica-


ciones web, con el objetivo de desarrollar aplicaciones más
seguras.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
139
3
U4 Metodología

Es importante llevar a cabo el desarrollo de la semana de una forma secuencial, para tener
una claridad en el desarrollo del tema, se recomienda no saltar entre páginas, pues el desa-
rrollo del tema está enfocado al seguimiento paso a paso de una actividad.

Es importante apoyar el tema con lecturas recomendadas en la bibliografía y en los recursos


de las lecturas complementarias.

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
140
4
U4 Desarrollo temático

Seguridad en aplicaciones web


La protección de las aplicaciones web, es un requerimiento muy común consiste en restrin-
gir el acceso a las páginas para ciertos usuarios. En Java para lograrlo debemos de crear un
dominio de seguridad en el servidor donde va a tener la aplicación.

Los dominios de seguridad hacen referencia a colecciones de usuarios y grupos de seguri-


dad, cada dominio de seguridad permite a la aplicación obtener información de seguridad
de algún tipo y almacenarla permanentemente.

Esta información de seguridad puede ser almacenada desde distintos dispositivos, desde
un archivo plano a una Base de Datos Relacional o un Repositorio. El configurar la aplicación
para que obtenga la información segura de un almacenamiento persistente nos libera de
mucho trabajo, solo debemos definir la autenticación de la aplicación para que use un do-
minio de seguridad.

USUARIO

Grupo de
permisos
Imagen 1. Grupos de usuarios
Fuente: http://www.metaspaceportal.com/metaspace/portal/15043/15583-users-and-roles?pms=1,15138,15
060002,view,normal,0

Fundación Universitaria del Área Andina


I
5
141
Cada usuario puede pertenecer a uno o a más grupos de seguridad, las páginas web solo van
a ser accesibles para ciertos grupos de seguridad, estos procedimientos de configuración
para los dominios de seguridad varían dependiendo del servidor que se esté utilizando.

El Servidor GlassFish tiene un dominio de seguridad ya configurado llamado “file”, podemos


ingresar también a la consola de administrador del servidor para personalizar los usuarios
que tendrán acceso a la aplicación.

Existen diferentes modos para autentificar a los usuarios, el más común es el autenticación
basada en formularios, lo que requiere de una página HTML o JSP, para capturar los datos
de autenticación que digite el usuario, además de capturar la información de proporcione
el usuario se puede encriptar la información configurando las páginas para que usen HTTP/
HTTPS sobre SSL.

En el siguiente diagrama se detalla el proceso que se llevara desde un cliente cuando se


loguea en una aplicación.

1. Solicita recurso protegido

Redireccion
2
Login .jsp - i l l ( - - - - - - a a pagina - -
de login

3. Formulario
---- - - - j.security_check ------
enviado

Cliente .....,...._____ Redireccionar a Recurso - - - - - - -

Error

Se devuelve
p6gina de error

Imagen 2. Proceso de logueo con j.security_check


Fuente: https://rekkeb.wordpress.com/2009/04/18/j_security_check-conocer-la-pagina-original-solicitada/

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
142
6
Los pasos para llevar a cabo este proceso, se debe de crear inicialmente una página de login
y otra página para el manejo de errores, cuando no se dé un login correcto. La aplicación
web debe ser configurada en el servidor para que pueda usar un dominio de seguridad y el
que se encargara de la autenticación.

El primer paso es iniciar el IDE de desarrollo NetBeans y creamos un nuevo proyecto, Web
Application, al cual llamaremos securitylogin, clic en Next>

New Web Application

Steps Name and location

L
2..
Choose Project
Name and Location
Project Name: 4¥.IIUfM
3. Server and Settings Project Location: D:'Qtabares'l',ty Ooruments'l\letBeansPro,ects Browse...
4. Frameworks
Project Folder: O:~tabares'l',ty Ooruments'l\letseansProjects\scositylogw,

Imagen 3. Nuevo proyecto Web Application, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia

Seleccionamos el servidor GlassFish y clic en el botón Finish.

Steps Server and Settings

1.
2.
Choose Project
Name and Loca tion
Add toEnterpnseAppk:ation: "k'"'N.=,one
=>_.._.. __.._- _-__ ··===-·-"·_-_-_
·:-_-_·._·-_-_-_-_-_ -_·-_-=_-=__. .~.! v
3. rv rand tting
4. FramewO<l<s
Server: Glas~sh Server 4.1 v Add .. .

Java EE Version: Java EE 7 Web v

Context Path : [/seOJitylogin

Imagen 4. Servidor GlassFish, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia

Creamos dentro del proyecto una archivo jsp llamo login.

8
L Cl! u Ul,J~!

New •D Fo lder ...

Find ...
00 JSF Page...
Ii Session Bean ...
Paste Ctrl+V Java Class.. ,
Con
Java Paclcage...
Session History
Sessio RESTfu l Web Services from Entity Classes ...
Session\....._ _P_ro_p_e_rt_i_e_s --nc-,n.,--i Servlet ...
SessionBeans _prlmero _dien Timer Session Bean ...
Web Service fro m WSDL. ..
Entity Class ...
JSF Pages from Entity Cla sses .. .
@ Entity Classes from Databa_se.. .
00 JSP...

Imagen 5. Creación del archivo jsp, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
143
7
Asignamos el nombre login.jsp y damos clic en Finish.

New JSF Page

Nanu~: and Location

Fie Name: \o9in


Project: sea.ritylogin

l ocation:

Folder: Browse ...

Opbons:
@Fac*ts
Q JSP Fie (Standard Syntax) Crea~ as a JSP Segnent
Description:
Faulets syntax

< Back Next > Lmsh J eanc

Imagen 6. Creando el archivo login.jsp, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia

Modificamos el código del archivo login.jsp que nos permita crear un formulario para ingre-
sar datos del login, como muestra la siguiente figura.

<l e page lan(Jllaqe= "java• contentType="text/html; charset•utf-8" pageEncod1ng= L'TF- %>


s. DOCTt'PE t EJB:.rc "-//W3C//DTD HTJ-G.. i.01 Tran:nt1onal//EN" "http://• -,.erg TF nl..>Al.i/l.oo:.e.dtd">
<html>
<head>
<meta http-equiv= •content-Type• content=•text/html; charset=UTF-8" >
<title>Login</title>
</head>
<body>
<p>Escrl.lle e l non-.bre d e usuario y contrasena para ingresar </p>
<form ethod•"POST" act1ona "l secL Lty check" >
<table cellpadding •o• cellspacing •o• border "O" >
<tr>
<td al1ng="r1ght" >Nombre Usuario:&nbsp; </td>
<td><inp t ~ype= ft~extft naxr.e=ftj_u~ernameft ></td>
</tr>
<tr><td al1on=•r1qht" >Contrasena :&nbsp : </td>
<tdXinput tvpe="pass ord n=e="J_password X/td>
</tr>
<tr><tdX/td>
<tdXinput type•"submit" value•"Login" ></td>
</tr>
</table>
</form>
</body>
</html>

Imagen 7. Código formulario login.jsp, código creado por el autor desde el IDE Netbeans
Fuente: Propia

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
144
8
La acción del formulario action=”j_security_check” es compactible con los desarrollos de
aplicación del servidor en Java Entrerprise Edition - JEE, este cuenta con un servlet de se-
guridad implementado en la instalación, este servlet es mapeado a la URL j_security_check.

En el siguiente paso se crea la página de loginerror, damos clic derecho y creamos un archivo
jsp en nuestra aplicación.

New JSP

Name and loc.ation

Fie Name: &,=Of


Project: sewi~

location : Web Pages

Folder: WEB -IJIF Browse ...

Created File: 'gtabares'r-ty Doarnents't,ietBeansProjects\seo,ntylogin\web\WEB-IJIF'jognerrOf,Jsp

Options:
@ JSP Fie (Standard Syntax) D Create as a JSP Segment
Q JSP Document (lO,t. Syntax)
~bon:
A JSP file using JSP standard syntax .

Imagen 8. Página de loginerror.jsp, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia

Y creamos en siguiente código del archivo loginerror.jsp.

< @page contenC- y"J)e= "text/html." pageEncodin - "OI'F-8" >


<!DOCTYPE html.>
<html.>
<head>
<ffieta http-e quiv= "Content-Type" cont e nt= "text / htm1; charset=UTF-8" >
<title>Error de Login< / title>
< / h1ead>
<body>
~ogin Incorrecc o <hl> ! </hl>
<br>
<form mechod= "POST" acc1on= "J_security_check" >
<cable e e l p a dding= "O" c e llspa cing="O" border= "O" >
<tr>
<Cd aling="right" >Non:bre Usuario : &nbsp : < / cd>
<cd><inp t cype="text" name="j_username" >< / td>
</tr>
<tr><td align="r gh " >Concrasena:,nbsp: < / cd>
<td><input cype="password" name="j_password" >< / td>
</tr>
<cr><cd>< / td>
<Cd><input cype= submit" value= "Login" >< / td>
</tr>
< / cable>
< / form>
< / body>
< / html.>

Imagen 9. Código loginerror.jsp, código creado por el autor desde el IDE Netbeans
Fuente: Propia

Fundación
Fundación Universitaria
Universitaria del
del Área
Área Andina
Andina
I
145
9
A continuación configuraremos el Deployment Descriptor, Descriptor de Implementación
XML de nuestro proyecto.

Para esto damos clic con el botón derecho sobre el proyecto, new Other …
IVcb Scrv,c •.
N ,:w
RESTfu l Web Services from Pattern~•..

Build
Other...
r 1.- ... - ..__ .. D , ,.a •

Imagen 10. Nuevo archivo Other, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia
Del cual seleccionamos la categoría web y el tipo de archivo Standard Deployment Descrip-
tor (web.xml)

Encargado de describir como se despliega una aplicación web.


Choose File Type

ProjKt::

Fdter:

File Types;
w~
KTMLS
JavaServer Faces
Be.!111 Valida lion
Struts
Spnno Framewort
Entetl)l'ist Jav Beans
Contexts and Dependency Inj,
111w,
.., Imagen 11. Creación del
< >
archivo Standard Deployment
Desaipbon:
Descriptor (web.xml), imagen
generada por el autor desde el
IDE Netbeans
Fuente: Propia

Nos crea el siguiente código, con una barra superior en la cual seleccionamos “Security”.

CJ
loginerror ,jsp X
----;i~-----~
- i , ,xm1
Source General Servlets Fite<s Pages Remences Secunty Hstx>ry

l
IE Login configuration

Security Roles

Role Name
Add •••

~ Security Constraints Add s«uity Consb-aint

Imagen 12. Pestaña Security web.xml, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
146
10
Desplegamos la sección de Login Configuration, y seleccionamos el tipo de autenticación
que vamos a usar en nuestro caso es Form, indicamos la página del Form Login Page, el Form
Error page y el dominio de seguridad que incluye GlassFish que es file.
_login.J<p X] _lognorro,.JOP X -b.xml°x']_ ... Cl

So... Gener-" seMets Fiters Paoes RefertnQes sec.,ity

Login configuration

Q None
Q ()gest
O Cknt Certb
Q Basic
(i) F«m
F«m logh Page: ,"loQro,J<I> 8r0"-~ ...

l!row,e ...

Imagen 13. Configuración del login, imagen

0 Security constraints
-· generada por el autor desde el IDE Netbeans
Fuente: Propia

Se pueden agregar nuevos roles de seguridad dando clic en el botón “add”, crearemos un
para administradores y otro para usuarios
- Security Roles

Role Name

oc · · Add:::J Edit .•• Remo ·e

Imagen 14. Creando nuevos roles, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia

A continuación debemos especificar que Add Web Resource


roles tienen acceso a qué páginas, para eso Rescuoe Name: Pagl'IM para Adnnstradcres

damos clic en el botón Add Security Cons- DH<nc>lleln:

traint y clic en el botón Add… lR Pattm,(5): /aorw,J-


Use"'"'""' (.) ID._ate m<Jlllllepalteml.
HTTP r-tolhod(s): •J Al HT1P M<!lhods

Q 5elecled HTTP Melhods


GET POST
l£AO PUT
OPTIONS 'llWl:
cam
Imagen 15. Definición de páginas para
administradores, imagen generada por el autor
desde el IDE Netbeans
Fuente: Propia

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
147
11
Para lograr que solo los usuarios autorizados puedan ingresar a las páginas autorizadas, es
necesario activar la caja de checheo Enable Authentication Constraint y escribimos el nom-
bre de los roles que van a estar autorizados para ingresar a la página, debemos pulsar en el
botón edit, seleccionamos el o los usuarios y adicionamos a la derecha y clic en el botón OK.
0 Edit Role, Names

Add >

<-

Qt

Imagen 16. Usuarios con acceso autorizado, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia

El resultado final se muestra en la siguiente figura.

d Security Constraints

TConstraint.I

HTTP"6elhod

Add...
1!'.]r,..t,1t-.U110nConstr..,t
OHo't>IIOn:

R.i.Nan!e{J): "'*""
D &lOblo u-oata eons1rat11
~

Imagen 17. Configuración del Constrain1, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia

Para el correcto funcionamiento es necesario crear una carpeta Admin con archivos, para
que puedan ser accedidos por los usuarios administradores.

A continuación vamos a crear un Deployment Descriptor, seleccionamos el proyecto y con el


botón derecho del mouse seleccionamos new file y en categoría seleccionamos GlassFish y
en tipo de archivo GlassFish Descriptor.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
148
12
Projed:

File':

FioT-,:
J08C Comectlon Pool
DBCRcscuu
;J,ISResou-ce
JavaMaolSeSS10n

Weblog,c:
0~
<
Imagen 18. Creación del archivo GlassFish
Descriptor, imagen generada por el autor desde
el IDE Netbeans
Fuente: Propia
Dejamos valores por defecto y nos crea en la carpeta Configuration Files el archivo sun-web.
xml

l;I Module Detals


-
Conor.nRDOt :
adroo.jsp &rGl'lltt. :
i'ldex.hbri
login.Jsp
l=---·
Ill Classloader
loginerror. jsp

Con'9,-ation Files Imagen 19. GlassFish Descriptor, imagen generada por


[!)
MANIFEST.MF
el autor desde el IDE Netbeans
web.xml Fuente: Propia

Seleccionamos la pestaña Security e ingresamos en el campo Security Role Name: el primer


rol que hemos creado, el cual se llama “Admin”, para luego asignar grupos debe coincidir con
el nombre que está utilizando el dominio de seguridad de nuestra aplicación en nuestro
caso es “appadmin” y clic en el botón ok.

0 Add Group
Enle' d-.e new group natrW! hett :

Groo.c>Nomc:: oppoct..,
ex sdKt a p r ~ y ent2red group""'"" om d-.e tall* below :

IG,oup-

Imagen 20. Definiendo grupos, imagen generada


por el autor desde el IDE Netbeans OK
Fuente: Propia

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
149
13
Ya tenemos configurado nuestro sistema de seguridad de la aplicación, ahora es necesario
crear algunos usuarios en el dominio para que puedan ingresar a la aplicación a través de la
consola de GlassFish.

Consola de Glassfish
Para esto vamos a la pestaña Services, seleccionamos la opción servidores GlassFish Server
con el botón derecho del mouse y seleccionamos View Domain Admin Console.
X ,9 SINIP~ >C

c.....-

1~,;-;:
Surt
S1..i1nO wgMod
Su;rt ,n Ptofile Mode

Refresh

V Oom11n Adm,n Console


Imagen 21. Abriendo la consola de administración
V. Oom,in Ser.-c, log
v- Oomo,n Update Cailer de GlassFish, imagen generada por el autor desde el
IDE Netbeans
Fuente: Propia.

Se abre la consola de administración del servidor GlassFish en el navegador.

Gl•ssF1s~ News Documentation


GlassFiSh News O~n Source Edc»n
Document.ton sec
Deployment OuictStartGUJde
latO.ployodAwkabo.. AdlTll'USlfltlC)tl Gude

Oe9«1Y an Applea!lOn

• ti "°"""""" Administn1tlon
JOBC
Chat'li»e Adl'!'lr'llltrllOt
" .,'f JMS RMOWms Pa.uword Update C•nt•r
" i.JJNDI
t..t Pa"wOfd Alases hatal11d ~ t a
Aval&ble Updates
Conftg.H~iom Monrtonng
Ava bll AM-Ons
d•fa1,1lt-c0n.fiQ
" I"
..v.-oonftg Resources
.Update TOOi

Figura 22. Consola de administración del servidor GlassFish, imagen generada por el autor desde el IDE
Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
150
14
Accedemos al menú izquierdo de la administración en la sección Configurations, default-
config, Segurity, Realms, file.

default-oonfig
Acfmin Sefvice
[I)I Avail ability Servi ce
Con edor Service
EJ B Contain~
~ Gr u Mana em ent Servi
., HTTP Selvice

,,

Imagen 23. Archivo de dominio de GlassFish, imagen


generada por el autor desde el IDE Netbeans
Fuente: Propia.
Luego añadimos usuarios para acceder a nuestra aplicación, pulsando sobre el botón Mana-
ge Users.

File Users
an age user .acoou ts fcx the

Configuration t~ame: efsult-config

Realm !lame: fil e

File Users (O•

~le-ct I
User ID I
Group List

Imagen 24. Crear usuarios bajo el dominio file de GlassFish, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
151
15
Pulsar sobre el botón New…. Para crear usuarios con su clave, bajo el dominio file. Crear el
siguiente usuario y pulsar el botón ok.

New File Realm User I Cancel I


Cli=B!e u ccou l> fOf thi= ame tly leded sea.irity realm
Indi cates required field

Configuration Name: defau lt-oonfig

Rea lm lfame: file

Use-r ID: ~ dminislrsdor


ame can be up to 255 ch sders. must co tam only letters. digits. un ersoore. dash. or
d t charsciers
Group List sppa1fmi n
Sep ate multiple g oup-s ·ith colon
M w Pa ssword : 1••••••

Confirm New Pa ssword: ••••••I

Imagen 25. Creando el primer usuario, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Ejecutar la aplicación y probar la validación del usuario administrador.

E crib e nombre de u u o ontraseii.a para

U 10 : inistrado r
ru;e:tia:
--------------i.
Log in

Imagen 26. loguin de la aplicación, imagen generada por el autor desde el IDE Netbeans
Fuente: Propia.

Pulsar el botón Login para acceder a la página de administración de la aplicación.

Pagin d mi• r ion!

Fundación Universitaria
Fundación Universitaria del
del Área
Área Andina
Andina
I
152
16
Bibliografia
■■Azpitarte, R. et al. (2009). Introducción a la Programación Orientada a Objetos con Java.
Departamento de Sistemas Informáticos y Computación Universidad Politécnica de Va-
lencia.
■■Balagurusamy, E. (2012). Object Oriented Programming with C++.
■■Cake software Foundation. (2015). Entendiendo el Modelo - Vista - Controlador.
■■Cardedo C. (2013). Tutorial de instalación y configuración de netbeans.
■■Caules, C. (2013). Arquitectura java.
■■EcuRed. (2015). Protocolo simple de acceso a objetos.
■■Global Mentoring. (s.f ). Instalación de JDK, Eclipse, ClasssFish y MySql.
■■Infosec Institute. (2012). OWASP top 10 tools and tactics - info Resources.
■■Lamarca, M. (2013). Aspectos tecnológicos de Internet.
■■Martínez, E. (2014). Tutorial de JSP (4) – Scriptlet.
■■Microsoft. (2007). Procedimientos de seguridad básicos para aplicaciones Web.
■■Microsoft. (2015). Visual Basic.
■■Microsystems. (2015). GlassFish.
■■Purdum, J. (2012). Beginning. Object-Oriented Programming with C#.
■■Rodríguez, A. (2015). Aprender programación java desde 0.
■■Ruiz, M. (2013). Introducción a los Sistemas de Base de Datos.
■■Soft, A. (2015). Programación: Cómo acceder a MySQL con JSP, Tomcat y JDBC.
■■Swlibre12. (2015). Servidores Web Apache (linux y windows).
■■Tejedor, R. (2008). Desarrollo de sitios Web dinámicos.
■■Valdés, D. (2007). Los diferentes lenguajes de programación para la web.

Fundación Universitaria del Área Andina 153


Esta obra se terminó de editar en el mes de noviembre
Tipografá Myriad Pro 12 puntos
Bogotá D.C,-Colombia.
....········
·····

···· ...
··· ...
·· .. ..··
..........................

También podría gustarte