Archivo de la categoría: Diseño y Programación

Qué son y cómo usar las variables de entorno de Apache desde Plesk

El uso de contraseñas fuertes es sin duda imprescindible para la seguridad, pero a veces se puede convertir en un dolor de cabeza el gestionarlas a la hora del desarrollo de nuestra página web. Pongamos unos ejemplos en los que el buscar un equilibrio entre seguridad y comodidad puede ser complicado:

  • Si quieres que tu programador pueda hacer su trabajo pero no quieres entregarle contraseñas de la base de datos u otros servicios que use tu web.
  • Si quieres tener tu código fuente en un servicio de control de versiones de manera pública, como GitHub, pero que nadie vea tus datos sensibles.
  • Si estás desarrollando en tu máquina local y no quieres tener que cambiar tu archivo de configuración de contraseñas, nombres de usuario, etc, cada vez que subes código al servidor.

Una forma de resolver estos puntos es mediante el uso de variables de entorno de Apache. Haciendo uso de ellas, podemos crear variables a nivel del servidor, a las cuales tenemos acceso desde el código fuente, incrementando así la seguridad de las contraseñas y otros datos sensibles, y haciendo más cómodo el desarrollo.

Vamos a ver un ejemplo en PHP. Imaginemos que tenemos un archivo config.php con el siguiente contenido:

<?php
$password = "clave123";
$usuario = "usuario123";
$base_datos = "nombre_db";

Vamos a sustituir las contraseñas escritas a mano por variables de entorno de Apache. La manera más sencilla de crear estas variables en nuestro VPS es desde Plesk, accediendo a “Configuración del servidor web” para el dominio en que queremos crearlas.

Captura de pantalla 2015-06-05 a las 13.17.29En el campo “Directivas adicionales de Apache” ponemos estas variables:

SetEnv DB_PASS "clave123"
SetEnv DB_USUARIO "usuario123"
SetEnv DB_NOMBRE "nombre_db"

Cuando ya están creadas, acceder a ellas desde nuestro código PHP es muy sencillo. Lo harcemos mediante la función de PHP getenv(). El código del archivo config.php con las claves lo podemos convertir a:

<?php
$password = getenv("DB_PASS");
$usuario = getenv("DB_USUARIO");
$base_datos = getenv("DB_NOMBRE");

Como vemos, ya no hay contraseñas en nuestro código fuente, sólo hay referencias a variables que están configuradas en Apache, de forma que podemos tener nuestro código fuente en repositorios abiertos al público sin que se vean las contraseñas, o permitir que un programador pueda trabajar sin tener que darle acceso total con las claves. Además, si se está desarrollando en local, se pueden configurar también las variables de entorno en el servidor Apache local de forma que no hay que cambiar el código con las contraseñas cada vez que se sube al servidor.

No sólo puede aplicarse a contraseñas de bases de datos, podemos usarlo también por ejemplo para claves API de Twitter, Facebook, y otros servicios, además de otras configuraciones como por ejemplo a qué archivo escribir logs, a qué correo avisar en caso de errores graves y todo tipo de variables que cambian según el entorno en que se ejecuta el código.

Hay que tener presente una cosa muy importante, y es que las variables de entorno aparecen en phpinfo(), por lo que hay que ir con cuidado con esto y asegurarse de no tener ninguna página ejecutándolo, o mejor aún, desactivar la función en la configuración de PHP.

Captura de pantalla 2015-06-05 a las 13.18.08

Facebooktwitter

Cómo instalar MyTop en tu VPS para monitorizar MySQL

mytopMyTop es una herramienta de consola que es muy recomendable instalar en los VPS para monitorizar tu base de datos MySQL. Es especialmente interesante a la hora de identificar consultas especialmente lentas a la base de datos, y así eliminar los cuellos de botella que crean y mejorar el rendimiento tanto de las páginas web como del servidor en general. Su interfaz es muy parecida al comando top, programa en el que está claramente inspirado.

Vamos a ver cómo instalar MyTop en un VPS con CentOS 6, que es el sistema operativo más utilizado y recomendado en los VPS de Evidalia, aunque en principio se puede instalar prácticamente cualquier sistema UNIX que cuente con Perl, DBI y el módulo Term::ReadKey, incluyendo Mac OS X.

Para poder instalar MyTop, primero debemos habilitar el repositorio EPEL.

