Clicky

Cómo tener nuestro WordPress en la nube con Amazon S3 y CloudFront

Amazon - portada

Usar los plugins W3 Total Cache y WP Super Cache para comunicarse con Amazon

La computación en la nube (cloud computing) es una de las palabras de moda en el diseño web y la industria de la computación parece tener una definición muy simple pero un gran número de usos. Es una frase que se utiliza para definir el uso de Internet y servidores remotos para almacenar y gestionar los datos.

Un ejemplo muy conocido es Google Docs. Puedes crear y trabajar en un documento sobre Internet y, al guardarlo, el archivo se almacena en Internet. Por supuesto que la descarga a tu computadora es siempre una opción, pero la mayoría de quien lo usa lo mantiene en el servidor de Google.

Hay una serie de ventajas a este método de trabajo.

Se puede suponer que, dado que estás usando una empresa tan grande como Google, todos los documentos estarán a salvo, además de que se reduce el uso del disco duro y se utiliza menos recursos para crear el documento.

Amazon S3

Hoy quiero hablar de dos aplicaciones de Cloud Computing: Amazon Simple Storage Services (S3) y Amazon CloudFront. Lo que hacen estos dos servicios es guardar los archivos de tu sitio web en los servidores remotos de Amazon, y servir estos archivos a tus usuarios desde múltiples lugares en el mundo para optimizar el tiempo de carga y entrega de archivos, respectivamente. Amazon CloudFront es lo que normalmente se llama una red de entrega de contenido (Content Delivery Network) o, para abreviar, CDN. Hay disponibles muchos servicios de este tipo, pero debido a la flexible estructura de precios y la fiabilidad, Amazon parece ser un favorito de los fans para los servicios basados en la nube.

Ahora que sabemos un poco de historia sobre el cloud computing y los servicios de Amazon vamos a centrarnos en para qué los utilizaremos exactamente. Voy a mostrar la manera más sencilla para cargar todos los archivos del sitio web de WordPress a Amazon S3, y luego utilizar CloudFront para entregar estos archivos de la manera más rápida posible.

Registrarse en Amazon S3 y CloudFront

El primer paso a tomar es inscribirse tanto en Amazon S3 como en CloudFront. Puedes hacerlo yendo a esta página: http://aws.amazon.com/s3/ y, una vez que te hayas inscrito en uno de los servicios, tendrás todos ellos a tu disposición. Sólo se paga por lo que se usa, que es lo que hace tan atractivos los servicios prestados por Amazon.

NOTA: Amazon S3 (Amazon Simple Storage Service) proporciona una sencilla interfaz de servicios web que puede utilizarse para almacenar y recuperar cualquier cantidad de datos en cualquier momento y desde cualquier parte de la web. Concede a todos los desarrolladores acceso a la misma infraestructura económica, altamente escalable, fiable y segura que utiliza Amazon para tener en funcionamiento sus propios sitios web. Para probarlo Amazon ofrece gratuitamente 5GB de almacenamiento estándar, 20.000 solicitudes GET y 2.000 solicitudes PUT. (Se necesita una tarjeta de crédito válida para poder crear una cuenta de AWS).

Amazon S3 - precios

Así que una vez que te hayas registrado, puedes dirigirse a Amazon Web Services (AWS) Management Console http://aws.amazon.com/console . Al iniciar sesión en la consola de AWS se pueden ver todos los servicios que ofrece Amazon.

Amazon aws Consola

La consola de AWS es donde se va a controlar cualquiera de los servicios que utilizas, pero por ahora sólo estamos interesados en S3, así que adelante y haz clic en ese enlace.

Amazon aws Consola - servicios

La interfaz de usuario es bastante simple y es realmente súper fácil de trabajar. En primer lugar vamos a hacer clic en "Create Bucket" para crear el cubo a nuestro sitio de WordPress. Un cubo o Bucket es, efectivamente, un contenedor para todos los archivos. Todo lo que hace es identificar para qué página web estamos almacenando archivos, y luego los guarda. Puedes nombrar a tu cubo como quieras, pero el nombre de tu sitio web o de proyecto probablemente tenga más sentido.

Amazon aws Consola crear Bucket

Creación de una distribución de CloudFront

Ahora, nos quedaremos en la consola de AWS, pero iremos a la zona CloudFront haciendo clic en "Services" en la parte superior.

Amazon CloudFront, create distribution

