5 Instalación y configuración del entorno de desarrollo y...

5 Instalación y configuración del entorno

de desarrollo y depuración

5.1 IntroducciónEn el presente documento se pretende describir con detalle el proceso de

instalación de un entorno de desarrollo y depuración de la aplicación. Tan importante como la instalación de los componentes del sistema, será la

correcta configuración de los mismos, ya que el resultado de esta tarea repercutirá de forma directa en el rendimiento del entorno. Por tanto, el segundo objetivo de este

Manuel Martínez Guerrero 45

KnoE: Sistema de Gestión de portal web para e-shop

texto será la descripción exhaustiva del proceso de configuración de los distintos elementos como entidades individuales.

El entorno de desarrollo estará compuesto por IDE NetBeans, la última versión disponible de Java, el servidor de plataforma XAMPP (Apache, MySQL, PHP, FileZilla Server, Mercury y phpMyAdmin) y un cliente web, en nuestro caso Mozilla Firefox. Se utiliza una clase del paquete básico de Jakarta, commons-net-ftp, para la creación de un cliente FTP.

No se realizará una descripción de las funcionalidades de las aplicaciones antes citadas al no formar parte de los objetivos de este documento. Esto es debido a que será necesaria para la comprensión de cada uno de los apartados una mínima familiaridad con las herramientas a las que se refieren. De cualquier forma, se encuentra a disposición del lector una amplia literatura acerca de los proyectos en los que se basa este trabajo en sus correspondientes sitios web:

• http://www.netbeans.org • http://www.apachefriends.org/es/xampp.html • http://java.sun.com • http://www.mozilla.org • http://www.apache.org • http://filezilla-project.org • http://www.mysql.com • http://www.php.net • http://www.phpmyadmin.net • http://commons.apache.org/net/

Todo el software utilizado durante el proceso descrito en esta memoria es de libre distribución y puede por tanto ser obtenido para su instalación y uso en los sitios web antes citados.

5.1.1 Instalación de NetBeans 6.7.1 y Java J2SE La versión del producto más reciente a la fecha de creación de esta aplicación

es la 6.7.1. Aunque el paquete básico de esta plataforma de software libre es descargable desde el sitio web mencionado anteriormente, existe la posibilidad de obtener una versión conjunta del paquete con el entorno Java Developement Kit J2SE

46 Manuel Martínez Guerrero

http://commons.apache.org/net/

http://www.phpmyadmin.net/

http://www.php.net/

http://www.mysql.com/

http://filezilla-project.org/

http://www.apache.org/

http://www.mozilla.org/

http://java.sun.com/

http://www.apachefriends.org/es/xampp.html

http://www.netbeans.org/

versión 6 update 16 desde el sitio java.sun.com. Es esta la opción elegida para nuestro propósito, ya que siguiendo un único proceso de instalación obtenemos el objetivo.

Una vez completada la descarga del paquete “jdk-6u16-nb-6_7_1-windows-ml.exe”, lanzamos el instalador. En la ventana de bienvenida de la utilidad de instalación, hacemos click en Next.


Figura 5.1: Ventana de bienvenida.



Figura 5.2: Ventana de acuerdo de licencia.

Figura 5.3: Ruta de JDK.

En la ventana de acuerdo de licencia, revisamos dicho acuerdo, elegimos aceptar en el checkbox, y clickamos Next.

A continuación elegimos el directorio donde instalar JDK y, seguidamente, se indican también la ruta de instalación de NetBeans y el directorio donde se encuentra el JDK a usar por NetBeans. Elegimos para éste último la dirección especificada en la ventana anterior.

A continuación y, una vez finalizada la instalación el sistema nos informará del éxito de la misma.


Figura 5.4: Directorio de NetBeans y JDK para NetBeans.


Existe la posibilidad de agregar pluggins a la plataforma, tales como el servidor Sun GlassFish Enterprise Server v2.1, Apache Tomcat y un largo etcétera. En nuestro caso, no deberemos instalar ninguna de éstas herramientas, ya que nuestro trabajo se desarrollará con el servidor de plataforma XAMPP, compuesto por una versión de Apache, MySQL, PHP, FileZilla Server y phpMyAdmin. Ya explicamos en su momento que optamos por esta posibilidad por ser ésta última la plataforma típica de cualquier proveedor de servicios de webhosting.

5.1.2 Instalación de commons-net-ftp-2.0 de JakartaEn este apartado se trata la instalación de la librería de clases que aportan al

