Workshop Servlet MVC

Curso: "Java EE 7 y Frameworks" 2017
Servlet MVC: Separacin de Capas
Mdulo 1
Todos los logos y marcas utilizados en este

documento, estn registrados y pertenecen a
sus respectivos dueos.
AUTOR: Andrs Guzmn Fontecilla. 1

Email: andresguzf@gmail.com
WEB: http://www.bolsadeideas.com
LICENCIA: http://creativecommons.org/licenses/by-nc/4.0 | Arquitectura MVC Servlet
Objetivo
El objetivo de esta prctica es implementar la separacin de capas usando el patrn de
Arquitectura MVC (Modelo, Vista y Controlador) en los Servlets utilizando el IDE
NetBeans.
"Quemar etapas"
Es importante que
saques provecho de cada
mdulo y consultes
todos los temas que se
van tratando, sin
adelantar etapas.

Antes de empezar, cmo funciona rpidamente un MVC

Separar las distintas capas con sus roles bien definidos, implementando el patrn
de arquitectura de software MVC (Modelo, Vista y Controlador) es fundamental para el
desarrollo de aplicaciones escalables, flexibles y de fcil mantencin. Donde el Modelo
es la representacin especfica de los datos con la cual el sistema opera (generalmente
bases de datos, pero pueden ser otras fuentes de datos como Web Services etc), la Vista
presenta los datos en un formato adecuado para interactuar, usualmente cumpliendo con
la "interfaz de usuario" y finalmente el Controlador que responde a eventos,
generalmente peticiones de los usuarios (presionando un link, ejecutando un formulario,
etc), e interacta a su vez con el Modelo y la Vista (para pedirle informacin o para
representar la informacin, respectivamente).
El patrn MVC podra considerarse una "especializacin" de una tpica

"arquitectura de 3 capas" pero con una lgica de funcionamiento ms ajustada a
entornos web, donde se intenta -por lo general concentrar todas las peticiones del
exterior a travs de un solo punto de entrada
(clsicos sistemas "modulares")
En este nuevo diseo tendremos que todas

las peticiones del usuario se dirigirn hacia
un Controller ("Controlador") que se
encargar de decidir si solicita informacin de
la "lgica de negocio" al Model ("Modelo") y/o
pasa a la View ("Vista") para que se encargue
de generar la interfaz de usuario.
Nota: se recomienda la lectura de la

explicacin escrita en Wikipedia

Aqu se puede visualizar un diagrama que muestra la relacin con sus componentes
(ms adelante entraremos en detalles, por ahora solo veremos lo bsico y esencial para
entender el funcionamiento del patrn).
Aclaracin importante: los patrones de diseo son "la mejor solucin encontrada para
resolver un problema genrico y recurrente", pero, la solucin es una "gua" y no un
"manual" para resolver un problema especfico, ya que cada contexto tendr sus
particularidades. Servlet "implementa su versin" del patrn de diseo, por lo tanto
no significar nunca que lo que veamos de Servlet es sinnimo puro de MVC, en realidad
veremos que existen muchos frameworks que implementan su propia versin del patrn,
y todas estarn correctas.
Un patrn de diseo es solo eso, una gua.
Ejercicio 1: Copiar y modificar la aplicacin del Workshop anterior hola-

mundo-servlet:
1. Iniciamos NetBeans IDE.

2. Copiamos el proyecto con un nuevo nombre (Lo clonamos)
Seleccionamos el proyecto hola-mundo-servlet.
Clic derecho y seleccionamos Copy (ver Figura)

En el campo Proyect Name ingresamos hola-mundo-servlet-mvc

Clic en Copy

3. Expandimos el nuevo proyecto para modificar el Servlet:
hola-mundo-servlet-mvc->Source Packages->com.formacionbdi.servlets.saludar
4. Abrir con doble clic la clase SaludarServlet.

