online shop

© Jdyb -‐ Mayo 2011

Ejemplo de Programación con Java EE

Una Tienda Online

Juan Díez-‐Yanguas Barber

Programación con Java EE 6

Juan Díez-‐Yanguas Barber Programación con Java EE Tienda Online _____________________________________________________________________________

© Jdyb -‐ Mayo 2011 2

Índice

1.-‐ PREÁMBULO 3

2.-‐ INTRODUCCIÓN 4

3.-‐ DISEÑO DEL SISTEMA 10

3.1.-‐ HERRAMIENTAS UTILIZADAS 10 3.2.-‐ PATRÓN DE DISEÑO MVC 11 3.3.-‐ DISEÑO DE LA PERSISTENCIA. PATRÓN DAO 12 3.4.-‐ DISEÑO DE FILTROS 14 3.5.-‐ ACCESO A LOS MECANISMOS DE PERSISTENCIA 14 2.6.-‐ SEGURIDAD DE LA APLICACIÓN 14

4.-‐ MODELOS DE DATOS USADOS 16

4.1.-‐ MODELO DE DATOS DE PRODUCTO 16 4.2.-‐ MODELO DE DATOS PARA EL USUARIO 17 4.3.-‐ MODELO DE DATOS PARA EL LA CESTA DE LA COMPRA 18 4.4.-‐ MODELO DE DATOS PARA LOS COMENTARIOS 19

5.-‐ CONFIGURACIÓN DE LA APLICACIÓN 20

5.1.-‐ CONFIGURACIÓN DE PERSISTENCIA EN MODO FICHERO 20 5.2.-‐ CONFIGURACIÓN DE PERSISTENCIA EN MODO DE BASES DE DATOS 22 5.3.-‐ CONFIGURACIONES MISCELÁNEAS SOBRE LA APLICACIÓN 25 5.4.-‐ CONFIGURACIÓN DEL SERVIDOR SMTP PARA EL ENVÍO DE EMAILS 26 5.5.-‐ CONFIGURACIÓN DE LAS PLANTILLAS PARA EL ENVÍO DE EMAILS 28 5.6.-‐ LIBRERÍAS NECESARIAS 29

6.-‐ FUNCIONAMIENTO EN DETALLE DEL SISTEMA 31

6.1.-‐ ESTRUCTURA DE LA APLICACIÓN 31 6.2.-‐ DIAGRAMAS DE NAVEGACIÓN DE FILTROS 36 6.3.-‐ DIAGRAMAS DE NAVEGACIÓN DE LISTENERS 38 6.4.-‐ FLUJO DE NAVEGACIÓN DE LAS OPERACIONES PÚBLICAS 39 6.5.-‐ FLUJO DE NAVEGACIÓN PARA OPERACIONES DE USUARIO REGISTRADO 46 6.6.-‐ FLUJO DE NAVEGACIÓN DE LAS OPERACIONES DEL ADMINISTRADOR 49 6.7.-‐ SOBRE EL JAVASCRIPT QUE SE HA USADO 55

7.-‐ SISTEMA DE CONTROL DE VERSIONES 58

8.-‐ ASPECTOS A MEJORAR 61


© Jdyb -‐ Mayo 2011 3

1.-‐ Preámbulo

He sido siempre un apasionado de la informática, y desde que comencé mis estudios de Ingeniería Informática esta afición por la materia ha ido creciendo progresivamente.

Actualmente he finalizado mis estudios de Ingeniería Técnica en Informática de Sistemas, los que continuaré el próximo año para proseguir con la Ingeniería Superior.

El proyecto que aquí les presento viene a ser una asignatura completa, asignatura dedicada a la programación de aplicaciones web, y esta en concreto fue impartida en Java.

Cogí desde el principio con mucho ánimo esta asignatura y poco a poco me fue gustando más. Le fui dedicando muchas horas a este proyecto hasta llegar a conseguir un ejemplo lo más realista posible de lo que pudiera ser una tienda online.

He disfrutado muchísimo realizando este proyecto no solo porque se trataba de algo nuevo sino porque he adquirido muchos e interesantes conocimientos sobre el lenguaje, si bien es cierto que me queda mucho por aprender de este lenguaje he de reconocer que esto me ha ayudado a dar un paso importante en este continuo aprendizaje.

Una vez completado el curso pensé que ya que había dedicado mucho tiempo a este proyecto podría también llegar a más personas y ser de ayuda, por lo que he seguido trabajando en el mismo para publicarlo con una documentación completa.

No puedo terminar este texto sin agradecer a Abraham Otero Quintana el interés que ha despertado en mí con este proyecto y los ánimos que me ha dado para continuar con ello hasta obtener un proyecto perfeccionado para su publicación. También le tengo que agradecer la ayuda que me ha prestado de manera totalmente desinteresada para la publicación del mismo.

Sin más me despido y espero que os sea de ayuda este documento así como el proyecto en si.

Pueden ponerse en contacto conmigo en esta dirección de correo electrónico sin problema alguno: [email protected]


© Jdyb -‐ Mayo 2011 4

2.-‐ Introducción

En este proyecto se ha tratado de llevar a cabo el diseño de una aplicación web que cumpla con las funcionabilidades de una tienda online completa.

La aplicación debe tener una interfaz de administración la cual nos permita una administración completa de los productos (añadir, modificar, borrar y consultar), también es posible la búsqueda de productos.


© Jdyb -‐ Mayo 2011 5

Para acceder a la zona de administración es necesario estar autentificado, la autentificación se realiza mediante un correo electrónico y una contraseña.

También es posible que los usuarios se registren en la aplicación con la ventaja de que no tendrán que introducir los datos completos para realizar la compra. También podrán consultar su historial de compras y por supuesto modificar sus datos.


© Jdyb -‐ Mayo 2011 6

La parte principal de la aplicación es el listado de productos donde el usuarios puede añadirlos a la cesta de la compra. El usuario podrá consultar el estado de su carrito en todo momento y podrá editar la cantidad de cada producto según desee.


© Jdyb -‐ Mayo 2011 7

Cuando el usuario quiera dar por terminada su compra tendrá que rellenar el formulario con los datos de la compra en el caso de no estar registrado. En caso contrario lo único que tendrá que hacer es seleccionar la forma de pago.

Posteriormente un correo electrónico será enviado al usuario con los detalles de la compra.

La aplicación tiene otras funcionabilidades extra a parte de las básicas de una tienda online.

Es posible añadir comentarios a los productos siendo un usuario registrado.


© Jdyb -‐ Mayo 2011 8

Es posible también asignar imágenes a los productos, el sistema está capacitado para enviar emails a los usuarios cuando se registran, cuando realizan una compra, y también tienen la opción de recuperar la contraseña en caso de pérdida; el sistema genera una nueva contraseña y es enviada por correo electrónico al usuario.