wget http://download.fedoraproject.org/pub/epel/6/x86_64/epel-release-6-8.noarch.rpm
rpm -ivh epel-release-6-8.noarch.rpm

Una vez habilitado, ya podemos instalar MyTop:

yum install mytop

Así quedaría instalado MyTop en el VPS.

Ahora ya podemos utilizarlo, para ejecutar el comando vamos a suponer que nuestro nombre usuario de la base de datos es “administrador”, la contraseña es “g403jd2kds” y el nombre de la base de datos es “blog”. El comando tomaría esta forma:

mytop -uadministrador -pg403jd2kds -bblog

Es importante no quitar los argumentos -u, -p y -b seguidos del nombre de usuario, contraseña y nombre de la base de datos sin dejar espacio como en el ejemplo. Y ya tendríamos mytop en marcha para monitorizar la base de datos.

Para más información, se puede ver la documentación oficial y la web oficial.

Facebooktwitter

Instalación y primeros pasos con Node.js

node2La semana pasada vimos qué es Node.js, su funcionamiento y posibles usos que se le pueden dar. Hoy veremos cómo instalarlo en un VPS y dar los primeros pasos con él. En este caso vamos a ver cómo instalarlo en un CentOS, ya que es el sistema operativo más utilizando en nuestros VPS.

Debemos seguir los pasos de instalación que nos indican en la documentación oficial, que son simplemente dos comandos:

curl -sL https://rpm.nodesource.com/setup | bash

Este comando hace unas comprobaciones básicas para ver si podemos instalar Node.js y proporciona instrucciones en caso contrario para poder instalarlo. En un VPS tal cual lo entregamos no debe dar ningún problema.

yum install -y nodejs

Con este comando se instala Node.js y una vez finalice, podemos comprobar que la instalación se ha completado correctamente con:

node -v

Si la instalación es correcta nos mostrará la versión de Node.js que se ha instalado.

Una vez Node.js está instalado, vamos a ver un ejemplo básico de servidor HTTP con un código sacado directamente de la web oficial que guardaremos en nuestro VPS con el nombre “servidor.js”:

var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hola Mundo\n');
}).listen(1337, '127.0.0.1');
console.log('Servidor en marcha en http://127.0.0.1:1337/');

Accedemos a la carpeta donde hayamos guardado el archivo por SSH y ejecutamos el siguiente código para ponerlo en marcha:

 node servidor.js
Servidor en marcha en http://127.0.0.1:1337/

Y ya tenemos en marcha un servidor web escuchando peticiones en el puerto 1337. Si os fijais en el código, el servidor está en marcha en una IP local del servidor, por lo que no tenemos acceso vía web. Para poder acceder vía web, debemos ir a nuestro panel Plesk y en la suscripción que querramos usar para Node.js debemos indicar que Apache haga de proxy inverso para que dirija el tráfico del puerto 80 al puerto 1337 (el puerto que está escuchando el servidor Node que hemos creado) de forma transparente para los usuarios.

Para ello debemos ir a Configuración del servidor web  de la suscripción y en Directivas adicionales para HTTP ponemos el siguiente código:

<Location /> 
ProxyPass http://localhost:1337/ 
ProxyPassReverse http://localhost:1337/ 
</Location>

Guardamos el cambio y al acceder al dominio de la suscripción deberíamos ver el mensaje “Hola Mundo”, lo cual significa que el servidor está funcionando correctamente.

Como podemos ver es un ejemplo muy básico con el que hemos aprendido a ejecutar un script con Node.js y dirigir el tráfico web a dicho script para que sea este quien lo maneje.

El siguiente paso es estudiar la API y la documentación de Node.js y buscar tutoriales especializados para seguir aprendiendo esta novedosa tecnología.

Facebooktwitter

¿Qué es Node.js?

nodejs-logoNode.js es una tecnología open source relativamente nueva que está tomando mucha fuerza, y que básicamente permite ejecutar código Javascript en el servidor, en lugar del navegador donde es normalmente ejecutado. Puede ser instalado en las tres plataformas principales (Windows, Mac OS X y Linux).

Node.js interpreta código Javascript utilizando el motor V8 de Google y proporciona un modelo dirigida por eventos y operaciones de entrada/salida asíncronas, lo cual hace que sea ideal para aplicaciones en tiempo real con muchas conexiones simultáneas donde la comunicación entre clientes y servidor es constante (un ejemplo sencillo sería un chat, o una API REST).