5. Remplazamos el contenido del mtodo processRequest(...) por el siguiente, tal
como se muestra en el cdigo de abajo:
/** ETC...*/
protected void processRequest(HttpServletRequest request,

HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
// Creamos y obtenemos el objeto de sesin

HttpSession session = request.getSession();
//Asignamos un mensaje en la sesin

session.setAttribute("mensaje", "Esto es un saludos que se " +
"ver en la prxima pgina");
/* Asignamos valores a la vista jsp, mediante el contexto Request*/

request.setAttribute("saludo",
"Hola, mi nombre es Zsamer. Cul es tu nombre?");
request.setAttribute("titulo", "Servlet SaludarServlet");
/* El Servlet selecciona la vista saludar.jsp y

reenva los atributos dentro de la misma peticin HTTP
*/
getServletContext().getRequestDispatcher("/saludar.jsp")
.forward(request, response);
/** ETC...*/
Antes que nada, podemos observar que ya NO usamos ms el objeto out

(PrintWriter), sino ms bien delegamos esta tarea de imprimir a la vista o
presentacin, por lo tanto cargamos (o despachamos) una vista o pgina
JSP quien se encargar de imprimir/mostrar los datos de nuestra aplicacin.
Ahora, expliquemos un poco de que se trata todo este nuevo cdigo, para
empezar observamos que asignamos dos atributos al request, el primero
"saludo" con un texto o mensaje y el segundo el "titulo", entonces cada vez
que necesitemos pasar o asignar datos a la vista necesitamos usar el objeto
request y su mtodo setAttribute(nombre, valor), como primer argumento
recibe el nombre o llave del atributo y como segundo argumento su valor u
objeto.
Luego hacemos un forward hacia la vista JSP mediante el objeto
RequestDispatcher, en otras palabras cargamos la vista JSP
mantenindonos dentro del mismo contexto actual del request, misma razn
por la que es necesario pasar el objeto request y response como
argumentos al mtodo forward(request, response).
Finalmente, podemos destacar que pasamos como argumento al mtodo
getRequestDispatcher("/saludar.jsp") el nombre de la vista JSP a cargar
(o despachar), en el ejemplo saludar.jsp, la cual se encuentra en la raz del
directorio Web Pages.

6. A continuacin guardamos los cambios (Ctrl + S).
7. Ahora creamos la vista saludar.jsp:
Clic derecho en Web Pages -> New -> Other

Escoger Web en Categoras (Categories) y JSP bajo File Types.
Clic en Next.
En File Name ingresamos saludar, para dar el nombre a la vista jsp.

Clic en Finish.

8. Modificamos el contenido que viene por defecto segn el cdigo de abajo:
<%@page contentType="text/html" pageEncoding="UTF-8"%>

<%
String saludo = (String) request.getAttribute("saludo");
String titulo = (String) request.getAttribute("titulo");
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><%=titulo%></title>
</head>
<body>
<h1><%=saludo%></h1>
<form action="RespuestaServlet" method="post">
<input type="text" name="nombre" size="25">
<p> </p>
<input type="submit" value="Enviar">
<input type="reset" value="Reset">
</form>
</body>
</html>
Slo comentar que usando el mismo objeto request, pero en la vista,

capturamos los datos almacenados en el controlador usando el mtodo

getAttribute(nombre), pasando como argumento el nombre o llave del
atributo que le dimos en el controlador.
9. Ahora modificamos el segundo servlet RespuestaServlet
Expandimos el proyecto hola-mundo-servlet-mvc para modificar el Servlet
hola-mundo-servlet-mvc->Source Packages->com.formacionbdi.servlets.saludar
Abrir con doble clic la clase RespuestaServlet.

Remplazamos el contenido del mtodo processRequest por el siguiente, tal
como se muestra en el cdigo de abajo:
/** ETC...*/
response.setContentType("text/html;charset=UTF-8");
// Obtenemos la session creada anteriormente

HttpSession session = request.getSession();
//Obtenemos el mensaje, guardado en la pgina anterior

String mensaje = (String) session.getAttribute("mensaje");
//Pasamos el mensaje de la sesion a la vista jsp

request.setAttribute("mensaje", mensaje);
//Finalemnte destruimos la session HTTP

session.invalidate();
/* El Servlet selecciona la vista respuesta.jsp y

*/
getServletContext().getRequestDispatcher("/respuesta.jsp")
}
Guardamos los cambios (Ctrl + S).
10. Luego, creamos la vista respuesta.jsp:
11. Clic derecho en Web Pages -> New -> Other
12. Escoger Web bajo Categoras (Categories) y seleccionar JSP bajo File Types.
13. Clic en Next.


En File Name ingresamos respuesta, para dar el nombre al archivo jsp.
Clic en Finish.
14. Modificamos en contenido que viene por defecto segn el cdigo de abajo:
<%@page contentType="text/html" pageEncoding="UTF-8"%>

<%
String mensaje = (String) request.getAttribute("mensaje");
String nombre = request.getParameter("nombre");
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Respuesta</title>
</head>
<body>
<h1>Hola, <%=mensaje%>!</h1>
<%if ((nombre != null) && (nombre.length() > 0)) {%>
<h2>Hola, <%=nombre%>!</h2>
<% } %>
</body>
</html>
Clic-Derecho en el proyecto hola-mundo-servlet-mvc y seleccionar Run.
Se abre el Navegador con la ruta base y cambiamos la url a:

http://localhost:8080/hola-mundo-servlet-mvc/SaludarServlet - > Enter.
Escriba su nombre en el campo (input form) y clic en el botn Enviar.


Ejercicio 2: Abrir, construir y ejecutar aplicacin catalogo-servlet-mvc:
1. Iniciar NetBeans IDE

2. Descargar proyecto catalogo-servlet-mvc.rar (viene como parte del laboratorio
de sta semana como archivo de descarga).
o Windows: Descomprimir el archivo catalogo-servlet-mvc.rar bajo
el directorio C:\curso\javaee\servlet, antes tener creado el
directorio.
o Unix/Linux: Descomprimir el archivo bajo el directorio
$HOM/curso/javaee/servlet, antes tener creado el directorio.
3. Abrir el proyecto catalogo-servlet-mvc:
Seleccionar File->Open Project (Ctrl+Shift+O)
Luego aparece la ventana Open Project y buscar el proyecto