© Jdyb -‐ Mayo 2011 9

Cuenta con la opción de usar persistencia contra bases de datos así como persistencia contra ficheros en formato binario de objetos serializados.

Como ayuda a los administradores cuenta con un registro de peticiones realizadas al servidor que son guardados en una base de datos o en fichero (según sea el método de persistencia); este registro ayudará a realizar un seguimiento detallado para los administradores.

Es posible la visualización de estadísticas de ventas, esta opción estará disponible para aquellos usuarios que sean administradores de la tienda.


© Jdyb -‐ Mayo 2011 10

3.-‐ Diseño del sistema

3.1.-‐ Herramientas utilizadas

Como lenguaje de programación para la aplicación en el servidor se ha usado Java EE 6, el servidor de aplicaciones usado es GlassFish Server 3.1

Como entorno de desarrollo se ha usado NetBeans 7.0.

Para la presentación de cara al usuario se han empleado páginas JSP para la generación del código HTML que finalmente será mostrado al usuario mediante el navegador web que será el que renderice dicho código.

Gracias a este diseño se podría decir que el trabajo que hemos tenido que dedicar a la aplicación del cliente es insignificante debido a que no hemos tenido que encargarnos nosotros del desarrollo del navegador, únicamente de generar el código que este renderizará.

Esta es la principal ventaja de usar este modelo de diseño unido a que se están usando tecnologías estandarizadas.


© Jdyb -‐ Mayo 2011 11

3.2.-‐ Patrón de diseño MVC

Para el desarrollo del sistema se ha usado un patrón de diseño en el cual hay claramente diferenciadas tres partes. Por una parte nos podemos encontrar con los modelos de datos que en nuestro caso serían los objetos java que necesitamos para representar la información de nuestra aplicación, la cual estaría almacenada en una base de datos, en ficheros o en cualquier otro modo de persistencia.

Por otra parte tenemos las vistas que serían las páginas que se encargan de la presentación al usuario. Estas páginas estarían formadas por las páginas estáticas HTML y las páginas dinámicas JSP.

Por último tendríamos la parte del controlador que sería la encargada de realizar las acciones necesarias para nuestro modelo de negocio. Esta parte realizará unas acciones y de manera general posteriormente decidirá la vista que se desea presentar al usuario, como ya se ha dicho esta parte se encarga de las operaciones necesarias por el modelo de negocio y por lo tanto será esta parte la que reciba las acciones por parte del usuario.

Usuario