Actualmente el lenguaje de programación de lado de servidor más usado es sin duda PHP, pero al contrario que este, Node.js no necesita de un servidor como Apache o nginx, ya que es el propio Node quien se encarga de recibir conexiones y entregar las respuestas HTTP. Afortunadamente encargarse de esto es relativamente sencillo y se traduce en un rendimiento enorme y gran escalabilidad, haciendo capaz a Node de responder a un número de conexiones que colapsarían a PHP.

Sin embargo, no todos los aspectos son positivos. Una de las principales desventajas de Node.js actualmente es la disponibilidad en servidores compartidos. Ahora mismo, no se puede simplemente subir una aplicación en Node a un servidor y esperar que funcione. Por este motivo es el uso de VPS cada vez más popular, ya que se tiene libertad total para instalar cualquier software, incluyendo Node, y así adoptar rápidamente este tipo de nuevas tecnologías.

Para obtener más información, puede visitar las siguientes webs:
nodejs.org
Wikipedia

Facebooktwitter

Cómo ajustar el valor memory_limit de PHP desde Plesk

Una de las directivas de configuración de PHP que más se suele tener que ajustar es el memory_limit. El valor que le asignemos limita la cantidad de memoria del sistema en bytes que un script puede utilizar como máximo, y está pensado para evitar que un posible script mal programado entre por ejemplo en un bucle infinito y nos ocupe toda la memoria del sistema. Cuando llega al límite asignado, simplemente muere.

Es importante tener claro que este límite no es el global para PHP, si no de cada script individual que se esté ejecutando, por ello el valor ideal es el menor que no de errores de memoria.

Si tenemos un script que hace uso intensivo de memoria y supera el límite asignado, PHP nos dará un error parecido a este

Fatal error: Allowed memory size of 33554432 bytes exhausted (tried to allocate 2348617 bytes) in /script.php on line 10

Para aumentar la memoria de PHP desde Plesk, debemos ir a la sección Configuración PHP

conf php plesk

y en el campo memory_limit ponemos la memoria en Mb que queremos asignarconf memory_limit

Guardamos el cambio y comprobamos que no da errores. Si continua dando errores, vamos aumentando la memoria poco a poco (en aumentos de 32 Mb por ejemplo) hasta que encontremos el limite más bajo posible que no nos de errores.

Facebooktwitter

Cómo mejorar la velocidad de carga de tu página web

Una de las métricas que utiliza Google para analizar tu página web con su algoritmo de ranking es la velocidad de carga de esta. Si bien es cierto que no contribuye significativamente, sí que puede marcar una diferencia a la hora de mejorar nuestra posición en el buscador una vez tenemos los puntos más básicos para mejorar el SEO cubiertos.

Aparte de la importancia que la velocidad de carga tiene a la hora de posicionarse en Google, tenemos que tener en cuenta que cada segundo que restemos de nuestro tiempo de carga hará que nuestros visitantes continuen navegando, que confíen en nuestro sitio y que hablen a otros de nuestra web. En el caso de tiendas online por ejemplo, unos pocos segundos pueden marcar una enorme diferencia.