descomprimido en el paso anterior en curso\javaee\servlet
Seleccionar la carpeta catalogo-servlet-mvc
Clic en Open Project.

Finalmente se agrega el nuevo proyecto bajo la pestaa Projects

4. Construir y ejecutar el proyecto catalogo-servlet-mvc:
Clic-derecho en proyecto catalogo-servlet-mvc y seleccionar Run.
El navegador se abre, mostrando un listado de productos.

5. Navegar la aplicacin, clic en el producto con ID 1:
6. Luego muestra el detalle del producto con ID 1, recibiendo el id como parmetro

en la URL, peticin del tipo GET: /detalle?id=1 y en el servlet capturamos el
valor mediante el objeto request (HttpServletRequest):
request.getParameter("id")

En el siguiente paso, vamos a analizar y estudiar el cdigo detrs de

escena.
7. Doble clic en Producto.java:

Expandimos: catalogo-servlet-mvc ->Source Packages->models:
Abrimos la clase Producto.java con doble clic
package models;
/**
* @author Andrs Guzmn F
*/
public class Producto {
private int id;
private String nombre;
private int precio;
public Producto(int id, String nombre, int precio) {

this.id = id;
this.nombre = nombre;
this.precio = precio;
}
public Producto() {
}
public int getId() {

return id;
}
public void setId(int id) {

this.id = id;
}
public String getNombre() {

return nombre;
}
public void setNombre(String nombre) {

this.nombre = nombre;
}
public int getPrecio() {

return precio;
}
public void setPrecio(int precio) {

this.precio = precio;

}
}
Vemos una simple clase Java, que representa una entidad dentro del
sistema, un concepto del contexto, es parte del modelo ya que contiene
un estado, datos, normalmente representar a un registro de una tabla en
una base de datos.
8. Ahora hacemos un doble clic en CatalogoDbDb.java
Expandimos: catalogo-servlet-mvc ->Source Packages->models:
Abrimos la clase CatalogoDbDb.java con doble clic
Observamos una clase java que simula una base de datos, creando un
listado (registros), registrando objetos del tipo Producto con sus datos
respectivos. Este tipo de clase se le conoce por nombre de DAO o Data
Access Object, es decir un objeto de acceso a datos quien se encarga de
las operaciones con los datos, normalmente de una base de datos,
consultas SQL u de otro tipo. En este caso tiene dos mtodos:
obtenerTodos() y buscarProductoPorId(int id):

package models;
import java.util.ArrayList;
import java.util.List;
/**
*
*/
public class CatalogoDb {
private List<Producto> productos = new ArrayList<Producto>();
public CatalogoDb() {
productos.add(new Producto(1, "Panasonic Pantalla LCD", 259990));
productos.add(new Producto(2, "Sony Cmara digital DSC-W320B", 123490));
productos.add(new Producto(3, "Apple iPod shuffle ", 69990));
productos.add(new Producto(4, "Sony Notebook Z110 ", 1499990));
productos.add(new Producto(5, "Hewlett Packard Multi F2280", 37990));
productos.add(new Producto(6, "Bianchi Bicicleta Aro 26", 69990));
productos.add(new Producto(7, "Mica Cmoda 5 Cajones", 69990));
productos.add(new Producto(8, "Movistar Celular Nokia X6 ", 299990));
}
public List<Producto> obtenerTodos() {

return productos;
}
public Producto buscarProductoPorId(int id) {

Producto resultado = null;
for (Producto producto : productos) {
if (producto.getId() == id) {
resultado = producto;
break;
}
}
return resultado;
}
}