if(conn SELEC WHERE print

Servlet Java EE

VB

Java

HTML

VB

JSP

Modelos de vista

Base de datos

Objetos Java

Controlador

Acciones del usuario

Actualizar modelo

Seleccionar vista

Consultas al modelo


© Jdyb -‐ Mayo 2011 12

3.3.-‐ Diseño de la persistencia. Patrón DAO

A continuación usaremos el patrón de diseño que se ha usado para el mecanismo de persistencia de la aplicación.

Este patrón trata de independizar el tipo de persistencia del resto de la aplicación, de esta manera la aplicación no tiene dependencia del tipo de persistencia que se este llevando a cabo.

Por poner un ejemplo, podemos estar desarrollando la aplicación con persistencia contra ficheros y posteriormente decidir que lo queremos hacer contra base de datos y no habría que cambiar nada de la lógica de negocio de la aplicación, únicamente habría que implementar los métodos necesarios para persistir contra la base de datos.

Explicamos a continuación en que consiste este patrón de diseño.

En primer lugar tendríamos una interfaz que indicaría los métodos que son necesarios en la persistencia (los métodos a los que se llamarán después para acceder a la persistencia).

Por cada método de persistencia tendríamos una clase que implementa todos y cada uno de los métodos de la interfaz. Para asegurarnos de que no se crea más de una de estas clases durante el desarrollo de la aplicación deberíamos hacer que estas clases sigan un patrón de diseño singleton (explicado posteriormente).

Por último tendríamos una factoría que dependiendo de los argumentos, en nuestro caso parámetros del descriptor de despliegue, nos devolvería una instancia de la clase encargada de la persistencia (dependiendo de los argumentos para el tipo de persistencia).

Para acceder a la persistencia no tendríamos mas que acceder mediante la interfaz a los métodos y de esta manera el modelo de negocio de la aplicación es totalmente independiente del tipo de persistencia.

El patrón de diseño singleton consiste en crear un constructor para la clase que solo permita que haya una única instancia de la clase en la aplicación. Esto se haría haciendo un constructor que compruebe si hay o no una instancia de la clase en la aplicación, si la hay devolvería es misma instancia, en caso contrario se crearía una nueva instancia.

La forma de controlar las instancias existentes es hacer que la propia clase contenga en sus atributos una instancia de ella misma.

Mostramos a continuación un diagrama de clases en el que se muestran las dependencias de cada una de estas clases.


© Jdyb -‐ Mayo 2011 13

StartListener

private boolean startValidate(ServletContext context)

public void contextDestroyed(ServletContextEvent sce)

private persistence: PersistenceInterface

public void contextInitialized(ServletContextEvent sce)

beans.Producto

beans.Usuario

beans.Comentario

beans.Carrito

Modelo de persistencia. Patrón DAO

persistencia.PersistenceInterface

public boolean delProduct(String codigo)

public boolean delUser(String mail)

public boolean addProduct (Producto prod)

public boolean addUser (Usuario user)

public boolean init (String locationUser, String locationProduct);

public boolean exit ()

public Usuario getUser (String mail)

public int anyAdmin ()

public boolean updateProduct (String codigo, Producto prod)

public boolean updateUser (String mail, Usuario user)

public Producto getProduct (String codigo)

public boolean saveCart (Carrito cart, boolean completado, String date, String formPago)

public boolean saveRequest (String fechaHora, String requestedURL, String remoteAddr, String remoteHost, String method, String param, String

userAgent)

public Map<String, Producto> searchProd(String campo, String term)

public Map <String, Usuario> getUsers ()

public Map <String, Producto> getProducts()

public boolean newComment (Usuario user, String codigoProducto, String codigoComentario,

String fechaHora, String comentario)

public ArrayList <Producto> getDetailsCartRecord (String codigo)

public ArrayList <Carrito> requestSalesRecord (String campo, String term)

public boolean deleteImcompleteCartsClient (String mailClient)

public boolean saveCart (Carrito cart, boolean completado, String date, String formPago)

public Carrito requestLastIncompleteCart (String mail)

public boolean updateComment (String codComentario, Comentario comentario)

public boolean deleteComment (String codigoComentario)

public Comentario getComment (String codComentario)

public LinkedList <Comentario> getComentarios (String campo, String valor)

persistencia.PersistenceFactory

public static PersistenceInterface getInstance (String type)

persistencia.PersistenceFile

lockProductos: Object

usuarios: Map<String, Usuario

productos: Map<String, Producto>

fileNameProduct: String

persistence: PersistenceFile

fileNameUser: String

lockUsuarios: Object

persistencia.PersistenceBD

instance: PersistenceBD

pool: DataSource

nameBD: String

logger: Logger

private ArrayList <String> requestIncompleteCarts (String mail)


© Jdyb -‐ Mayo 2011 14

3.4.-‐ Diseño de filtros

En este apartado veremos algunos aspectos del diseño de la aplicación que considero de interés aparte de los ya explicados en los apartados anteriores.

Hay un filtro que recoge todas las peticiones y se encarga de registrar cada una de las peticiones, en este filtro de setean tanto la respuesta como la petición con la codificación que usa toda la aplicación; de esta manera nos aseguramos de que toda la aplicación este funcionando en la misma codificación para evitar problemas. Ahora bien, esto no nos asegura de que el resto de cosas externas sigan en la misma codificación (UTF-‐8), como pueden ser las bases de datos u otros recursos externos que se usen en la aplicación.

La autentificación de la aplicación está basada en el uso de filtros. Hay un filtro que nos permite acceder a la zona de usuarios registrados de la aplicación (dependiendo de los atributos de la sesión) y un filtro posterior que verifica que podamos acceder a la zona de administración, zona a la que solo deben acceder los usuarios con suficientes permisos.

3.5.-‐ Acceso a los mecanismos de persistencia

Respecto al modelo de persistencia que se ha comentado se podría añadir que para acceder a las funciones de la persistencia lo que se realiza es obtener siempre la interfaz que se guardó en el contexto de la aplicación al inicio de la misma con un listener de inicio de contexto.

2.6.-‐ Seguridad de la aplicación

La aplicación ha sido diseñada prestando mucha atención a los aspectos de seguridad de la misma, no se ha tenido absolutamente ninguna idea preconcebida a la hora del diseño de la misma, se ha partido del pensamiento de que todo ha de ser validado.

En primer lugar se ha optado por la opción de eliminar las contraseñas de las bases de datos, la aplicación no contiene ninguna contraseña, en ningún momento son guardadas. Lo que se almacena es una huella de la contraseña mas una pequeña cadena fija para que sea resistente también a los ataques por diccionario a la base de datos en busca de huellas conocidas. Cuando el usuario introduce una contraseña se seguiría se obtendría la huella de la misma y lo que se compara serían las dos huellas. Sin asegurarlo totalmente podría afirmar que la única forma de que un usuario se hiciera con la contraseña de otro sería teniendo un sniffer en la red de la víctima


© Jdyb -‐ Mayo 2011 15

(puesto que la aplicación no funciona sobre https), otra opción sería intentar robar la sesión de alguna manera, pero así no se conseguiría la contraseña del usuario, sino acceso a su sesión por un periodo limitado de tiempo.

Otro aspecto importante en la seguridad son todas las entradas de datos que ser reciben del usuario tanto de formularios como de cualquier tipo de petición que tenga que atender el servidor, no se debe dar por supuesto nada.

En todos los formularios que recibe la aplicación lo primero que se hace con ellos es verificar que contengan los parámetros que deseamos (dependiendo del formulario concreto), y posteriormente todos los parámetros recibidos son validados con la librería ESAPI mediante expresiones regulares, evitando de esta manera intentos de Cross Site Scripting o de inyección SQL. También son validados todos aquellos campos que deben permitir cualquier texto (como puede ser el caso de los comentarios) en busca de cualquier etiqueta HTML sospechosa y también se contemplan los ataques usando codificaciones diferentes.

Posteriormente una vez validados cada uno de los parámetros se analiza cada uno de ellos para verificar que tengan sentido, no se permiten números negativos, no se permite eliminar al último administrador, no se permite subir un archivo que no sea una imagen y como tamaño máximo 8mb.

A la hora de construir el sistema se ha construido con una idea final en mente que es procurar en la medida de lo posible o en todos los casos si es posible que la aplicación fallase por el uso incorrecto de los usuarios o el intento de introducción de datos erróneos en formularios o intento de “jugar” con las URLs de la aplicación. Con esto quiero decir que para cada acción que realiza la aplicación primero se comprueba si es posible realizarla. Por ejemplo, no se puede borrar un administrador si es el único que hay, no se pueden comprar mas unidades de las que tiene un producto, no se puede borrar o editar un producto o usuario que no existe.


© Jdyb -‐ Mayo 2011 16

4.-‐ Modelos de datos usados

En este apartado se explicarán los modelos de datos que han sido usados para representar todos los datos con los que trabaja la aplicación.

4.1.-‐ Modelo de datos de Producto

Con esta clase se pretender representar un producto de la tienda con todos los atributos que contiene, estos atributos serán los requeridos por el enunciado.

• Código (Creado de manera automática usando UUIDs)

• Nombre

• Precio

• Stock

• Descripción corta

• Detalles

Se presenta a continuación un diagrama UML representando la clase.

Producto

public String getCodigo()

public int getStock()

public double getPrecio()

public String getNombre()

public String getDetalles()

public String getDesc()

Producto

detalles:String

desc: String

stock: int

precio: double

codigo: String

nombre: String

public Producto(String codigo, String nombre, double precio, int stock,

String desc, String detalles)

public Producto(String codigo, String nombre, double precio, int stock)

public Producto () public String getDisponibilidad ()


© Jdyb -‐ Mayo 2011 17

Como se puede observar en el diagrama UML no hay ningún método en esta clase que permita modificar el producto por lo que se puede decir que las instancias de esta clase serán inmutables, una vez creados los objetos no será posible modificar los mismos. Se ha hecho de esta manera para evitar problemas de concurrencia.

Si los objetos no son inmutables sería posible por ejemplo que un usuario que esta comprando cambiara las unidades de un producto mientras que el administrador cambie las unidades del mismo producto.

4.2.-‐ Modelo de datos para el usuario

Con esta clase se pretende representar un usuario dentro de la tienda online. Cada objeto de la clase tendrá los siguientes siguientes atributos.

• Nombre

• Dirección

• Email (identificador único)

• Contraseña (MD5 de la contraseña)

• Permisos (‘a’ Administrador, ‘c’ Cliente normal)

A continuación de puede observar un diagrama UML representando la clase.

Usuario

Usuario

public Usuario ()

permisos: char

pass: String

mail: String

nombre: String

dir: String

public Usuario(String nombre, String dir, String

mail, String pass, char permisos)

public String getDir()

public String getMail()

public String getPass()


public char getPermisos()

public String getPrintablePermissions ()


© Jdyb -‐ Mayo 2011 18

4.3.-‐ Modelo de datos para el la cesta de la compra

Con esta clase se pretende representar la cesta de la compra de un usuario. El carrito de la compra tiene los siguientes atributos.

• Código del carrito

• Email del usuario

• Mapa de productos que contiene los productos añadidos al carro

• Precio del carro completo

• Fecha de la compra

• Hora de la compra

• Forma de pago de la compra

Carrito

Carrito

hora: String

fecha: String

precio: double

articulos: Map <String, Integer>

codigo: String

user: String

formPago: String

public Carrito ()

public Carrito(String codigo, String user, double precio)

public Carrito(String codigo, String user, double precio, String fecha, String hora,

String formaPago)

public Carrito(String codigo, String user)

public boolean editCant (String prod, int cantidad,

double prodPrice)public void delProduct

(String prod)public int getLenght ()

public Map <String, Integer> getArticulos ()

public String getCodigo()

public String getUser()public double getPrecio () public void setArticulos

(Map<String, Integer> articulos)

public String getFormaPago()

public void setPrecio (double price public String getHora()

public String getFecha() public void setUser(String user)

public void addProduct (String newProd, int

cantidad, double prodPrice)

public void removeProd(String prod, double

prodPrice)


© Jdyb -‐ Mayo 2011 19

4.4.-‐ Modelo de datos para los comentarios

Con esta clase se pretende representar un comentario añadido por un usuario a un producto del catálogo de la tienda. Un comentario se representa con los siguientes atributos.

• Código del comentario

• Fecha

• Hora

• Código del producto

• Email del usuario

• Nombre del usuario

• Texto del comentario

Comentario

Comentario

nombre: String

Email: String

codigoProducto: String

hora: String

codigoComentario: String

fecha: String

comentario: Stringpublic String getHora()

public String getFecha()

public String getComentario()

public String getCodigoProducto()

public Comentario(String codigoComentario, String fecha, String hora, String codigoProducto, String

Email, String nombre, String comentario)

public String getCodigoComentario()

public String getEmail()

public String getFechaHora ()



© Jdyb -‐ Mayo 2011 20

5.-‐ Configuración de la aplicación

En este capítulo se van a describir diferentes aspectos de configuración de la aplicación necesarios para poder desplegar la aplicación correctamente.

5.1.-‐ Configuración de persistencia en modo fichero

Es posible que la aplicación funcione con persistencia contra ficheros. Para que funcione correctamente es necesario configurar una serie de parámetros en el descriptor de despliegue de la aplicación.

Lo primero que tenemos que hacer es indicar que la persistencia de la aplicación va a funcionar contra ficheros. Para ello tenemos que configurar el parámetro de contexto persistenceMethod. El valor que debe tener este parámetro para que funcione con ficheros es file.

Posteriormente lo que tendremos que hacer es configurar la ruta de los ficheros, si únicamente pone el nombre del fichero se guardaran en el directorio del dominio del servidor de aplicaciones. Los archivos van a ser cargados usando directorios del sistema, no se van a emplear métodos de contexto o del classpath para cargarlos.

La ruta del fichero que contiene los datos de productos y usuarios viene dado por el parámetro de contexto archivoDatos. Es un fichero de tipo binario.

La ruta del fichero que contiene el historial de carritos viene dada por el parámetro de contexto archivoHistoriales. Es un fichero de tipo binario

La ruta del fichero que contiene carritos sin comprar que son guardados para ser recuperados al inicio de la sesión de los usuarios viene dada por el parámetro de contexto archivoRecuperacion. Es un fichero de tipo binario.


© Jdyb -‐ Mayo 2011 21

La ruta del fichero de registro de acciones viene dada por el parámetro de contexto archivoLog. Es un fichero de texto plano.


© Jdyb -‐ Mayo 2011 22

5.2.-‐ Configuración de persistencia en modo de bases de datos

La aplicación también está preparada para que la persistencia funcione contra bases de datos, para ello se emplea un pool de conexiones que es necesario configurar en el servidor de aplicaciones, y en el descriptor de despliegue.

La aplicación se ha desarrollado con una base de datos MySQL, para preparar la base de datos para la aplicación se incluye junto con este documento un export de la base de datos completa.

A continuación se muestran los datos que son necesarios para configurar el pool de conexiones

• Nombre del recurso: el que se desee.

• JNDI: jdbc/OnlineShop (el nombre que será usado en el descriptor de despliegue)

• Motor de bases de datos: MySQL

• Nivel de aislamiento de las transacciones: READ-‐COMMITED

• Puerto: 3306 (puerto por defecto de mySQL)

• Nombre de la base de datos

• URL: jdbc:mysql://HOSTBASEDATOS

• Nombre del servidor

• Usuario

• Contraseña

Para que el pool de conexiones funcione es necesario incluir el conector de la base de datos en los directorios del servidor de aplicaciones. El conector para MySQL lo puede descargar desde la página web oficial.

http://www.mysql.com/downloads/connector/j/

Una vez descargado debe incluir el archivo jar del conector en el directorio del servidor de aplicaciones. En el caso de GlassFish será el siguiente.

glassfish-‐3.1/glassfish/lib

Una vez se ha configurado el servidor de aplicaciones hay que pasar a configurar la aplicación.


© Jdyb -‐ Mayo 2011 23

En primer lugar es necesario configurar el modo de persistencia en el descriptor de despliegue.

En segundo lugar hemos de configurar el nombre del recurso JNDI y posteriormente el nombre de la tabla. Para ello se usan parámetros del contexto que fueron usados para la persistencia en modo de fichero.

También es necesario configurar el recurso en el descriptor de despliegue.

Por último se ha de configurar el recurso en el descriptor de despliegue específico del servidor de aplicaciones. En el caso de GlassFish se haría como se puede ver aquí.

A continuación se muestran las sentencias SQL necesarias para crear las tablas necesarias de la base de datos.


© Jdyb -‐ Mayo 2011 25

5.3.-‐ Configuraciones misceláneas sobre la aplicación

Si la aplicación no encuentra un usuario administrador automáticamente lo creará partiendo de una serie de parámetros del descriptor de despliegue. Es necesario tener en cuenta que debido a que existen validaciones de datos en la aplicación los datos introducidos tendrán que ser datos válidos.

Es posible configurar la caducidad de la sesión de usuario en minutos, esto indica el tiempo en el que si la sesión está inactiva se cerrará de manera automática.

Sobre el contexto de la aplicación es necesario indicar que está preparada para funcionar sin contexto directamente sobre la raíz del servidor de aplicaciones debido a que todas las rutas usadas en la aplicación se dan a partir de la raíz del servidor. Si se configurara un contexto habría que configurar de nuevo todas las rutas de la aplicación. Este parámetro de configuración lo encontramos en el descriptor de despliegue propio del servidor de aplicaciones. Mostramos como se haría para GlassFish.

También es necesario que la carpeta setup de la aplicación este añadida al classpath de ejecución de la máquina virtual.

En esta carpeta se encuentran ficheros de configuración de las librerías de validación y las plantillas de los emails que son enviados.


© Jdyb -‐ Mayo 2011 26

5.4.-‐ Configuración del servidor SMTP para el envío de emails

La aplicación permite el envío de emails a los usuarios cuando son registrados con sus datos de registro, también cuando una compra es realizada detallándose en el mismo los detalles de la compra y por último también admite la posibilidad de recuperación de la contraseña de los usuarios en caso de olvido.

Para el envío de los emails es necesario configurar un servidor SMTP y será configurado desde el descriptor de despliegue de la aplicación mediante los parámetros de contexto. Los parámetros con los que viene configurado son plenamente funcionales.

• hostMail: Host del servidor SMTP

• TSLMail: Si el servidor permite o no cifrado TSL

• mailPort: Puerto del servidor SMTP

• mailUser: Usuario con el que es necesario iniciar sesión para enviar los correos


© Jdyb -‐ Mayo 2011 27

• authMail: Si es necesaria o no la autentificación para el envío de mensajes

• mailFrom: Dirección de email del remitente que aparecerá en los correos enviados

• mailPass: Contraseña del servidor SMTP

A continuación se muestra un ejemplo de configuración en el descriptor de despliegue de la aplicación.


© Jdyb -‐ Mayo 2011 28

5.5.-‐ Configuración de las plantillas para el envío de emails

Existen plantillas personalizables para el envío de emails. Las podemos encontrar en la carpeta setup que como hemos dicho debe de estar añadida al classpath de la máquina virtual de java.

En primer lugar encontramos la plantilla con nombre plantillaCompra.html. Esta plantilla será usada para el envío de emails detallando los detalles de la compra.

Usted decide la información que desea incluir en la plantilla con las siguientes claves, donde usted ponga los siguiente códigos será donde aparezca en el email la información correspondiente.

• &LISTA: Aquí aparecerá una tabla detallando la lista de productos siguiendo los estilos css .headerTable y .contentTable que indican el estilo de la cabecera y el contenido respectivamente

• &TOTAL: Aquí aparecerá el total de la compra en euros y con dos decimales.

• &NAME: Nombre del cliente

• &EMAIL: Email del cliente

• &DIR: Dirección del cliente

• &FORMPAGO: Forma de pago escogida por el cliente

La plantilla de envío de recuperación de contraseña está bajo el nombre plantillaRecuperarPass.html. Se detallan a continuación los códigos para la inclusión de datos.

• &NAME: Nombre del cliente

• &EMAIL: Email del cliente

• &PASS: Nueva contraseña para el cliente

La plantilla de registro para los usuarios esta bajo el nombre plantillaRegistro.html. Se detallan a continuación los códigos para la inclusión de datos.

• &NAME: Nombre del cliente elegido para el registro


© Jdyb -‐ Mayo 2011 29

• &EMAIL: Email del registro

• &DIR: Dirección del cliente para el registro

5.6.-‐ Librerías necesarias

En este capítulo vamos a detallar cuales son las librerías que han sido usadas en el desarrollo de la aplicación.

Podemos encontrar las librerías necesarias en la carpeta lib.

ESAPI 2.0GA Librería usada para la validación de entradas de usuario está situado dentro de la carpeta lib y necesita las librerías que están incluidas en la carpeta esapi-‐required.

Los ficheros de configuración necesarios para esta librería se encuentran en la carpeta setup que como hemos indicado hay que añadirla al classpath.

• ESAPI.properties: Fichero principal de configuración de ESAPI

• validation.properties: Fichero de configuración para las expresiones usadas en la validación

• antisamy-‐slashdot-‐1.4.3.xml: Fichero de validación de HTML para HTML que pueda introducir el usuario

JFreeChart 1.0.13 es la librería que se ha usado para generar las gráficas de estadísticas, situada en la carpeta lib y requiere la librería Jcommon 1.0.16 también situada en la carpeta lib.


© Jdyb -‐ Mayo 2011 31

6.-‐ Funcionamiento en detalle del sistema

En este apartado se va a detallar el flujo de navegación de cada una de las operaciones que se pueden realizar y de esta manera comprender mejor su funcionamiento.

6.1.-‐ Estructura de la aplicación

En el presente apartado vamos a ver como se ha organizado la aplicación en directorios según las funciones de cada Servlet, clase java o vista JSP.

Mostramos en primer lugar la organización de Servlets y clases en los diferentes paquetes.

Mostramos a continuación la organización de vistas de la aplicación.


© Jdyb -‐ Mayo 2011 32

En primer lugar podemos observar como tenemos un paquete control.admin, al igual que en las vistas también lo hay, dentro de la carpeta admin podemos encontrar también una carpeta administration. Dentro del paquete control.admin de archivos java también se encuentra un directorio que no se ve también llamado administration,


© Jdyb -‐ Mayo 2011 33

podemos observar que existe este directorio en el descriptor de despliegue en la configuración de los Servlets.

La función que cumple el directorio admin es almacenar en el mismo las acciones de administración, pero sólo aquellas que se puedan llevar a cabo siendo usuario registrado pero sin permisos de administrador. La entrada a este directorio se comprueba con el filtro AdminFilter definido en el descriptor de despliegue de la aplicación.

En el directorio administration es donde se encuentran todas las acciones que se pueden llevar a cabo siendo administrador, que son todas aquellas que se refieren a la administración de la tienda. La entrada en esta zona es comprobada por el filtro AdministrationFilter, este filtro solo comprueba si el usuario es administrador o no lo es, no es necesario que compruebe la autentificación del usuario debido a que ya ha sido comprobada por el filtro AdminFilter el cual se encuentra antes que este.

También podemos observar el paquete modelo, en el cual se encuentran los beans utilizados en la aplicación. Dentro del mismo encontramos las clases que representan un carrito de la compra, un comentario, un usuario o un producto.

Dentro de paquete control encontramos diferentes Servlets y clases usados para realizar diferentes funciones de la aplicación, será explicada cada uno de ellos en detalle posteriormente.

Podemos observar también el paquete persistencia en el cual se encuentran las clases necesarias que se describieron anteriormente, todas ellas juntas forman el patrón DAO de la aplicación.

Por último podemos observar el paquete control.productos, todo lo que hay dentro de este paquete es accesible mediante la ruta /shop que si observamos hay una carpeta que se llama así en las vistas de la aplicación. Todo lo que se encuentra dentro de este directorio hace las funciones necesarias para la compra y todas aquellas acciones a realizar con los productos, eso sí, únicamente aquellas acciones públicas.

Pasemos a ver ahora la estructura organizativa de las vistas de la aplicación. En primer lugar comentar que todas las vistas son páginas dinámicas JSP, no hay contenido estático html.

Como ya hemos visto anteriormente teníamos las carpetas admin y administration, que ya se ha comentado que tipo de funciones agrupaban.

Posteriormente observamos la carpeta css, en la cual podemos encontrar la hoja de estilos de la aplicación, todas las vistas de la aplicación usan esta hoja de estilos. También podemos encontrar dentro de esta carpeta la hoja de estilos que aplicada sobre los formularios a la hora de la validación mediante JavaScript.


© Jdyb -‐ Mayo 2011 34

Observamos una carpeta llamada images, dentro de esta carpeta se guardarán todas las imágenes que use la aplicación, dentro de la misma habrá varias carpetas.

La carpeta icons contiene los iconos que se usan en la aplicación, como por ejemplo puede ser el carrito de la compra.

Posteriormente vemos la carpeta products que contiene las imágenes de los productos, cada una de ellas tiene como nombre el código del producto al que pertenece.

Observamos la carpeta stats la cual contiene todas las imágenes referentes a las estadísticas gráficas de la aplicación. Las estadísticas gráficas serán generadas y almacenadas en esta carpeta y serán posteriormente mostradas al usuario.

Por último la carpeta template, la cual contiene todas las imágenes utilizadas por la plantilla de la aplicación.

Posteriormente vemos en la raíz de la aplicación el home, la página de login y la página de acerca de.

Después podemos encontrar la carpeta scripts, dentro de la cual podemos encontrar todos los documentos javascript usados en la aplicación.

Dentro de esta carpeta observamos el documento jquery-‐1.6.1.js, que es la librería jquery necesaria para usar otros plugins que se han usado que se verán a continuación.

El documento scripts.js incluye una serie de funciones creadas para no tener que escribirlas directamente en las páginas jsp sino solo tener que llamar a estas funciones. Por ejemplo, podemos encontrar dentro de este documento la función necesaria para cargar el editor de textos tiny-‐mce.

Posteriormente encontramos la carpeta tiny_mce en la que se encuentran todos los elementos del plugin tiny-‐mce.

Finalmente observamos el documento vanadium.js que es el la librería usada para las validaciones de javascript. Este documento ha sido modificado para dar los mensajes en español y también se han modificado algunas de las expresiones regulares de validación y se han añadido otras.

Observamos la carpeta shop que contiene las vistas de las acciones a realizar referentes a las acciones con los productos y con la compra, siempre y cuando sean públicas.

Posteriormente tenemos la carpeta WEB-‐INF, en la cual se encuentran aquellas páginas a las que no deseamos que el usuario llegue directamente, tiene varias


© Jdyb -‐ Mayo 2011 35

carpetas dentro y en su raíz el descriptor de despliegue y el fichero de configuración específico del servidor de aplicaciones usado (GlassFish 3.1).

Encontramos en primer lugar la carpeta admin que contiene la página de logout, a la cual tiene lógica que no se llegue sin realizar esa acción en concreto, también tiene la página de pre-‐visualización de producto que es usada al editar y añadir productos y tiene lógica que solo se llegue a esta página a través de dichas acciones.

Encontramos la carpeta include que contiene páginas jsp que van a ser incluidas en las vistas de la aplicación, a estas páginas no se debe llegar, solo deben ser incluidas en el cuerpo de otras páginas jsp.

Dentro de esta carpeta podemos encontrar el header de la aplicación que contiene el menú superior y la barra superior, también encontramos el footer o pie de página de la misma, observamos también una página llamada resultados que es la encargada de mostrar los resultados de las acciones realizadas y esta es incluida en todas las páginas jsp que esperan recibir mensajes de los resultados de las acciones. Encontramos también en este directorio el menú de la aplicación tanto para la sección de administración como para el resto de las secciones (menu, menuAdministracion). Por último encontramos el módulo de comentarios de la aplicación que será el que es incluido en la página de visualización de producto para que muestre los comentarios de los productos.

Finalmente encontramos un directorio que contiene las páginas de error (paginasError) de la aplicación, a las cuales no se debe llegar salvo que haya ocurrido el error pertinente.


© Jdyb -‐ Mayo 2011 36

6.2.-‐ Diagramas de navegación de filtros

En este apartado mostraremos los diagramas de navegación referentes a los filtros para evitar mostrarlos en los diagramas de navegación de todas las acciones por claridad.

Todas las peticiones

LogFilter.java Destino

VB

Java

Guarda registro de

petición

Peticiones dirigidas a /admin/*

LogFilter.java AdminFilter.java

Destino

restricted.jsp

Autentificado

VB

JSPSin

autentificar

VB

Java

VB

Java


© Jdyb -‐ Mayo 2011 37

Peticiones dirigidas a /admin/administration/*

LogFilter.java AdminFilter.java

AdministrationFilter.java

restricted.jsp

VB

JSPSin autentificar

Autentificado

Destino

VB

Java

VB

Java

VB

Java

VB

JSP

/admin/index.jsp

Administrador

Usuario registrado


© Jdyb -‐ Mayo 2011 38

6.3.-‐ Diagramas de navegación de listeners

En este apartado detallamos los diagramas de navegación para los listeners de la aplicación.

Listener de inicio de contexto


StartListener.java

Despliegue de la aplicación

/index.jsp

VB

JSP

VB

Java

RuntimeException

Persistencia cargada

Error inicializando persistencia

Listener de sesión

Sesión caducada o cerrada


SaveSessionListener.java

Guarda carrito que no

se ha confirmado

Si es usuario autentificado y tiene carro sin comprar

Destino

Continua el flujo normal de navegación

Si no es usuario registrado; o si lo es pero no tiene carro. Continua el

flujo normal


© Jdyb -‐ Mayo 2011 39

6.4.-‐ Flujo de navegación de las operaciones públicas

En este apartado se verá el flujo de navegación de las operaciones que se pueden realizar en la tienda de manera pública.

En estos diagramas podremos ver cuadros en los que pone GET y POST, esto indica las acciones que se realizarán en caso de acceder a los servlets mediante un verbo u otro de los métodos http.

Para este primer diagrama vamos a mostrar como se sigue el diagrama con capturas de pantalla para que se tome como ejemplo para entender el resto de los diagramas.

Añadir producto al carrito

Listado de productos <script var a= var xl if(xls

AddCarritoServlet

VB

Java

Añade el producto al carro si corresponde

Caso de error añade un mensaje a la

petición

Error 404

Si el error es formulario

incorrecto o petición POST

/shop/products.jsp

VB

JSP


© Jdyb -‐ Mayo 2011 40

Para borrar un producto de la cesta se seguiría el mismo mecanismo con la salvedad de que la cantidad que se pediría son cero unidades.

Actualizar unidades de un producto en el carrito

Listado de productos en el carrito

/shop/products.jsp

VB

JSPSi la sesión no contiene carrito

<script var a= var xl if(xls

EditAmountServlet

VB

Java

Error 404

Formulario incorrecto

Actualiza el carro si las

comprobaciones son positivas

Si hay error en las comprobaciones se

añade mensaje

/shop/cart.jsp

VB

JSP


© Jdyb -‐ Mayo 2011 41

Borrar el carrito de la compra (vaciarlo)



DeleteCartServlet

VB

Java

/shop/cart.jsp

VB

JSP

Validar carrito de la compra (paso previo a la compra)


/shop/cart.jsp

VB

JSP


UpdateCartServlet

VB

Java

Listado de productos

VB

JSP

/shop/products.jsp

Si no hay carrito en la sesión

Formulario de venta

Si se han hecho cambios en el

carrito se avisa

/shop/buycart.jsp

VB

JSP

Si no es la operación de venta

definitiva

GET

POST

Error 404


© Jdyb -‐ Mayo 2011 42

Es importante destacar de este diagrama el paso previo antes de la compra por el Servlet UpdateCartServlet, es posible que el que lo vea se pregunte porque pasa antes por aquí que por el Servlet que realmente realiza la compra. Se ha diseñado así por cuestiones de rendimiento. El Servlet que realiza la compra comprueba si las unidades son correctas o no y edita el catálogo, pero estas operaciones las realiza de manera sincronizada y pidiendo locks, por lo que el rendimiento de la aplicación disminuiría significativamente en el caso de que hubiera muchos hilos concurrentes ejecutando el Servlet de compra.

Por ello se ha implementado el primer Servlet, en el que se realizan esas operaciones (sin editar productos) pero no son sincronizadas y de esta manera

Realizar la compra

Formulario de venta

/shop/buycart.jsp

VB

JSP


UpdateCartServlet

VB

Java Si se han hecho cambios en el

carrito se avisa

Listado de productos

VB

JSP

/shop/products.jsp

Si no hay carrito en la sesión


BuyServlet

VB

Java Error 404

GET

POST

Fallos o cambios en el carrito Compra exitosa

Registro de la compra

Enviar Email

Compra realizada

POST

/shop/buyinformation.jsp

VB

JSP


© Jdyb -‐ Mayo 2011 43

evitamos que todas las peticiones lleguen al servlet que realiza la compra. Se podría decir que de esta manera reducimos las peticiones que llegan al servlet de compra y las que llegan al mismo tienen un porcentaje de acierto mayor a la hora de completar la compra con éxito.

También es importante este paso previo antes de la compra porque ese servlet también realiza una actualización del precio del carrito por si algún producto cambió el precio en el periodo de tiempo en el que ha estado ese producto en el carrito. De esta manera aseguramos que el precio que se paga por el carrtito es el actual.

Busqueda de productos

Busqueda

VB

JSP

/shop/products.jsp


SearchProductServlet

VB

Java GET

Error 404POST

Sin parámetros de vueltaCorrecto

Buscar productos


© Jdyb -‐ Mayo 2011 44

Registro de usuarios

Registro

/login.jsp

VB

JSP GET

Error 404

Ante errores hay mensajes

Registro correcto

Nuevo usuario

Enviar email registro

POST

Inicio de sesión

Inicio de sesión

Login

VB

JSP GET

Error 404POST


AuthServlet

Errores en la autentificación

Autentificación correcta

Inicio de sesión manual

Inicio de sesión después de un error

Inicio

/index.jsp

VB

JavaVB

JSP

Página a la que se intentó acceder y dio error


© Jdyb -‐ Mayo 2011 45

Recuperación de contraseña

Inicio de sesión

/login.jsp

VB

JSP


PassRecoverServlet

GET

Error 404

VB

Java

POST

Error en el proceso

Proceso correcto

Envio email para recuperar la contraseñaActualizar

contraseña


© Jdyb -‐ Mayo 2011 46

6.5.-‐ Flujo de navegación para operaciones de usuario registrado

En este apartado se va a detallar el flujo de navegación para las operaciones que pueden realizar los usuarios registrados (no administradores).

Cambio de contraseña

Cambio de contraseña

/admin/preferences.jsp

VB

JSP


ChangePassServlet

GET

Error 404

POST

Error en el proceso

Proceso completado

Actualizar datos


LogOutServlet

No se encuentra el usuario de la sesión

/WEB-INF/admin/

logout.jsp

VB

JSP

VB

Java

VB

Java


© Jdyb -‐ Mayo 2011 47

Cambiar los datos personales

Cambio de datos personales


EditUserServlet

/admin/preferences.jsp

VB

JSP

VB

Java

GET

Error 404

POST

Error en el proceso

Proceso completado

Actualizar datos

Añadir comentario al producto

Añadir comentario <script var a= var xl if(xls

AddCommentServlet

VB

Java

VB

JSP

/shop/viewprod.jsp?

prod=

GET

Error 404

POST

Error en el proceso

Proceso completado

Guardar datos


© Jdyb -‐ Mayo 2011 48

Cerrar sesión

Cerrar sesión <script var a= var xl if(xls

LogOutServlet

La sesión se cerro por un error

Sesión no iniciada

Cierre normal

/WEB-INF/admin/logout.jsp

/logout

VB

JSP

VB

JSPLogin

Login

VB

JSP

/login.jsp

/index.jsp

VB

JSP

VB

Java


© Jdyb -‐ Mayo 2011 49

6.6.-‐ Flujo de navegación de las operaciones del administrador

En este apartado veremos en detalle como es el flujo de las operaciones que puede realizar un usuario de la tienda con permisos de administrador.

Añadir producto al catálogo

1 -----2 -----3 -----

Añadir al catálogo POST<script var a= var xl if(xls

AddProductServlet

VB

JSP

/admin/administration/addproduct.jsp

Error en el transcurso de la

operación

Operación exitosa

Previsualización producto

VB

JSP

/WEB-INF/admin/preview_prod.jsp

Confirmar producto

Editar producto

GET

GET

VB

Java

Guarda producto

Error guardando

Exito guardando

Administración de productos

/admin/administration/products_administration.jsp

VB

JSP


© Jdyb -‐ Mayo 2011 50

Editar producto del catálogo

1 -----2 -----3 -----

Editar producto

VB

JSP

/admin/administration/modifyprod.jsp


EditProductServlet

POST

VB

Java

Administración de productos


VB

JSP

Errores en la operación

Previsualización producto

VB

JSP

/WEB-INF/admin/preview_prod.jsp

Operación correcta

Confirmar producto

Editar producto

GET

GET

Error guardando

Exito guardando

Guarda producto


© Jdyb -‐ Mayo 2011 51

Editar usuario

Editar usuario<script var a= var xl if(xls

EditUserCompleteServlet

POST

GET

Error 404

VB

JSP

/admin/administration/edituser.jsp?user=

VB

Java

Administración de usuarios

Errores Operación completada

Actualizar usuario

VB

JSP

/admin/administration/user_administration.jsp

Borrar usuario

Lista de usuarios

VB

JSP

/admin/administration/user_administration.jsp


DeleteUserServlet

Error en peticion

Error 404

Borrado correcto

Error en el proceso

Borrar usuario

VB

Java


© Jdyb -‐ Mayo 2011 52

Borrar producto

Listado productos

VB

JSP


Borrar producto

VB

JSP

/admin/administration/delprod.jsp?prod=

Cancelar Confirmar


DeleteProductServlet

POST

Error 404

GET

Error Exito

Borrar producto

VB

Java


© Jdyb -‐ Mayo 2011 53

Editar comentario

Producto

VB

JSP

/shop/viewprod.jsp?prod=

Editar comentario

VB

JSP

Parámetros incorrectos

Parámetros correctos

Error 404

/admin/administration/editcomment?cod=


EditCommentServlet

Error validación

Correcto

Actualizar comentario

Errores

VB

Java


© Jdyb -‐ Mayo 2011 54

Borrar comentario

Producto

VB

JSP

/shop/viewprod.jsp?prod=


DeleteCommentServlet

Error parámetros

o POST

Error 404

Borrado correcto

Borrado fallido

VB

Java


© Jdyb -‐ Mayo 2011 55

6.7.-‐ Sobre el JavaScript que se ha usado

Todo el JavaScript usado en el sistema usan la librería JQuery, cuya principal función consiste en facilitar el acceso al documento HTML, facilitar el manejo de eventos así como en el uso de Ajax.

En primer lugar podemos destacar la librería VanadiumJS que nos ayuda a la validación de formularios mediante JavaScript. Esta librería es capaz de validar campos de los formularios simplemente poniendo la clave correspondiente en el atributo class del campo del formulario y nos da el mensaje de error siguiendo la hoja de estilos que está dentro de la carpeta css.

Mostremos un ejemplo para el formulario de login.

Mostramos a continuación la web de la librería usada, aunque el documento de la librería que se usa en esta aplicación ha sido modificado para dar los mensajes en español y también se han modificado algunas de las expresiones regulares y se han añadido otras expresiones regulares como por ejemplo para validar las direcciones.

http://www.vanadiumjs.com/

Otra de las librerías usadas es Tiny-‐MCE el cual sirve para que los cuadros de texto de los textarea sean cuadros de texto WYSIWYG. Para ello hay que inicializar las páginas que contengan los textarea con una función que especifica las opciones de plugin. Esta función la podemos ver en el documento scripts.js.


© Jdyb -‐ Mayo 2011 56

Dejo a continuación la web del plugin en donde se puede obtener más información acerca de las opciones.

http://tinymce.moxiecode.com/

Algo que hay que tener muy en cuenta a la hora de usar este plugin es que se ha dejado muy corto de opciones debido a que se valida el html de entrada en el servidor por cuestiones de seguridad, por lo que hay ciertas etiquetas de html o css que no están permitidas, por ello el fichero XML de configuración de antisamy está adaptado especialmente a este plugin.

Otro aspecto muy importante a tener en cuenta es que la combinación de estos dos plugins puede tener problemas, a continuación explico las causas.

El cuadro de texto WYSIWYG que se genera no es el mismo textarea que hay en nuestro html, se podría decir que es uno virtual, por lo que nosotros escribimos en el virtual, por lo tanto nuestro textarea está vacío y por esta causa la validación por la librería Vanadium fallaría.

Por ello lo que hay que hacer es volcar el contenido del cuadro de texto WYSIWYG en el textarea real de nuestro html. Para ello hemos de usar eventos, yo para solucionarlo que he hecho es que se vuelque el contenido con cualquier cambio que se produzca en el campo de texto. Esto lo podemos configurar en la función de inicialización del cuadro WYSIWYG.

El código consiste simplemente en que se asigna una función al evento y esa función lo que realiza es el volcado del contenido.


© Jdyb -‐ Mayo 2011 58

7.-‐ Sistema de control de versiones

Para el desarrollo de este proyecto se ha usado un sistema de control de versiones centralizado, que ha sido subversión. Como repositorio se ha usado Google code.

La URL del proyecto en google code es la siguiente.

http://code.google.com/p/tiendaonlinelpijdyb/

Lo que se encuentra almacenado en el repositorio de google code es un proyecto de NetBeans, el cual se encuentra en la carpeta trunk.

http://code.google.com/p/tiendaonlinelpijdyb/source/browse/#svn%2Ftrunk%253Fstate%253Dclosed

Es posible bajar el proyecto haciendo un checkout del mismo con el cliente de subversión que nosotros deseemos. Por ejemplo podemos usar el cliente que trae Netbeans por defecto.

A continuación mostramos los pasos que hemos de seguir para hacer un checkout desde netbeans y así obtener el proyecto completo.

En la siguiente ventana se nos preguntará por la URL del repositorio.

https://tiendaonlinelpijdyb.googlecode.com/svn


© Jdyb -‐ Mayo 2011 59

En esta ventana se nos preguntará por la ruta de la que deseamos hacer el checkout y posteriormente por la ruta dentro de nuestro equipo donde queremos que se guarde el proyecto.

En la siguiente ventana podemos comprobar que se ha realizado correctamente la operación y observamos que ha detectado que es un proyecto de NetBeans y nos da la opción de abrirlo o no abrirlo.


© Jdyb -‐ Mayo 2011 60

Podemos acudir al directorio de nuestro equipo donde elegimos guardar el proyecto y comprobaremos que se ha bajado correctamente.


© Jdyb -‐ Mayo 2011 61

8.-‐ Aspectos a mejorar

La usabilidad de la aplicación se ha tratado de hacer lo mejor posible para hacerla lo más amigable posible pero aún así hay aspectos que son mejorables, como puede ser la paginación de los resultados, la apariencia de la página de inicio y la de la página de acerca han sido bastante austeras.

La función de subida de imágenes podría ser mejorable modificando el modelo de datos y de esta manera ayudaríamos al SEO (Searh Engine Optimization) para que nuestras imágenes fueran mejor indexadas por los motores de búsqueda.

También podría ser interesante la inclusión de más tipos de gráficas en la sección de estadísticas de los administradores para obtener más información sobre el estado y la evolución e la tienda. De la misma forma que estas gráficas podrían ser mejorables en lo que se refiere al aspecto de las mismas. Por ejemplo se podría usar javascript para representar las mismas.

Si esto se tratara de una aplicación real no podríamos usar el tipo de dato double para representar los precios de las cosas debido a que este tipo de dato podría efectuar redondeos o ajustes que no son deseables cuando estamos hablando de dinero. Si en la tienda hubiera descuentos o porcentajes de alguna forma se podrían empezar a observar las consecuencias. Lo que mejor hubiera estado para subsanar este problema sería haber usado la clase de java BigDecimal que tiene una mayor precisión.

online shop

Documents