sistema funcionalidades de cliente FTP. Para acortar tiempos de desarrollo, optamos en su momento por buscar código fuente que aportara al proyecto las funcionalidades necesarias de cliente FTP. Commons-net-ftp es un paquete Java incluido en Jakarta para la implementación de un cliente FTP que permita la conexión a servidores de FTP y la subida de ficheros.


Figura 5.5: Instalación realizada con éxito.

El primer paso es obtener la última versión de dicha factoría en el sitio web correspondiente. La descarga se inicia desde el sitio web:


5.1.2.1 Uso de common.net.ftpPara usar la clase FTPClient, debemos simplemente agregar “commons-net-

ftp-2.0.jar” al conjunto de librerías de proyecto e importar las clases que vayan a ser objeto de uso. Con las siguientes imágenes se detalla el proceso de adición de la librería.

En primer lugar, tal y como se indica en las figuras 5.6 y 5.7, clickamos con el botón derecho sobre la vista de proyectos en la sección Libraries. Elegimos la opción Add JAR/Folder. Seguidamente navegamos en la ventana FileChooser que nos aparece hasta llegar al archivo “commons-net-ftp-2.0.jar” y lo seleccionamos.


Figura 5.6: Apertura de fichero .JAR.



Una vez concluido el proceso descrito, tenemos a nuestra disposición el

conjunto mínimo necesario para dotar al sistema de funcionalidades de cliente FTP.


Figura 5.7: Selección de librería commons-net-ftp.

Figura 5.8: Instalación realizada con éxito.

Para comenzar a usar la clase FTPClient deberemos agregar la sentencia de importación que se muestra a continuación en el fichero java que corresponda:

5.1.2.2 Subida de fichero a un servidor FTPLa conexión a un servidor FTP mediante el uso de SimpleFTP es un proceso

obvio. Podemos hacer loggin con el usuario “anonymous” o bien usar un usuario específico con contraseña.

Una vez conectados, se puede comenzar con la subida de ficheros. Debemos asegurarnos en primera instancia de que cambiamos a “binary mode” imágenes, ya que pueden corromperse durante el proceso y producir un error indeseado.

Con lo expuesto, el código a usar será de la siguiente forma:

5.1.3 Instalación del driver MySQL JDBCMySQL aporta la conectividad para las aplicaciones cliente desarrolladas en el

lenguaje de programación Java a través de un controlador JDBC, que se llama MySQL Connector / J.

MySQL Connector/J es un conector JDBC Tipo 4. Las diferentes versiones disponibles son compatibles con las especificaciones de JDBC 3.0 y JDBC 4.0. La designación de tipo 4 implica que la implementación del protocolo de MySQL está escrita totalmente en Java y no se basa en las bibliotecas de cliente MySQL.


import org.apache.commons.net.ftp.FTPClient;

Texto 5.1: Uso de la clase FTPClient.

try { FTPClient ftp = new FTPClient(); ftp.connect("localhost"); ftp.login("webuser", "webuser"); ftp.setFileType(FTPClient.BINARY_FILE_TYPE); ftp.enterLocalPassiveMode(); InputStream input = new FileInputStream(imagen.getAbsolutePath()); ftp.storeFile(imagen.getName(), input); input.close(); ftp.logout(); ftp.disconnect();}

Texto 5.2: Subida de ficheros con FTPClient.


En este apartado, inicialmente, haremos una breve introducción a los conectores y JDBC. Luego expondremos la utilidad y daremos una guía somera del proceso de instalación en sí.

5.1.3.1 IntroducciónJDBC es una biblioteca de clases que permite la conexión con Bases de Datos

utilizando Java.Permite realizar operaciones (consultas, actualizaciones, etcétera) sobre bases

de datos relacionales utilizando SQL.Las principales ventajas del acceso a base de datos mediante el uso de JDBC y

Java son que la aplicación será independiente de la plataforma y que se puede mover la aplicación de un sistema gestor de base de datos a otro (por ejemplo de Oracle a MySQL, o a Microsoft SQL Server).

JDBC está compuesto por dos capas:– API JDBC se encarga de comunicar

con la API del administrador de controladores JDBC, enviándole las sentencias SQL.

– Un administrador de controladores de JDBC que se comunica de forma transparente al programador con los distintos controladores disponibles para la base de datos.

Por otra parte, los controladores JDBC se clasifican como:– Tipo 1: traducen JDBC a ODBC y se delega en ODBC para la comunicación

con la base de datos. Sun incluye uno de estos controladores con J2SE.– Tipo 2: está escrito parcialmente en Java y en código nativo.– Tipo 3: es una biblioteca cliente escrita completamente en Java que utiliza un

protocolo independiente de la BD para comunicar las peticiones a un servidor que las traduce a un protocolo específico de la Base de Datos.