9. Ahora analicemos la clase CatalogoEventListener.java, un Listener encargado
de inicializar el modelo dentro del Contexto del Servlets:
Expandimos: catalogo-servlet-mvc ->Source Packages->controller:
10. Abrimos la clase CatalogoEventListener.java con doble clic
Implementa la interfaz ServletContextListener para poder iniciar la
construccin de los objetos del modelo en el inicio del ciclo de vida de la
aplicacin (Contexto del sistema) implementando el mtodo
contextInitialized, donde creamos los objetos y los guardamos como
atributos de la aplicacin usando el objeto servletContext, ms adelante
en los servlets podemos obtener este objeto (servletContext) y acceder a
sus atributos, de esta manera podemos obtener el objeto catalogoDb:
package controllers;
import javax.servlet.ServletContext;
import javax.servlet.ServletContextEvent;
import javax.servlet.ServletContextListener;
import models.CatalogoDb;
/**
* Web application lifecycle listener.
*
*/
public class CatalogoEventListener implements ServletContextListener {
ServletContext servletContext;
public void contextInitialized(ServletContextEvent sce) {
servletContext = sce.getServletContext();
servletContext.setAttribute("catalogoDb", new CatalogoDb());
public void contextDestroyed(ServletContextEvent sce) {

servletContext.removeAttribute("catalogoDb");
}

11. Ahora, estudiemos el controlador del listado, doble clic en

ListadoServletController.java
12. Expandimos: catalogo-servlet-mvc ->Source Packages->controller
13. Abrimos la clase ListadoServletController.java con doble clic
El mtodo init es quien se encarga de inicializar el servlet, es como un
constructor, recibe como argumento al objeto config, luego mediante ste
obtenemos el objeto servletContext quien se encarga de acceder y
recuperar al objeto catalogoDb (mediante el mtodo getAttribute)
almacenado en el Listener.
14. Luego, en el mtodo processRequest utilizamos el objeto del modelo
(catalogoDb) para obtener el listado y luego se lo pasamos a la vista, muy limpio
y sencillo.
/* ... Etc ... */
@WebServlet(name = "ListadoController", urlPatterns = {"/catalogo/listado"})

public class ListadoServletController extends HttpServlet {
private CatalogoDb modelo;
@Override
public void init(ServletConfig config) throws ServletException {
super.init(config);
modelo = (CatalogoDb) config.getServletContext()
.getAttribute("catalogoDb");
}

/* Asignamos la variable nombre a la vista jsp,

mediante el contexto Request */
request.setAttribute("productos", modelo.obtenerTodos());
request.setAttribute("titulo", "Listado de Productos");
/* El Servlet selecciona la vista respuesta.jsp y

*/
getServletContext().getRequestDispatcher("/listado.jsp")

}
/* ... Etc ...*/

Ahora como tarea analizar:
1. El cdigo del servlet DetalleServletController.java

2. Las respectivas archivos de vistas jsp ubicadas bajo catalogo-servlet-mvc -
>Web Pages-> (index.jsp y listado.jsp)
3. Analizar la estructura del archivo de despliegue o configuracin de arranque
web.xml, ubicado bajo catalogo-servlet-mvc ->Configuration Files-> web.xml
y hacer clic en la pestaa XML o Source del editor:

Ejercicio 3: Abrir y ejecutar aplicacin catalogodb-servlet-mvc usando

base de datos:
El objetivo de esta prctica de laboratorio es aprender cmo configurar la base de

datos Derby de Java, veremos cmo iniciar el servidor de base de datos, crear una
nueva base de datos con su propio esquema y crear una tabla para almacenar los
productos del catlogo.
Adems vamos a abrir y ejecutar una aplicacin web con base de datos, analizaremos
y estudiaremos el cdigo que nos permite construir un sistema CRUD/Crear, actualizar,
Borrar y Listar MVC con Sevlet/JSP (Un mantenedor de Productos) utilizando
NetBeans IDE.

Configurar la Base de Datos de Java (Apache Derby)

1. Iniciar/levantar el servicio de la base de datos Java DB
Seleccionar la pestaa Services.
Expandir en Databases
Clic-Derecho en Java DB y seleccionar Start Server
2. Crear la Base de datos

Clic-Derecho en Java DB y seleccionar Create Database

En el campo Database Name escribimos java_productos

En User Name tipeamos curso
En Password y Confirm Password, ingresamos javaee
Ok.
3. Aparece una nueva conexin a la base de datos en Services bajo Databases

jdbc:derby://localhost:1527/java_productos [curso on CURSO]

4. Clic Derecho sobre el string de conexin que aparece y seleccionar Connect
5. Luego, clic derecho sobre el string de conexin (ya con conexin) y seleccionar
Execute Command.

6. Aparece el SQL Command editor, copiamos y pegamos lo siguiente:
CREATE TABLE productos (

id INT NOT NULL GENERATED ALWAYS AS IDENTITY,
nombre VARCHAR(50),
precio INT,
cantidad INT,
PRIMARY KEY (id)
);
INSERT INTO productos (nombre, precio, cantidad) VALUES('Panasonic Pantalla LCD', 259990, 20);
INSERT INTO productos (nombre, precio, cantidad) VALUES('Sony Cmara digital DSC-W320B', 123490, 12);
INSERT INTO productos (nombre, precio, cantidad) VALUES('Apple iPod shuffle', 1499990, 25);
INSERT INTO productos (nombre, precio, cantidad) VALUES('Sony Notebook Z110', 37990, 10);
INSERT INTO productos (nombre, precio, cantidad) VALUES('Hewlett Packard Multifuncional F2280', 69990,
7);
INSERT INTO productos (nombre, precio, cantidad) VALUES('Bianchi Bicicleta Aro 26', 69990, 5);
INSERT INTO productos (nombre, precio, cantidad) VALUES('Mica Cmoda 5 Cajones', 299990, 20);


7. Clic en el botn Run SQL
Listo ;-)

8. Verificando los productos en la tabla recin creada
Expandir el String de conexin->clic derecho y seleccionar Refresh
Expandir el esquema CURSO-> expandir Tables
Clic derecho en PRODUCTOS y seleccionar View Data

Construir y ejecutar el proyecto

1. Descargar proyecto catalogo-servlet-mvc-db.rar (viene como parte del
laboratorio de sta semana como archivo de descarga).
o Windows: Descomprimir el archivo bajo el directorio
C:\curso\javaee\servlet, antes tener creado el directorio.
o Unix/Linux: Descomprimir el archivo bajo el directorio
$HOM/curso/javaee/servlet, antes tener creado el directorio.
2. Abrir el proyecto catalogo-servlet-mvc-db:
Seleccionar File->Open Project (Ctrl+Shift+O)
Luego aparece la ventana Open Project y buscar el proyecto

descomprimido en el paso anterior en curso\javaee\servlet
Seleccionar la carpeta catalogo-servlet-mvc-db
Clic en Open Project.
Finalmente se agrega el nuevo proyecto bajo la pestaa Projects

3. Construir y ejecutar el proyecto catalogo-servlet-mvc-db:
Clic-derecho en proyecto catalogo-servlet-mvc-db y seleccionar Run.
El navegador se abre, mostrando un listado de productos.
Solucin de problemas 1: Si aparece un error 404 o 500 (Figura del navegador ms

abajo y figura del logs del despliegue de Glassfish), esto se debe a que la base de
datos no ha sido iniciada o levantada.


Ejercicio 3: Navegar y usar la aplicacin JSP Catalogo




Ejercicio 4: Estudiar cdigo de la aplicacin catalogo-servlet-mvc-db
Antes de revisar el cdigo vamos a explicar y analizar la Clase de Modelo DAO

ProductoDao y en patrn de arquitectura DAO.
En Ingeniera de software, un Data Access Object (DAO, Objeto de Acceso a Datos) es
una clase que implementa y provee una interfaz comn para acceder y trabajar con los
datos de una fuente de almacenamiento (Data Source), tales como una Base de datos,
un archivo plano o un XML.
Nuestra aplicacin debe ser capaz de obtener los datos y de persistirlos en algn lugar,
pero no tiene por qu saber de dnde los est sacando o dnde se almacenan.
Hay una forma de hacer esto que ha resultado bastante eficiente en el mundo JEE y de
aplicaciones web, pero que es aplicable a cualquier tipo de aplicacin que deba
recuperar los datos de algn sitio y almacenarlos. Es lo que se conoce como patrn
DAO (Data Access Object).
La idea de este patrn es sencilla. En primer lugar, debemos crear las clases que
representan nuestros datos, las entidades. Por ejemplo, podemos escribir una clase
Producto implementada con JDBC de Java, pero ya la tenemos! Ms adelante veremos
cmo implementarla con el ORM Hibernate.
Luego creamos una interface. Esta interface tiene que tener los mtodos necesarios
para obtener y almacenar los productos (contrato de implementacin) con las
operaciones bsicas que tpicamente son: listar, obtener por id, guardar, eliminar etc.
Entonces resumiendo un DAO es simplemente una clase del modelo que se encarga
de implementar las operaciones bsicas de acceso a datos que debe implementar un
contrato, la interfaz.

Primero veamos la interfaz IProductoDao con las operaciones y contrato que tendr la
clase Dao que accede a nuestros datos:
1. Estudiar la interfaz IProductoDao

Doble clic IProductoDao.java bajo catalogo-servlet-mvc-db->Source
Packages->models.dao
Estudiar el cdigo poniendo especial atencin en los comentarios
sobresaltados en negrita y azul.
package models.dao;
import models.entity.Producto;
public interface IProductoDao {
public List<Producto> listar();
public Producto buscarPorId(int id);
public void guardar(Producto producto);
public void eliminar(Producto producto);

}
Entonces una clase DAO (Data Access Object) nos permite disponer de las
funcionalidades y operaciones bsicas como actualizar, crear, eliminar, listar y ver
detalle. Para este ejemplo vamos a implementar de manera muy simple la clase de
Modelo DAO ProductoDao que usa la clase de modelo Producto (Entity), donde una
clase Entity representa los datos o registros de una tabla en la base de datos.

Entonces, veamos nuestra clase ProductoDao que implementa la interfaz Dao.
2. Estudiar la clase ProductoDao

Doble clic ProductoDao.java bajo catalogo-servlet-mvc-db->Source
Packages->models.dao
package models.dao;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import util.ConexionJdbc;
import models.entity.Producto;
public class ProductoDaoJDBC implements IProductoDao {
private Connection conn;
public void setConnection(Connection conn) {

this.conn = conn;
}
public Connection getConnection() {
if (conn == null) {
conn = new ConexionJdbc().getConnection();
}
return conn;
}
public void closeConnection() {
try {
getConnection().close();
conn = null;
} catch (SQLException e) {
e.printStackTrace();

}
}
@Override
public List<Producto> listar() {
List<Producto> lista = new ArrayList<Producto>();

try {
Statement stmt = getConnection().createStatement();

ResultSet resultado = stmt.executeQuery("SELECT * FROM productos");
while (resultado.next()) {
Producto producto = new Producto();
producto.setId(resultado.getInt("id"));
producto.setNombre(resultado.getString("nombre"));
producto.setPrecio(resultado.getInt("precio"));
producto.setCantidad(resultado.getInt("cantidad"));
lista.add(producto);
}
stmt.close();
} finally {
closeConnection();
}
return lista;
}
@Override
public Producto buscarPorId(int id) {
Producto producto = null;
try {
PreparedStatement stmt = getConnection().prepareStatement(
"SELECT * FROM productos WHERE id = ?");
stmt.setInt(1, id);
ResultSet resultado = stmt.executeQuery();
if (resultado.next()) {
producto = new Producto();
producto.setId(resultado.getInt("id"));
producto.setNombre(resultado.getString("nombre"));
producto.setPrecio(resultado.getInt("precio"));
producto.setCantidad(resultado.getInt("cantidad"));
}
stmt.close();
} finally {
closeConnection();
}
return producto;
}
@Override
public void guardar(Producto producto) {
try {
PreparedStatement stmt = null;
if (producto.getId() > 0) {
String sql = "UPDATE productos SET nombre=?,precio=?,cantidad=?
WHERE id=?";
stmt = getConnection().prepareStatement(sql);
stmt.setInt(4, producto.getId());
} else {
String sql = "INSERT INTO productos(nombre, precio, cantidad)
VALUES (?,?,?)";
stmt = getConnection().prepareStatement(sql);
}
stmt.setString(1, producto.getNombre());
stmt.setInt(2, producto.getPrecio());
stmt.setInt(3, producto.getCantidad());
stmt.executeUpdate();
stmt.close();
} finally {
closeConnection();
}
}
@Override
public void eliminar(Producto producto) {
try {
PreparedStatement stmt = getConnection().prepareStatement(
"DELETE FROM productos WHERE id=?");
stmt.setInt(1, producto.getId());
stmt.executeUpdate();
stmt.close();
} finally {
closeConnection();
}
}
}

Podemos observar, en primer lugar, que hacemos uso del modelo Producto. Vamos a
utilizar este objeto para implementar las operaciones en la tabla de base de datos de
nuestros productos. La instancia de ProductoDao contiene el objeto de Conexin a la
Base de datos mediante el API JDBC.
El mtodo obtenerTodos() retorna todos los objetos productos desde la base de datos
como un List, PreparedStatement es usado para preparar las consultas y luego ejecutar
las operaciones de la base de datos, el objeto ResultSet es usado para recorrer un
cursor retornando cada uno de los registros, por pada registro se crea un objeto entity
Producto y se almacena en la lista, al final se retorna el resultado como una lista de
objetos del tipo Producto.
El mtodo obtenerPorId($id), segn el id pasado por argumento en el mtodo retorna

un nico registro como un objeto del tipo Producto, el mtodo guardar(Producto) crea
un nuevo registro en la base de datos o bien actualiza un registro dependiendo si existe
el id, donde un objeto de Producto es pasado por argumento al mtodo, ste objeto
producto contiene los valores de la peticin, tpicamente del formulario, finalmente
eliminar(Producto) elimina un registro completamente (dado su id).
El cdigo e implementacin de cada uno de estos mtodos es simple y hablan por s

solos, no vamos a profundizar ms all para no extendernos ms de la cuenta.

3. Estudiar la clase Servlet ListadoController
Doble clic ListadoController.java bajo catalogo-servlet-mvc-db-
>Source Packages->controllers
/* ... Etc ... */
@WebServlet("/catalogo/listado")
public class ListadoController extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request,
IProductoDao dao = new ProductoDaoJDBC();
List<Producto> lista = dao.listar();
request.setAttribute("productos", lista);
request.setAttribute("titulo", "Listado de Productos");
request.getRequestDispatcher("/WEB-INF/views/listado.jsp")
}
}
Utilizando el objeto DAO (Objeto de acceso a Datos) obtiene el listado