Ahora, todo lo que tenemos que hacer es click en "CloudFront" y luego en el botón "Create Distribution", y de las dos opciones seleccionaremos "Download", ya que utilizarermos el cubo o depósito de S3 que hemos creado anteriormente.

Amazon CloudFront, create distribution - download

Haz clic en "Continue" y se puede seleccionar el "Origin Domain Name (Origen de Nombres de Dominio)", que será nuestro Bucket S3 que acabamos de crear.

Amazon CloudFront create distribution (Origin Domain Name)

Ahora haz click en "Create Distribution" al final de la página. Deberemos ver la distribución en el dashboard CloudFront. Una vez que la columna "Status" dice "Deployed" y el "State" dice "Enabled", nuestro sitio web está pasando de Amazon S3 al CDN CloudFront.

Amazon CloudFront create-distribution - progreso

Amazon CloudFront, create-distribution habilitada

Amazon Bucket videos virales - services

Uso de W3 Total Cache y configuración de S3

Ahora que ya tenemos nuestro cubo o Bucket creado, tenemos que crear alguna cosa en nuestro sitio WordPress para que se comunique con S3 y empezar a subir todos nuestros archivos. Vamos usar un popular plugin de WordPress llamado W3 Total Cache a causa de que el plugin no sólo tiene características que lo hacen trabajar bien con S3 (y cualquier CDN para el caso), también hace un gran trabajo para la aceleración de tu sitio web utilizando el mejor almacenamiento en caché. Describir las técnicas de almacenamiento en caché del lado de W3 Total Cache está fuera del alcance de este artículo, pero puedes revisar este gran tutorial: Video Tutorial: How To Configure W3 Total Cache.

Una vez que tenemos el plugin instalado y activado, vamos a navegar hasta la configuración general dentro de las opciones del plugin. Una vez allí, desplázate hacia abajo hasta que veas las opciones para el CDN. Asegúrate de verificar que está habilitado CDN Type, desplázate hacia abajo hasta Amazon CloudFront debajo de Origin Pull/Mirror y haz click en "Save all settings".

w3 total cache cdn configuration

Una vez que hemos establecido CloudFront como nuestro CDN, ahora podemos navegar a la página de CDN en las opciones del plugin. No hagas caso de las opciones generales de la parte superior, y ve a Configuration. Aquí vamos a introducir nuestro identificador de clave de acceso, clave secreta y decirle al plugin los archivos que queremos guardar en nuestro Bucket S3.

Para encontrar tu clave de acceso y la clave secreta, simplemente haz click en tu nombre al iniciar sesión en la consola de AWS, y luego click en "Security Credentials" para recibir la información necesaria.

Amazon s3 aws managenet console - credenciales de seguridad

Una vez que tengas esa información, los buckets deben venir de forma automática, así que asegúrate de esté seleccionada la correcta que deseas utilizar. No haremos nada por ahora con soporte SSL o CNAME, simplemente haz click en el botón "Test S3 upload". Después de un minuto o así deberemos recibir un mensaje que dice "Test passed". Si no lo hace, es posible que una de las claves esté equivocada. Una vez que se haya pasado la prueba, guardamos la configuración y ahora vamos a empezar a trabajar con los ajustes generales en la misma página.

Carga de los archivos

Ahora que tenemos todo listo, es el momento de llegar a la parte emocionante. Vamos a empezar a subir nuestros archivos a Amazon S3 utilizando W3 Total Cache. En los ajustes generales para el CDN, recomiendo marcar las siguientes opciones y guardarlas:

•  Host attachments
•  Host wp-includes/ files
•  Host theme files
•  Host custom files

Esta será la sede de todos nuestros archivos adjuntos (attachments), el tema y los archivos principales de WordPress en S3 por lo que casi todo el sitio será servido desde Amazon S3. Vamos a ir en orden inverso y subiremos primero los archivos del tema, después nuestros archivos wp-includes, y por último nuestros attachements. Sigue adelante y haz click en "Upload theme files" y verás que sale una ventana emergente.

w3 total cache cdn transfer

Verás el número total de archivos que tienes, y podrás hacer click en Start. Verás el progreso de la subida de archivos, así como identificar los problemas que puedan haber ocurrido en el proceso de carga. La carga suele ser bastante rápida para cargar los archivos de tema, y sólo toma un minuto o dos, dependiendo de tu conexión a Internet. A continuación vamos a hacer lo mismo para nuestros archivos wp-includes para subirlos a S3.

