11/06/201424/11/06Lab. Bases de Datos1 JSP y Bases de Datos * * Tomado del curso de Francisco Moreno.

Presentación del tema: "11/06/201424/11/06Lab. Bases de Datos1 JSP y Bases de Datos * * Tomado del curso de Francisco Moreno."— Transcripción de la presentación:

1 11/06/201424/11/06Lab. Bases de Datos1 JSP y Bases de Datos * * Tomado del curso de Francisco Moreno

2 11/06/201424/11/06Lab. Bases de Datos2 JSP: Java Server Pages es un lenguaje que permite mezclar código Java dentro de lenguaje HTML Nos centraremos en el uso de JSP orientado a la interacción con Bases de Datos, como caso particular con Oracle, pero el método de trabajo con otros SGBDs es similar Permite la generación de páginas HTML dinámicas (se construyen en tiempo de ejecución)

3 11/06/201424/11/06Lab. Bases de Datos3 Existen otras alternativas a JSP: - PHP Hypertext Preprocessor (Personal Home Page) Independiente - ASP (Active Server Pages) Microsoft - PSP (PL/SQL Server Pages) Oracle Para interactuar con el navegador se requiere un software especial (Servidor Web) el cual puede ser el Tomcat, Jrun, IIS (de Microsoft) etc.

4 11/06/201424/11/06Lab. Bases de Datos4 Un archivo JSP puede ser creado con cualquier editor de texto La extensión es JSP Se comenzará con un ejemplo que muestra la sintaxis básica: consiste fundamentalmente en como incorporar código Java stand alone en una página JSP (luego se pasará a interactuar con la BD)

5 11/06/201424/11/06Lab. Bases de Datos5 Página Ensayo JSP Forma de importar librerías en JSP

6 11/06/201424/11/06Lab. Bases de Datos6 Valor de la variable i, i = Valor de la variable j, j = Valor de la variable k, k = Hola, la fecha de hoy es Ahora veamos un ciclo "> ¡Voy creciendo en azul! z= "> ¡Voy creciendo en verde! z= Código Java incrustado en JSP Impresión de una vble en JSP

7 11/06/201424/11/06Lab. Bases de Datos7 Procedimiento: Nombrar el archivo así: prueba.jsp Copiar el archivo en la siguiente ruta: carpeta_tomcat/webapps/ROOT/nombre_carpeta/ Iniciar el Servidor Tomcat así: Ejecutar el archivo startup ubicado en la carpeta bin del Tomcat. Invocar en el navegador : http://servidor:puerto/nombre_carpeta/prueba.jsp

8 11/06/201424/11/06Lab. Bases de Datos8

9 11/06/201424/11/06Lab. Bases de Datos9 Código HTML generado: Pagina Ensayo JSP Valor de la variable i, i = 0 Valor de la variable j, j = 10 Valor de la variable k, k = 3.14 Hola, la fecha de hoy es Tue Apr 18 18:02:52 COT 2006 Ahora veamos un ciclo Voy creciendo en verde! z=1 Voy creciendo en azul! z=2 Voy creciendo en verde! z=3 Voy creciendo en azul! z=4 Voy creciendo en verde! z=5 Voy creciendo en azul! z=6 Voy creciendo en verde! z=7

10 11/06/201424/11/06Lab. Bases de Datos10 Manejo de Errores Archivo PaginaError.jsp: Hola

11 11/06/201424/11/06Lab. Bases de Datos11 Manejo de Errores Archivo errorPage.jsp: Ocurrió un error:

12 11/06/201424/11/06Lab. Bases de Datos12 Ahora se realizará una página JSP que accesará a la BD. Crear la siguiente tabla: DROP TABLE emp; CREATE TABLE emp( empno NUMBER(3) PRIMARY KEY, empname VARCHAR2(10) NOT NULL ); INSERT INTO emp VALUES(100, 'Luis'); INSERT INTO emp VALUES(200, 'Juan'); INSERT INTO emp VALUES(300, 'Lucas'); COMMIT;

