Todos los logos y marcas utilizados en este documento, estn registrados y pertenecen a sus respectivos dueos. AUTORES: andresguzf@gmail.com WEB: http://formacion-java.bolsadeideas.cl | | Servlet MVC Workshop 1
Curso: "Java EE y Frameworks" 2013
Objetivo El objetivo de esta prctica es implementar la separacin de capas usando el patrn de Arquitectura MVC (Modelo, Vista y Controlador) en Servlets utilizando NetBeans IDE.
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 AUTORES: andresguzf@gmail.com WEB: http://formacion-java.bolsadeideas.cl | | Servlet MVC Workshop 3
Curso: "Java EE y Frameworks" 2013
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->Seleccionamos Copy (ver Figura de abajo) En el campo Proyect Name ingresamos hola-mundo-servlet-mvc Clic en Copy
Desplegamos el nuevo proyecto para modificar el Servlet SaludarServlet: hola-mundo-servlet-mvc -> Source Packages - >saludar Abrir con doble clic la clase SaludarServlet. AUTORES: andresguzf@gmail.com WEB: http://formacion-java.bolsadeideas.cl | | Servlet MVC Workshop 4
Curso: "Java EE y Frameworks" 2013
Remplazamos el contenido del mtodo processRequest por el siguiente, tal como se muestra en el cdigo de abajo: protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// Get a session HttpSession session = request.getSession();
/* 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 reenvia los atributos dentro de la misma peticin HTTP */ getServletContext().getRequestDispatcher("/saludar.jsp").forward(request, response);
}
Guardamos los cambios (Ctrl + S). Ahora creamos la vista saludar.jsp: o Clic derecho en Web Pages -> New -> Other o Escoger Web bajo Categoras (Categories) y seleccionar JSP bajo File Types. o Clic en Next.
o En File Name ingresamos saludar, para dar el nombre al archivo jsp. AUTORES: andresguzf@gmail.com WEB: http://formacion-java.bolsadeideas.cl | | Servlet MVC Workshop 5
Curso: "Java EE y Frameworks" 2013
o Clic en Finish. o Ver figura de abajo.
Modificamos en contenido que viene por defecto segn el cdigo de abajo: <%@page contentType="text/html" pageEncoding="UTF-8"%>
o Desplegamos el proyecto hola-mundo-servlet-mvc para modificar el Servlet SaludarServlet: hola-mundo-servlet-mvc -> Source Packages - >saludar o Abrir con doble clic la clase ResponderServlet. o Remplazamos el contenido del mtodo processRequest por el siguiente, tal como se muestra en el cdigo de abajo:
// obtenemos el parmetro de la peticin String nombre = request.getParameter("nombre");
/* Asignamos la variable nombre a la vista jsp, mediante el contexto Request*/ request.setAttribute("nombre", nombre);
// Cierra el HttpSession request.getSession().invalidate();
/* El Servlet selecciona la vista respuesta.jsp y reenvia los atributos dentro de la misma peticin HTTP */ getServletContext().getRequestDispatcher("/respuesta.jsp").forward(request, response);
}
o Guardamos los cambios (Ctrl + S). o Ahora creamos la vista respuesta.jsp: o Clic derecho en Web Pages -> New -> Other o Escoger Web bajo Categoras (Categories) y seleccionar JSP bajo File Types. o Clic en Next.
Modificamos en contenido que viene por defecto segn el cdigo de abajo: <%@page contentType="text/html" pageEncoding="UTF-8"%> <% String nombre = (String) request.getAttribute("nombre"); %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Respuesta</title> </head> <body> <%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. Tipe su nombre en el campo (input form) y Clicel botn Submit
Ejercicio 2: Abrir, construir y ejecutar aplicacin de ejemplo catalogo-servlet-mvc: 1. Iniciar NetBeans IDE 2. Abrir el proyecto catalogo-servlet-mvc: Descargar proyecto catalogo-servlet-mvc.rar de la semana. o Windows: Descomprimir el archivo catalogo-servlet-mvc.rar bajo el directorio C:\curso\javaee\servlet, antes tener creado el directorio. o Solaris/Linux: Descomprimir el archivo catalogo-servlet-mvc.rar bajo el directorio $HOM/curso/javaee/servlet, antes tener creado el directorio. Seleccionar File->Open Project (Ctrl+Shift+O). La ventana de dilogo Open Project aparece. o Buscar proyecto descomprimido en el paso anterior en \curso\javaee\servlet Seleccionaro catalogo-servlet-mvc Clic en Open Project. El Nuevo Proyecto es agregado bajo la pestaa Projects
3. Construir y ejecutar el proyecto catalogo-servlet-mvc: o Clic-derecho en proyecto catalogo-servlet-mvc y seleccionar Run. o El navegador se abre, mostrando un listado de productos.
5. 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");
2. 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. 3. Ahora hacemos un doble clic CatalogoDbDb.java desplegando catalogo-servlet-mvc ->Source Packages->models para abrir en el editor de Netbeans: 4. Vemos una clase java que emula una base de datos, creando un listado (registros) y agregamos 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 la base de datos, consultas SQL u de otro tipo. En este caso tiene dos mtodos: obtenerTodos() y buscarProductoPorId(int id): package models;
5. Ahora veamos la clase encargada de inicializar el modelo dentro del Contexto del Servlets, doble clic CatalogoEventListener.java desplegando catalogo-servlet-mvc ->Source Packages- >controllers para abrir en el editor de Netbeans. 6. Implementa la interfaz ServletContextListener para poder Iniciar la construccin de los objetos del modelo en el inicio del ciclo de vida del sistema (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. * @author Andrs Guzmn F */ 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"); }
}
7. Veamos ahora el controlador de listado, doble clic en ListadoServletController.java bajo catalogo-servlet-mvc ->Source Packages->controllers para abrir en el editor de Netbeans. 8. En el mtodo init que se encarga de iniciar el servlet, es como el constructor, recibimos el objeto config por argumento y mediante ste obtenemos el servletContext y con esto podemos obtener objeto catalogoDb mediante el mtodo getAttribute. 9. Luego en el mtodo processRequest, utilizamos el objeto de modelo (catalogoDb) para obtener el listado y se lo pasamos a la vista, muy limpio.
/** * Processes requests for both HTTP <code>GET</code> and <code>POST</code> methods. * @param request servlet request * @param response servlet response * @throws ServletException if a servlet-specific error occurs * @throws IOException if an I/O error occurs */ protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
/* 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 reenvia los atributos dentro de la misma peticin HTTP */ getServletContext().getRequestDispatcher("/listado.jsp").forward(request, response);
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 del editor: o Fijarse en el servlet-mapping->url-pattern, donde se mapea una URL a las clases Servlets.
Enva tus consultas a los foros! Aqu es cuando debes sacarte todas las dudas haciendo consultas en los foros correspondientes AUTORES: andresguzf@gmail.com WEB: http://formacion-java.bolsadeideas.cl | | Servlet MVC Workshop 19