Feb 092013
 

En este artículo vamos a explicar paso a paso la preparación de un entorno de desarrollo sobre un ordenador con sistema operativo windows, para poder probar las modificaciones y mejoras que queremos incorporar a nuestro sitio web, sin afectar al servidor en producción.

Introducción

Cuando se está desarrollando el código de una aplicación o servicio ofrecido en internet a través de un servidor web, es muy conveniente disponer de un entorno de desarrollo local en el que podamos trabajar sin afectar al servidor en producción. Cuando los cambios en dicho entorno han sido probados satisfactoriamente, se realiza el “paso a producción”.

Lo deseable es que el entorno de desarrollo sea lo más parecido posible a la plataforma sobre la que se ejecuta el servidor de producción; la plataforma más usada para ofrecer servicios web en internet es una combinación de:

  • Un sistema operativo Linux (Debian, CentOS,…)
  • Un servidor web Apache
  • Una base de datos MySQL
  • Un software escrito en el lenguaje de programación PHP (o bien Perl o Python)

este tipo de plataforma es conocida como LAMP, por las letras iniciales de sus componentes.

El sistema operativo Linux es normalmente preferido por su estabilidad.

Sin embargo, es muy habitual que el ordenador utilizado por la persona encargada del desarrollo ejecute alguna de las versiones del sistema operativo Windows. En dicho equipo podemos preparar una plataforma WAMP (Windows+Apache+MySQL+PHP).

WampServer

Cada uno de los componentes del entorno puede ser instalado manualmente por separado. Sin embargo, es mucho más cómodo utilizar los paquetes disponibles en www.wampserver.com, para realizar en una sola operación la instalación de todos ellos, sobre hardware de 32bit o de 64bit, y para distintas versiones de los componentes.

Para instalarlo, accedemos a la página de descarga de wampserver. Debemos seleccionar el paquete (de 32bit o de 64bit, dependiendo del hardware del ordenador en donde vamos a realizar la instalación), que contenga las versiones de los componentes más próximas a las versiones existentes en producción. En nuestro caso, descargamos “WAMPSERVER (64 BITS & PHP 5.4)  2.2E”, que incluye:

  • Apache 2.2.22
  • Mysql 5.5.24
  • PHP 5.4.3
  •  XDebug  2.1.2
  •  XDC 1.5
  • PhpMyadmin 3.4.10.1
  • SQLBuddy 1.3.3
  • webGrind 1.0

Al pulsar en el enlace de descarga, aparece una ventana de popup en la que nos indica que también debemos instalar el runtime de Visual C++ 2010 correspondiente a nuestro equipo:

instalar-wampserver

En nuestro ordenador ya estaba instalado el runtime de Visual C++, por lo que directamente procedemos a realizar la instalación de wampserver2.2e-php5.4.3-httpd2.2.22-mysqld5.5.24-x64.exe:

instalar-wampserver-2

Una vez instalado, en la bandeja del sistema aparece un icono desde el que podemos controlar los servicios de wampserver. Haciendo click sobre el mismo con el botón izquierdo del ratón, se presenta el menú de control:

wampserver-menu

En dicho menú, seleccionamos “Start All Services”  y a continuación accedemos desde nuestro navegador a la url “http://localhost”. Si la instalación se ha realizado correctamente, podremos ver la página de configuración de WampServer:

wampserver-home

 

Instalación de la aplicación en el entorno de desarrollo

Para copiar la aplicación desde el servidor de producción al entorno de desarrollo, debemos:

  • Copiar la base de datos
  • Copiar el contenido estático, scripts PHP y ficheros de configuración
  • Configurar el servidor apache
  • Configurar el servicio DNS editando el fichero hosts

A continuación detallamos la manera de llevar a cabo cada uno de estos pasos.

Copiar la base de datos

En el entorno local deberemos crear una base de datos con el mismo nombre que la que existe en producción, y también deberemos crear el usuario con el que se accede y concederle los permisos, para que el acceso a la base de datos local se realice exactamente igual que el acceso a la base de datos de producción.

Si la base de datos de producción es accesible mediante phpmyadmin, podemos realizar un “Export” de toda la base de datos con esta utilidad.