13 11/06/201424/11/06Lab. Bases de Datos13 Ahora bajar el archivo Conexion.zip y extraer el archivo conexion.jsp Colocarlo en la ruta: carpeta_tomcat/webapps/ROOT/nombre_carpeta/ Cambiarle el usuario y el password Ejecutar lo siguiente (habiendo iniciado el Tomcat): http://servidor:puerto/nombre_carpeta/conexion.jsp Pero antes será analizado… El resultado en pantalla debe ser el siguiente:

14 11/06/201424/11/06Lab. Bases de Datos14

15 11/06/201424/11/06Lab. Bases de Datos15 Ahora se realizará una página JSP mediante la cual se pueden ejecutar diferentes consultas y cuyo resultado se construye dinámicamente. Bajar el archivo Consulta.zip, el cual contiene los siguientes archivos: consulta.html consulta.jsp errorPage.jsp Se colocan en la misma ruta que los anteriores… Para ejecutar: http://servidor:puerto/nombre_carpeta/consulta.html No olvidar cambiar usuariopassword usuario y password

16 11/06/201424/11/06Lab. Bases de Datos16 Ahora construiremos un formulario HTML con validaciones en JavaScript que permitirá insertar un nuevo cliente de una compañía en su tabla respectiva. Bajar el archivo: Celulares.zip, el cual contiene los archivos: celularesinserta.jsp, celularesinserta.htm, celularesinsertafotos.zip Colocarlos en la misma ruta de los anteriores… Descomprimir también el archivo celularesinsertafotos.zip y antes de ejecutar, crear la siguiente tabla y la siguiente secuencia: usuario password Cambiar usuario y password

17 11/06/201424/11/06Lab. Bases de Datos17 CREATE TABLE clientecelular( carnet NUMBER(10) PRIMARY KEY, nombre VARCHAR(20) NOT NULL, apellidos VARCHAR(20) NOT NULL, email VARCHAR(30) NOT NULL UNIQUE, sexo CHAR(1) NOT NULL CHECK(sexo IN('m','f')), tel NUMBER(10), tipoingresos NUMBER(1) CHECK(tipoingresos IN(1,2,3)), password VARCHAR(20) NOT NULL, estado_civil CHAR(1) CHECK(estado_civil IN('s','c')) ); CREATE SEQUENCE carnet; Ahora invocar: http://servidor:puerto/nombre_carpeta/celularesinserta.htm

18 11/06/201424/11/06Lab. Bases de Datos18 Ahora se verá una aplicación que consulta una tabla de empleados y permite recuperar su foto (formato jpg) y su hoja de vida (formato.doc ) Bajar el archivo Traer_empleados.zip el cual contiene: traer_empleado.html traer_empleado.jsp traer_todos.jsp traer_FotosyHojas.zip Colocarlos en la misma ruta que los anteriores… Descomprimir también el archivo traer_FotosyHojas.zip Antes de ejecutar se creará la siguiente tabla: usuario password Cambiar usuario y password

19 11/06/201424/11/06Lab. Bases de Datos19 DROP TABLE artista; CREATE TABLE artista( codigo NUMBER(3) PRIMARY KEY, nombrereal VARCHAR2(20), nombreartistico VARCHAR2(20), foto VARCHAR2(30), hojadevida VARCHAR2(30) ); INSERT INTO artista VALUES(10,'Carlow Wright','Gigante','giant.jpg','giant.doc'); INSERT INTO artista VALUES(20,'Sharon Gómez','Gorilona','apegirlie.jpg','apegirlie.doc'); INSERT INTO artista VALUES(30,'Pedro Hawkshaw','Barbudo','beard.jpg','beard.doc'); INSERT INTO artista VALUES(40,'N.N','Hombre Invisible','invisible.jpg','invisible.doc'); INSERT INTO artista VALUES(50,'Don Gato','Felpa', 'gato.jpg','gato.doc'); COMMIT;

20 11/06/201424/11/06Lab. Bases de Datos20 Y ahora invocar: http://servidor:puerto/nombre_carpeta/traer_empleado.html Al presionar el botón Mostrarlos Todos se genera una página HTML dinámica que provee acceso a la foto y a la hoja de vida del artista… Por medio del botón Enviar Consulta se puede consultar los datos de un empleado particular por medio de su código Nótese que en la base de datos NO se guardan ni las fotos ni los documentos, estos residen en un directorio y pueden ubicarse en un servidor… esto minimiza el tamaño de la BD, aunque es menos seguro…