completo de los productos.

4. Estudiar vista JSP listado.jsp
Doble clic listado.jsp bajo catalogo-servlet-mvc-db->Web Pages-
>/WEB-INF/views->listado.jsp
<%@page import="models.entity.Producto"%>
<%@page import="java.util.List"%>
<% List<Producto> lista = (List<Producto>) request.getAttribute("productos");

String titulo = (String) request.getAttribute("titulo"); %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<h3><%=titulo%></h3>
<a href="<%=request.getContextPath()%>/catalogo/form">crear producto</a>
<table border="0">
<tr>
<th>Id</th>
<th>Nombre</th>
<th>Precio</th>
<th>Cantidad</th>
<th>Editar</th>
<th>Eliminar</th>
</tr>
<% for (Producto producto : lista) {%>
<tr>
<td><%=producto.getId()%></td>
<td><%=producto.getNombre()%></td>
<td><%=producto.getPrecio()%></td>
<td><%=producto.getCantidad()%></td>
<td>
<a href="<%=request.getContextPath()%>
/catalogo/form?id=<%=producto.getId()%>">editar</a>
</td>
<td>
/catalogo/eliminar?id=<%=producto.getId()%>">eliminar</a>
</td>
</tr>
<%}%>
</table>
</body>
</html>
5. Estudiar la clase Servlet FormController