En caso contrario, si es posible conectarse al servidor por ssh, podemos realizar un volcado de la base de datos por línea de comandos, y copiarlo después al ordenador local por ftp. (Si la base de datos es muy grande, podemos comprimir el volcado para tardar menos en realizar la copia):

Tras obtener el volcado, accedemos a la instalación local de phpMyAdmin desde el enlace en la página “http://localhost”, y procedemos a realizar la importación de la base de datos. También desde phpMyAdmin, podemos crear el usuario con el que se accede a la base de datos y concederle los permisos de acceso.

wampserver-importar-mysql

Nota: Si la aplicación utiliza un CMS, es habitual que exista un fichero de configuración en el que se especifican el servidor, nombre de la base de datos, usuario y contraseña. Por ejemplo, en una instalación de wordpress, el fichero wp-config.php contiene las sentencias:

Del mismo modo, en una instalación Joomla, el fichero configuration.php contiene las sentencias:

Copiar el contenido estático

Podemos utilizar un cliente FTP como FileZilla, o cualquier otro mecanismo que esté a nuestra disposición, para copiar al ordenador local, bajo un directorio cualquiera (por ejemplo, “C:wamppublic_html”) todos los ficheros y directorios existentes bajo la raiz del servidor web de producción.

Configurar el servidor Apache

El fichero principal de configuración de apache en la instalación wamp se encuentra en:

Adicionalmente, se pueden configurar hosts virtuales en el fichero:

Suponiendo que nuestro servicio de producción se encuentra en la url “http://www.servidor.com”, Editamos este último fichero para añadir la definición de un host virtual como sigue:

Habiendo hecho esto, las solicitudes que lleguen al servidor apache local haciendo referencia al nombre de servidor “www.servidor.com” serán tratadas conforme a las directrices contenidas en la definición del host virtual que hemos añadido.

En el interior de la definición del Virtual Host podemos añadir todas las directrices adicionales que sean requeridas por nuestro servidor. Por ejemplo, es habitual añadir una directriz que permite el uso de ficheros .htaccess:

Configurar la resolución de nombres

Pero, ¿ como se configura el equipo para que una solicitud que realiza el navegador para obtener la página “http://www.servidor.com” sea enviada al servidor apache local ?.

Para atender una solicitud de una página, un navegador comienza por convertir el nombre del servidor en una dirección IP. Para ello, en Windows, consulta primero el fichero “C:WindowsSystem32driversetchosts”. Si encuentra el nombre de servidor en este fichero, utiliza la dirección IP asociada. En caso contrario, solicita la conversión del nombre a dirección IP al servidor DNS (Domain Name Service) que tenga en su configuración de red.

Por lo tanto, podemos editar el fichero “C:WindowsSystem32driversetchosts” de nuestro ordenador, y añadir al mismo una línea de la forma:

De esta forma, el navegador convertirá el nombre www.servidor.com en la dirección 127.0.0.1 (127.0.0.1 es la dirección IP de “localhost”, que siempre se refiere al ordenador en donde se utiliza).

Nota: Para editar el fichero hosts, debemos ejecutar notepad (u otro editor de texto disponible) con privilegios de administrador.

Una vez editado el fichero hosts, ya está completa la configuración del entorno de desarrollo en el equipo local. Ahora, cuando accedemos desde el navegador a la url “http://www.servidor.com”:

  • El nombre www.servidor.com se traduce en 127.0.0.1, y la petición es enviada al servidor apache local
  • La petición es procesada conforme a las directrices en el host virtual, que indican como DocumentRoot el directorio en donde se encuentra el contenido estático y los scripts de nuestra aplicación.
  • Los scripts, cuando se conectan a la base de datos, se conectan a la instancia local de MySQL.

Nota: Si después de haber hecho estos cambios queremos acceder al servidor de producción desde el equipo de desarrollo, deberemos volver a editar el fichero hosts y comentar la línea que hemos añadido. Para ello, basta con insertar el carácter # al comienzo de la línea:

 Publicado por en 11:10 am

 Deja un comentario

(requerido)

(requerido)