Elegí subir lo último Host attachments porque, personalmente, fue el proceso más largo de concluir para subir todos mis archivos a Amazon S3. Si deseas reducir el tamaño de tus imágenes y, por lo tanto, el tiempo que lleva para que puedan subirse a S3, recomiendo encarecidamente visitar el plugin WP Smush.it . Ahora puedes seguir adelante y subir todos los archivos adjuntos de imágenes. Puede tardar un tiempo dependiendo de tu conexión a Internet y el número de imágenes. En ocasiones puede ser necesario dejar que el servicio se ejecute por medio día para conseguir subir todas las imágenes.

w3 total cache cdn transfer complete

Felicitaciones, tu sitio web ahora debe estar alojado en el servicio S3 de Amazon, y todas las imágenes de tu sitio web deben ser descargadas de la distribución Amazon CloudFront, se puede comprobar haciendo click derecho en la imagen y verificar su dirección de ubicación.

Configuración de S3 y CloudFront con WP Super Cache

Si usas WP Super Cache, un plugin de caché alternativo para WordPress, estás de suerte: la creación de Amazon S3 y CloudFront es tan sencilla como utilizar el plugin anterior.

Para empezar, tendrás que instalar y activar el plugin. Se activa el plugin, simplemente seleccionando el botón de radio "Caching On" en la pestaña "Easy" de los ajustes de WP Super Cache. Esto hará que el plugin WP Super Cache empiece a trabajar.

WP Super Cache CDN

A continuación, ve a la pestaña CDN, y nos aseguramos de que está marcada la casilla "Enable CDN Support" y, a continuación, vamos a entrar en nuestra URL CloudFront. Podemos encontrar esta URL, yendo hasta la consola de AWS y mirando la distribución que acabamos de crear, y estará bajo la columna "Domain Name". Debe ser algo como xxxxxxxxxx.cloudfront.net.

Amazon distribution Settings

Para copiarla marcaremos la casilla de la distribución y pulsaremos "Distribution Settings".

Amazon distribution Settings - copiar

No modifiques ningún otro ajuste de WP Super Cache, haz click en el botón "Guardar Cambios".

Por desgracia, el plugin WP Super Cache no incluye una forma de cargar automáticamente todos nuestros archivos de WordPress a nuestro Bucket de Amazon S3. Esto significa que tendremos que instalar el plugin de CDN Sync Tool para WordPress. Instala el plugin como lo harías normalmente, luego ve a la página de opciones.

CDN Sync Tool cdn options

Primero trabajaremos con la pestaña "CDN Options" y rellenaremos nuestra información de Amazon S3. Asegúrate de seleccionar S3 en el menú desplegable CDN. A continuación, escribe tu nombre de dominio de Amazon S3, por ejemplo domainname.s3.amazonaws.com, y escribe tu clave de acceso y la clave secreta, que se puede recuperar haciendo clic en tu nombre al iniciar sesión en la consola de AWS y haciendo clic en "Security Credentials", y escribe también el nombre del Bucket que utilizamos anteriormente en este tutorial. Haz clic en el botón "Save and Test Changes".

NOTA: Tener cuidado de colocar bien xxxxxxxxxx.cloudfront.net y domainname.s3.amazonaws.com en sus sitios correspondientes.

CDN Sync Tool Sync

Ve a la pestaña Sync y selecciona los archivos que deseas subir al CDN. Haz clic en el botón "Sync" para lanzar el proceso (El segundo recuadro "Sync Custom Directory To CDN" recomiendo dejarlo en blanco y no emplear el botón "Sync" del mismo).

Ahora todos los archivos deben ser sincronizados con su Bucket de Amazon S3 y el plugin WP Super Cache debe servir todos tus archivos a través de CloudFront.

Eso es todo. Tu sitio web debe ahora ser anfitrión de todos tus archivos desde el Simple Storage Service de Amazon y su distribución a través de la red de entrega de contenido de CloudFront usando el plugin de caché de WordPress preferido. Si no deseas seguir guardando los archivos multimedia más molestos para salvar tu espacio VPS, aquí hay un par de plugins que es posible que desees revisar:

http://wordpress.org/extend/plugins/wp2cloud-wordpress-to-cloud/
http://wordpress.org/extend/plugins/amazon-s3-uploads/

Ambos de estos plugins suben los archivos directamente a S3. Asegúrate de que no residen en tu propio servidor y leer la descripción para ver cómo funcionan.

Relacionada: Mejora el rendimiento de tu sitio web Joomla con Amazon CloudFront

Jesus_Caceres