Doble clic FormController.java bajo catalogo-servlet-mvc-db->Source
Packages->controllers
/* ... Etc ... */
@WebServlet("/catalogo/form")
public class FormController extends HttpServlet {
private static final long serialVersionUID = 1L;
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
int id = (request.getParameter("id") == null)

? 0
: Integer.parseInt(request.getParameter("id"));
Producto producto;
String titulo;
if (id > 0) {
producto = dao.buscarPorId(id);
titulo = "Modificar Producto";
} else {
producto = new Producto();
titulo = "Crear Producto";
}
request.setAttribute("producto", producto);
request.setAttribute("titulo", titulo);
request.getRequestDispatcher("/WEB-INF/views/form.jsp")
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)

int id = (request.getParameter("id") == null)

? 0
: Integer.parseInt(request.getParameter("id"));
List<String> errores = new ArrayList<String>();
String nombre = request.getParameter("nombre");
int precio = 0;
try {
precio = Integer.parseInt(request.getParameter("precio"));
} catch (NumberFormatException e) {
errores.add("precio vacio o formato incorrecto");
}
int cantidad = 0;
try {
cantidad = Integer.parseInt(request.getParameter("cantidad"));
} catch (NumberFormatException e) {
errores.add("cantidad vacia o formato incorrecto");
}
if (nombre.isEmpty()) {
errores.add("nombre es requerido");
}
if (precio == 0) {
errores.add("precio es requerido");
}
if (cantidad == 0) {
errores.add("cantidad es requerida");
}
Producto producto = new Producto();