Figura 5.9: Detalle de capas.

– Tipo 4: es una biblioteca escrita completamente en Java que traduce las peticiones a un protocolo específico de la Base de Datos.

Lo habitual es que los distribuidores de Bases de Datos suministren controladores de tipo 3 o 4.

Podemos resumir que:– Los programadores pueden escribir aplicaciones Java que accedan a Bases de

Datos usando sentencias SQL estándar.– Las clases proporcionadas en el paquete java.sql y javx.sl definen el API

JDBC.– Sun únicamente ofrece un controlador tipo 1 (puente JDBC/ODBC).– Los distribuidores de Bases de Datos pueden ofrecer los controladores,

optimizándolos para sus productos.

5.1.3.2 Instalación del driver en NetBeansEn la última versión de NetBeans, se incluye el conector MySQL Conector

5.6.1. Es por ello que no se necesita realizar descarga complementaria alguna, y el proceso se reduce a agregar la librería al proyecto. Si fuera necesario, procederíamos a descargarnos el controlador desde el sitio de MySQL. Seguidamente expondremos el proceso de instalación.

En primer lugar, en la vista de proyecto, clickamos con el botón derecho sobre el elemento Libraries y seleccionamos Add Library.



En la ventana FileChooser que nos aparece debemos seleccionar el conector en cuestión y aceptar.


Figura 5.10: Adición del conector MySQL.

Figura 5.11: Selección de conector MySQL.

Una vez finalizada la carga, tendremos disponibles las clases que aporta el driver.

El código que usaremos en los archivos fuente será del tipo:

5.2 Instalación de XAMPPXAMPP es un servidor independiente de plataforma, software libre, que

consiste principalmente en la base de datos MySQL, el servidor Web Apache y los intérpretes para lenguajes de script: PHP y Perl. El nombre proviene del acrónimo de X (para cualquiera de los diferentes sistemas operativos), Apache, MySQL, PHP, Perl. El programa está liberado bajo la licencia GNU y actúa como un servidor Web libre, fácil de usar y capaz de interpretar páginas dinámicas. Actualmente XAMPP esta disponible para Microsoft Windows, GNU/Linux, Solaris, y MacOS X.


Figura 5.12: Librería disponible.

String url = "jdbc:mysql://localhost/qcx277";Class.forName("org.gjt.mm.mysql.Driver");con = DriverManager.getConnection(url, "qcx277", "webuser");

Texto 5.3: Uso de la librería del conector.


Oficialmente, los diseñadores de XAMPP sólo pretendían su uso como una herramienta de desarrollo, para permitir a los diseñadores de sitios webs y programadores testear su trabajo en sus propios ordenadores sin ningún acceso a Internet. En la práctica, sin embargo, XAMPP es utilizado actualmente para servidor de sitios Web y, con algunas modificaciones, es generalmente lo suficientemente seguro para serlo. Con el paquete se incluye una herramienta especial para proteger fácilmente las partes más importantes. Es básico para un programador web.

5.2.1 Características y requisitosXAMPP solamente requiere descargar y ejecutar un archivo zip, tar, o exe, con

unas pequeñas configuraciones en alguno de sus componentes que el servidor Web necesitará. XAMPP se actualiza regularmente para incorporar las últimas versiones de Apache/MySQL/PHP y Perl. También incluye otros módulos como OpenSSL y phpMyAdmin. Para instalar XAMPP se requiere solamente una pequeña fracción del tiempo necesario para descargar y configurar los programas por separado.

5.2.2 Proceso de instalaciónA la fecha de realización del presente proyecto, la versión actual de la

aplicación para Windows es la XAMPP 1.7.1, que incluye:◦ Apache 2.2.12 (IPv6) + OpenSSL 0.9.8k◦ MySQL 5.1.37 + PBXT engine◦ PHP 5.3.0◦ phpMyAdmin 3.2.0.1◦ Webalizer 2.21-02 + GeoIP lite◦ FileZilla FTP Server 0.9.32◦ msmtp 1.4.17Una vez descargado el fichero “xampp-win32-1.7.1-installer.exe” del sitio

oficial, iniciamos el instalador clickando dos veces sobre el archivo.


Seguidamente, tras hacer click en Next, elegimos la ubicación donde instalaremos la plataforma, y aceptamos.


Figura 5.13: Ventana de bienvenida.

Figura 5.14: Ubicación de la plataforma.


En la siguiente ventana, seleccionaremos todas las opciones referentes a la instalación de las aplicaciones como servicios de Windows, tal y como se muestra en la figura 5.15. Pulsamos Install y comenzamos así con el proceso.