Pasemos a ver los pasos más importantes para mejorar la velocidad de carga:

  • Habilitar la compresión gzip: hoy en dia cualquier navegador moderno soporta la compresión gzip. Esta técnica consiste en que el servidor comprime la página a la hora de enviarla al usuario y el navegador automáticamente la descomprime, reduciendo el tamaño de la página en una media de un 70%. Para activar la compresión gzip, debemos habilitar mod_deflate en Apache
  • Aprovecha la caché del navegador: cuando visitas una página web por primera vez, el navegador descarga todos los recursos que esta utiliza (imágenes, CSS, javascript). Lo más normal es que estos recursos no cambien y sirvan para la siguiente visita, por lo que cada recurso debe indicar una política de cacheado mediante la cabecera Cache-Control que indique para cuánto tiempo es válido cada recurso. Además de los recursos, se pueden cachear páginas completas de forma que el servidor no tiene que generar contenido dinámico cada vez que un usuario visita una página. Estas técnicas pueden ahorrar muchísimo tiempo de proceso en el servidor, lo cual se traduce en mayor velocidad de carga y es muy fácilmente implementable en la mayoría de CMS mediante plugins como por ejemplo WP Super Cache para WordPress.
  • Minifica tus recursos: consiste en eliminar contenido innecesario o redundante en nuestras hojas de estilo o scripts javascript reduciendo el tamaño de estos recursos. Muy sencillo de implementar con herramientas como http://jscompress.com/ y http://cssminifier.com/
  • Optimiza tus imágenes: hay muchas maneras de optimizar el uso de las imágenes en nuestra página web, desde simplemente comprimir las imágenes a sustituirlas por imágenes vectorizadas. Google tiene una guía muy completa al respecto.
  • Usa CDNs para cargar tus recursos: un CDN o Content Delivery Network, es una red de servidores distribuidos que sirven contenido web basándose en la situación geográfica del usuario, es decir, si te visita un usuario en París, pero tienes tu página hospedada en Evidalia cuyos servidores están en España, usando un CDN para cargar tus recursos (CSS, javascript) estos se cargarán del servidor que el CDN tiene en París, por lo que tu página web tendrá menos latencia para el usuario. Utilizarlo es muy sencillo, los scripts más utilizados como jQuery o Bootstrap se pueden obtener muy fácilmente desde un CDN y es tan fácil como sustituir:
    <script src="/scripts/jquery-1.11.2.min.js"></script>
    <link href="/css/bootstrap.min.css" rel="stylesheet">

    por:

     <script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
     <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">

Google nos proporciona una herramienta llamada PageSpeed Insights que podemos utilizar para comprobar cada uno de los puntos más básicos, además de otros más avanzados, que influyen en la velocidad de carga de nuestra web y que Google tiene en cuenta y nos muestra consejos sobre qué puntos debemos mejorar en nuestra página.

Facebooktwitter

Hojas de estilo CSS modernas con Less

lessLess es un preprocesador de hojas de estilo CSS que extiende el lenguaje y añade características avanzadas como variables, mixins, funciones y mucho más, lo cual permite dinamizar nuestras hojas de estilo para hacerlas más mantenibles y extendibles sin complicar el desarrollo de nuestras hojas de estilo, ya que Less usa la misma sintaxis básica que CSS.

A continuación os mostramos algunos ejemplos básicos que ilustran a la perfección las características dinámicas que Less proporcina a tus hojas de estilo:

Sigue leyendo

Facebooktwitter

Meta Tags de uso recomendado

Meta Tags de uso recomendadoCon la expansión de Internet, las páginas comenzaron a utilizar las Meta Tags. Dichas etiquetas son fragmentos de código situados en la cabecera de la página web que permiten obtener información de lo que realmente contiene dicha página.

Lamentablemente, las Meta Tags fueron mal utilizadas por los webmasters de la época, agregando términos o características a la página que poco o nada tenían que ver con ésta, con el único fin de aparecer en la mayoría de búsquedas que se realizaban. Sigue leyendo

Facebooktwitter

Página de mantenimiento con .htaccess

Página de mantenimiento con .htaccessAunque es habitual que los desarrolladores web utilicen algún tipo de CMS para la creación de un sitio web, todavía existen numerosas páginas creadas a medida. Por la razón que sea, puede darse el caso que necesitemos realizar algún tipo de mantenimiento en nuestra web, y no queremos que los usuarios tengan acceso mientras estamos trabajando. En estos casos es recomendable la creación de una página de mantenimiento, que informe a los usuarios y al mismo tiempo evite la interacción de éstos con nuestro sitio. Sigue leyendo

Facebooktwitter

Div con tamaño diferente a su contenido

Div con tamaño diferente a su contenidoEn diseño o maquetación web, el tema de las tablas ya prácticamente ha pasado a la historia. Por diversas razones como usabilidad, lectura en dispositivos especiales e incluso posicionamiento web, las tablas han dejado de usarse en favor a los “divs”. Gracias a esta etiqueta y a su combinación con una hoja de estilos, podremos maquetar toda la página web. Aunque al utilizar esta técnica no estaremos libres de problemas. Uno de los problemas mas frecuentes con que nos toparemos es cuando tenemos un div contenedor y elementos en su interior con la propiedad float. En este caso tendremos un div con tamaño diferente a su contenido: Sigue leyendo

Facebooktwitter