21 11/06/201424/11/06Lab. Bases de Datos21 El siguiente ejemplo muestra una interfaz que permite al usuario final crear una tabla desde el navegador Bajar el archivo Creatabla.zip, al descomprimir se generan los archivos: generatabla.jsp generatabla.html creatabla.jsp Invocar: http://servidor:puerto/nombre_carpeta/generatabla.html La interfaz es incipiente, sin embargo podría llegar a extenderse hasta ser convertida en un pequeño wizard (asistente) de creación de tablas Cambiar usuario y password

22 11/06/201424/11/06Lab. Bases de Datos22 Ahora se verá cómo generar de manera dinámica los elementos de una una lista de selección que extrae sus valores de una tabla de la BD Sea la tabla: CREATE TABLE genero( codigo NUMBER(3) PRIMARY KEY, nombre VARCHAR2(15) NOT NULL UNIQUE, descripcion VARCHAR2(30) ); INSERT INTO genero VALUES(1,'Soul','¡Indescriptible!'); INSERT INTO genero VALUES(2,'Pop','¡Música para Hello Kitty!'); INSERT INTO genero VALUES(3,'Jazz','Se originó en China'); INSERT INTO genero VALUES(4,'House','¡Tiene muchos subgéneros!'); COMMIT;

23 11/06/201424/11/06Lab. Bases de Datos23 También se verá el proceso para un radio button, sea la tabla: CREATE TABLE tipo_miembro( codtipo NUMBER(3) PRIMARY KEY, nombre VARCHAR2(20) NOT NULL UNIQUE, valor NUMBER(3) NOT NULL, privilegios VARCHAR (40) ); INSERT INTO tipo_miembro VALUES(10,'Oro', 900, 'Cenar con los artistas'); INSERT INTO tipo_miembro VALUES(20,'Plata', 500, 'Bajar la música' ); INSERT INTO tipo_miembro VALUES(30,'Madera', 100, '¡Mirar pero no tocar!'); COMMIT; Ahora bajar el archivo ListayRadio.zip, descomprimir y ubicar en la misma ruta que los anteriores… cambiar usuario y password. Invocar http://servidor:puerto/nombre_carpeta/listayradio.jsp

24 11/06/201424/11/06Lab. Bases de Datos24 Ahora se verá un método rudimentario de cómo generar dinámicamente los elementos de un formulario, es decir, un formulario que genera formularios El formulario es dinámico desde el punto de vista de la cantidad de elementos que puede poseer: Cajas de diálogo (text) Passwords Radio Buttons Menús (select).

25 11/06/201424/11/06Lab. Bases de Datos25 Si se analizan las características básicas de un elemento en un formulario son: nombre del elemento label (mensaje que aparece en pantalla). tipo de elemento: si es de entrada (diálogo), password, radio, etc. valor y label (correspondiente al valor) (puede ser una lista de valores en el caso de un radio o de una lista de selección) size (para algunos elementos aplica) Otras características que no serán analizadas en este momento…

26 11/06/201424/11/06Lab. Bases de Datos26 Ejemplo 1: Entre su email<input type="text" name="email" size="20"> nombre: email label: Entre su email tipo de elemento: text valor: no tiene ( ingresado por el usuario en este caso ) size: 20

27 11/06/201424/11/06Lab. Bases de Datos27 Ejemplo 2: Género Favorito: Soul Pop Jazz House nombre: tipogenero label: Genero Favorito tipo de elemento: select valor: 1,2,3,4 label (correspondiente a los valores): Soul, Pop, Jazz, House size: 1

28 11/06/201424/11/06Lab. Bases de Datos28 Bajar el archivo FormaForma.zip, extraer y ejecutar en SQL*Plus las instrucciones del archivo crear.sql, extraer el archivo formaforma.jsp, cambiar el usuario y password y colocarlo en la misma ruta que los anteriores… Finalmente desactivar el Tomcat : Ejecutar el archivo shutdown ubicado en la carpeta bin del tomcat