Una vez finalizado el proceso, se nos muestra la ventana que nos informa del éxito o no de la instalación. Lanzamos desde el menú de Inicio de Windows, o desde el icono creado en el escritorio, la nueva aplicación instalada “XAMPP Control Panel”. Este panel de control se muestra en la figura 5.16. En él se pueden controlar la activación/desactivación de los servicios que corren en el sistema. Arrancamos todos los servicios.


Figura 5.15: Instalación de aplicaciones como servicios.

Para verificar que la instalación ha sido correcta, teclearemos en nuestro cliente web http://localhost, y veremos la página de bienvenida de XAMPP (figura 5.17).


Figura 5.16: Panel de control de XAMPP.

Figura 5.17: Página de bienvenida de XAMPP.


5.2.3 ApacheEn el punto anterior, se verificó que el servidor Apache presentaba un

funcionamiento correcto. No existe una configuración especial a aplicar en dicho servidor, ya que nuestro propósito consiste en usarlo exclusivamente como parte de un entorno local de desarrollo, verificación y pruebas.

En cualquier caso, existe una amplia literatura sobre la configuración del servidor Apache en el sitio oficial.

5.2.4 Configuración de PHPA partir de la versión de PHP 4.2.0 el valor por defecto de la directiva

register_globals es off. El por qué de este cambio viene motivado por un aumento del nivel de seguridad en la configuración del PHP por defecto. Pero esto puede provocar que nuestras páginas dejen de funcionar.

La directiva register_globals cuando esta activada (estado que estaba por defecto antes de la versión 4.2.0 de PHP), provoca que automáticamente se generen variables globales para cookies y valores enviados por get y post entre otros.

El instalador de XAMPP no contempla la activación de register_globals, por lo que deberemos cambiar el estado de esta directiva manualmente. Para ello, en el archivo de configuración de php “php.ini” cambiaremos la sentencia correspondiente.

De esta forma, tendremos la siguiente línea:

Por otra parte, necesitamos activar la funcion “mail()” de php, ya que la página web se sirve de esta función en dos situaciones:

• Para informar via email al cliente de que su registro ha sido exitoso.• Para informar del pedido realizado.

La activación de la función “mail()” se realiza, al igual que en caso anteriormente mencionado, desde el archivo “php.ini”. Para ello, debemos incluir en dicho archivo las siguientes directivas:


register_globals = On

Texto 5.4: Activación de register_globals.

Tras dichos cambios reiniciaremos el servidor Apache desde el panel de control de XAMPP, para que surtan efecto.

5.2.5 Configuración de MySQL con phpMyAdminUna configuración adecuada del servidor de bases de datos permitirá una

comunicación correcta y eficiente entre servidor de datos y aplicación. Por tanto, el objetivo de esta sección será intentar aproximar al administrador a una correcta configuración del servidor de bases de datos MySQL.

Tanto en la fase de instalación del modelo de datos creado, como a lo largo de la implementación de la aplicación objeto de este proyecto, se hará un amplio uso de la herramienta phpMyAdmin para interactuar con MySQL, creando desde aquella el modelo y las consultas de verificación.

La instalación generada con XAMPP no genera una contraseña para el usuario root de MySQL. En la primera entrada en la herramienta phpMyAdmin se nos advierte de tal situación, indicando la laguna de seguridad que esto supone. A pesar de que nuestro entorno de desarrollo es local, haremos una correcta configuración de MySQL añadiendo una contraseña de usuario root.


[mail function]SMTP = localhostsmtp_port = 25;sendmail_from = @example.comsendmail_path = "C:\xampp\sendmail\sendmail.exe -t"

; Force the addition of the specified parameters to be passed as extra parameters; to the sendmail binary. These parameters will always replace the value of; the 5th parameter to mail(), even in safe mode.;mail.force_extra_parameters =

Texto 5.5: Activación de la función “mail()”.

Figura 5.18: Alerta mostrada en phpMyAdmin.


En la pestaña Privilegios de phpMyAdmin tenemos una vista de los usuarios dados de alta en la base de datos de MySQL. El detalle mostrado en la figura 5.19 muestra como seleccionamos el usuario root.

Una vez que hemos clickado sobre Editar, nos aparece una nueva página en la que insertaremos la contraseña del usurario root. Finalmente nos aparecerá un mensaje que indica el éxito de la consulta.

Debemos ahora realizar la inclusión de la nueva contraseña en el archivo de configuración de accesos de phpMyAdmin “config.inc.php”. Para ello, una vez abierto dicho fichero, modificamos la línea que incluye “password” de forma que se adecúe a la contraseña anteriormente introducida.