producto.setId(id);
producto.setNombre(nombre);
producto.setPrecio(precio);
producto.setCantidad(cantidad);
if (errores.isEmpty()) {
dao.guardar(producto);
String url = request.getContextPath() + "/catalogo/listado";

response.sendRedirect(url);
} else {
request.setAttribute("producto", producto);
request.setAttribute("titulo", "Validando Producto");
request.setAttribute("errores", errores);
request.getRequestDispatcher("/WEB-INF/views/form.jsp")
}
}
}
En el Servlet omitimos el uso del mtodo processRequest(request,
response y utilizamos directamente doGet(request, response) /
doPost(request, response) para manejar las peticiones.
Usamos doGet(request, response) para manejar una peticin HTTP
GET y doPost(request, response) para POST. Entonces doGet se
encarga de mostrar el formulario al usuario mientras que doPost se
encarga de procesar el formulario cuando este es enviado por el usuario.
En doGet, entonces segn si existe el parmetro id se va a buscar el
producto a la base de datos, de lo contrario se crea un nuevo objeto
producto, es decir para editar o crear un nuevo producto respectivamente,
en la base de datos usando la clase Dao.
Mientras que doPost procesa el form, recibe los datos del formulario
mediante el objeto request, luego valida que estos datos no sean vacos y
de ser as guarda/edita el producto en la base de datos, si los datos no se
validan correctamente entonces retornamos de regreso al formulario con
los mensajes de errores.
6. Estudiar vista JSP formulario.jsp

Doble clic formulario.jsp bajo catalogo-servlet-mvc-db->Web Pages-
>/WEB-INF/views->formulario.jsp

<%@page import="java.util.List"%>
<%@page import="models.entity.Producto"%>
<% String titulo = (String) request.getAttribute("titulo");

Producto producto = (Producto) request.getAttribute("producto");
List<String> errores = (List<String>) request.getAttribute("errores");%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<h3><%=titulo%></h3>
<% if (errores != null && errores.size() > 0) {%>
<ul>
<% for (String error : errores) {%>
<li style="color:red; font-weight: bold;"><%=error%></li>
<% }%>
</ul>
<% }%>
/catalogo/listado"><<volver</a>
<form method="post">
<input name="id" type="hidden" value="<%=producto.getId()%>" />
<table>
<tr>
<td>Nombre:</td>
<td><input name="nombre" type="text"
value="<%=(producto.getNombre() == null) ? "" : producto.getNombre()%>" />
</td>
</tr>
<tr>
<td>Precio:</td>
<td><input name="precio" type="text"
value="<%=(producto.getPrecio() == 0) ? "" : producto.getPrecio()%>" />
</td>
</tr>
<tr>
<td>Cantidad</td>
<td><input name="cantidad" type="text"
value="<%=(producto.getCantidad() == 0) ? "" : producto.getCantidad()%>" />
</td>
</tr>
<tr>
<td colspan="2"><input name="enviar" type="submit"
value="<%=titulo%>" />
</td>
</tr>
</table>
</form>
</body>
</html>
El formulario bien sencillo, obtenemos los atributos de producto y

errores, en caso de falla en la validacin se regresa al formulario y
mostramos estos mensajes con un foreach.
Tal como mencionamos, si se pasa el id como parmetro en la url es
para editar un producto, por lo tanto el FormController ir a la base de
datos a buscar el registro y luego los datos sern mostrados en el
formulario, listos para ser modificados.
Adems notamos que tenemos un campo input hidden llamado id, que
es justamente para enviar el id del producto de vuelta al controlador,
cuando el formulario se enva para ser procesado, de esta forma le
indicamos al mtodo guardar(producto) de la clase ProductoDaoJDBC
si tiene que hacer un insert o bien un update .

7. Estudiar la clase Java de conexin a la base de datos
Doble clic en la clase ConexionJdbc.java bajo catalogo-servlet-mvc-
db->Source Packages->util
Apoyarse con la lectura de los documento de anexos disponibles:
o anexo-jdbc.pdf y anexo-excepciones.pdf
package util;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;
public class ConexionJdbc {
private Connection conn;

private String user = "curso";
private String password = "javaee";
private String url = "jdbc:derby://localhost:1527/java_productos";
private String driverClass = "org.apache.derby.jdbc.ClientDriver";
public ConexionJdbc(String user, String password, String url,

String driverClass) {
this.user = user;
this.password = password;
this.url = url;
this.driverClass = driverClass;
conectar();
}
public ConexionJdbc() {
conectar();
}
private void conectar() {

try {
Class.forName(driverClass);
conn = DriverManager.getConnection(url, user, password);
} catch (ClassNotFoundException e) {
// TODO Auto-generated catch block
// TODO Auto-generated catch block
}
}
public Connection getConnection() {

return conn;
}
}
Resumen
En este workshop, hemos aprendido el concepto de separacin de capas usando el
patrn de Arquitectura MVC (Modelo, Vista y Controlador) en los Servlets, luego vimos
cmo utilizar y levantar el servicio de base de datos de Java, adems creamos una
base de datos con su tabla producto y finalmente hemos analizado/estudiado el cdigo
detrs de la aplicacin Catlogo MVC, utilizando Servlet como controlador y JSP como
las vistas.
Enva tus consultas a los foros!

Aqu es cuando debes sacarte todas las dudas
haciendo consultas en los foros
correspondientes


Workshop Servlet MVC

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Workshop Servlet MVC

Uploaded by

Copyright:

Available Formats

Curso: "Java EE 7 y Frameworks" 2017

Servlet MVC: Separacin de Capas

Todos los logos y marcas utilizados en este

AUTOR: Andrs Guzmn Fontecilla. 1

AUTOR: Andrs Guzmn Fontecilla. 2

Antes de empezar, cmo funciona rpidamente un MVC

El patrn MVC podra considerarse una "especializacin" de una tpica

En este nuevo diseo tendremos que todas

Nota: se recomienda la lectura de la

AUTOR: Andrs Guzmn Fontecilla. 3

Un patrn de diseo es solo eso, una gua.

Ejercicio 1: Copiar y modificar la aplicacin del Workshop anterior hola-

1. Iniciamos NetBeans IDE.

AUTOR: Andrs Guzmn Fontecilla. 4

En el campo Proyect Name ingresamos hola-mundo-servlet-mvc

AUTOR: Andrs Guzmn Fontecilla. 5

3. Expandimos el nuevo proyecto para modificar el Servlet:

4. Abrir con doble clic la clase SaludarServlet.

protected void processRequest(HttpServletRequest request,

// Creamos y obtenemos el objeto de sesin

//Asignamos un mensaje en la sesin

/* Asignamos valores a la vista jsp, mediante el contexto Request*/

request.setAttribute("titulo", "Servlet SaludarServlet");

/* El Servlet selecciona la vista saludar.jsp y

Antes que nada, podemos observar que ya NO usamos ms el objeto out

AUTOR: Andrs Guzmn Fontecilla. 7

AUTOR: Andrs Guzmn Fontecilla. 8

En File Name ingresamos saludar, para dar el nombre a la vista jsp.

AUTOR: Andrs Guzmn Fontecilla. 9

8. Modificamos el contenido que viene por defecto segn el cdigo de abajo:

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

Slo comentar que usando el mismo objeto request, pero en la vista,

AUTOR: Andrs Guzmn Fontecilla. 10

Abrir con doble clic la clase RespuestaServlet.

// Obtenemos la session creada anteriormente

//Obtenemos el mensaje, guardado en la pgina anterior

//Pasamos el mensaje de la sesion a la vista jsp

//Finalemnte destruimos la session HTTP

/* El Servlet selecciona la vista respuesta.jsp y

AUTOR: Andrs Guzmn Fontecilla. 11

AUTOR: Andrs Guzmn Fontecilla. 12

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

Clic-Derecho en el proyecto hola-mundo-servlet-mvc y seleccionar Run.

Se abre el Navegador con la ruta base y cambiamos la url a:

AUTOR: Andrs Guzmn Fontecilla. 14

AUTOR: Andrs Guzmn Fontecilla. 15

Ejercicio 2: Abrir, construir y ejecutar aplicacin catalogo-servlet-mvc:

1. Iniciar NetBeans IDE

Luego aparece la ventana Open Project y buscar el proyecto

AUTOR: Andrs Guzmn Fontecilla. 16

Finalmente se agrega el nuevo proyecto bajo la pestaa Projects

AUTOR: Andrs Guzmn Fontecilla. 17

AUTOR: Andrs Guzmn Fontecilla. 18

6. Luego muestra el detalle del producto con ID 1, recibiendo el id como parmetro

AUTOR: Andrs Guzmn Fontecilla. 19

En el siguiente paso, vamos a analizar y estudiar el cdigo detrs de

7. Doble clic en Producto.java:

public Producto(int id, String nombre, int precio) {

public int getId() {

public void setId(int id) {

public String getNombre() {

public void setNombre(String nombre) {

public int getPrecio() {