Figura 5.19: Detalle de privilegios en phpMyAdmin. Usuarios.

Figura 5.20: Inserción de contraseña para usuario root y resultado del proceso.

$cfg['Servers'][$i]['password'] = 'nueva_contraseña';

Texto 5.6: Contraseña de root para myPhpAdmin.

5.2.6 Configuración de FileZillaEn primera instancia, arrancaremos la utilidad de control del servidor FTP

FileZilla desde el panel de control de XAMPP, pulsando sobre el botón Admin.Una vez lanzada la aplicación y conectados al servidor, usaremos el menú de

edición de usuarios.

Introduciremos el nuevo usuario “webuser”, con contraseña “webuser” y especificaremos al servidor un directorio de inicio de sesión y una serie de permisos sobre él para este usuario.


Figura 5.21: Utilidad de FileZilla server.

Figura 5.22: Usuario creado y contraseña.


El directorio en cuestión será la carpeta destinada a alojar todas las imágenes de la web. Aunque brevemente, porque queda fuera del marco de este proyecto, con posterioridad se analizarán varios temas relacionados con el sitio web creado. Entre ellos, se dará a conocer la razón por la cual se usa este directorio de inicio para el usuario creado.

5.3 Instalación del modelo de datosPara insertar el modelo de base de datos propuesto en el capítulo 6, debemos

ejecutar desde phpMyAdmin las sentencias SQL contenidas en el fichero “creacionModelo.sql”, aportado en el CD anexo a esta memoria. En el anexo correspondiente se puede observar el contenido de este fichero. Las sentencias que contiene se limitan a materializar el resultado del estudio realizado al comienzo de la presente memoria de proyecto fin de carrera, creando las tablas necesarias para formar la base de datos relacional propuesta, e instalando los valores iniciales necesarios.

La ejecución de dichas sentencias se puede realizar copiando el contenido del fichero antes mencionado y pegándolo en el área de texto que nos aparece en la sección de ejecución de SQL e phpMyAdmin. Otra forma, puede ser ejecutando el propio fichero, desde la misma herramienta phpMyAdmin.


Figura 5.23: Directorio de inicio de sesión.

Finalmente, debemos crear el usuario “webuser” con contraseña “webuser”, ya que éste será el usado tanto por la aplicación KnoE como por los scripts php para acceder a la base de datos. Para ello, seleccionaremos la base de datos qcx277, y desde la pestaña de privilegios de la herramienta phpMyAdmin introduciremos los datos aportados a comienzos del párrafo, y seleccionaremos los privilegios que se muestran en la figura 5.24.

5.4 Instalación de la webEn este apartado se va a describir el proceso de instalación del sitio web bajo el

servidor de pruebas Apache configurado en apartados anteriores.Como datos de interés general y, quedando fuera del marco de estudio de este

proyecto fin de carrera, solo vamos a citar las tecnologías involucradas en el diseño de la página web:

-PHP-JAVASCRIPTComoquiera que el lector de esta memoria desee obtener mayor información


Figura 5.24: Creación de usuario “webuser”.


sobre el uso de estas tecnologías, existe una amplia literatura a su disposición en los sitios oficiales de las respectivas mencionadas anteriormente.

El proceso de instalación y configuración de la página se limita a una copia de ficheros y la creación de una tabla en la base de datos mediante un script SQL .

Pasamos seguidamente a describir cada uno de los procesos.En primer lugar vamos a copiar el directorio denominado “papeleria” bajo la

carpeta “htdocs” ubicada en el árbol de directorio que elegimos en su momento para la instalación del paquete XAMPP. El directorio “papelería” se suministra junto a esta memoria en un CD anexo en el que se pueden encontrar diversas utilidades además del sitio web creado. En la carpeta se encuentran la estructura de directorios y ficheros necesarios para la puesta en marcha de la web.

Seguidamente, vamos a crear una tabla en la base de datos del sistema, llamada “carro”, cuyo fin es servir de apoyo a la página en las tareas propias de un “carrito de la compra”. Para ello bastará con ejecutar el fichero “creacionCarro.sql” (aportado en el CD anexo a la presente memoria de proyecto) desde la herramienta phpMyAdmin. En el anexo correspondiente se pueden visualizar las sentencias DDL que contiene. No explicaremos los atributos de la tabla, ya que pertenece al marco de la web, y queda excluido del presente proyecto fin de carrera.


Figura 5.25: Página web.

5 Instalación y configuración del entorno de desarrollo y...

Documents

Transcript of 5 Instalación y configuración del entorno de desarrollo y...