Evaristo R

Técnico Administrador de Sistemas

Técnico Post-productor (VFX, 3D, Vídeo digital)

Piloto de RPAS certificado por AESA

Profesor e-Learning

Evaristo R

Técnico Administrador de Sistemas

Técnico Post-productor (VFX, 3D, Vídeo digital)

Piloto de RPAS certificado por AESA

Profesor e-Learning

Blog Post

Charla Técnica Lab1 – Web estática en Amazon S3

14 noviembre, 2019 AWS
Charla Técnica Lab1 – Web estática en Amazon S3

Hoy he tenido la suerte de asistir junto a mi compañero Mauro Fernández Quiñones, como ponentes a la charla técnica sobre AWS que veníamos preparando en las últimas semanas. La charla fue en el IES FERNANDO AGUILAR QUIGNON, donde ámbos estudiamos ASIR.

La idea de la charla era conseguir una exposición técnica pero amena, que sirviera para despertar el gusanillo por AWS entre los alumnos, y por otra parte darnos el gusto de volver a ponernos delante de ese proyector, donde siempre  tuvimos que defender nuestros trabajos durante la realización de nuestros estudios.

En la Charla técnica se han expuesto una serie de laboratorios, que me he repartido con Mauro. En su blog encontraréis unos y aquí otros, siendo esta entrada el primero de ellos. De esta manera, si algún alumno se quedó con las ganas de repetir el laboratorio en casa, podrá seguirlo sin complicaciones, y por otro lado nos lo guardamos como recuerdo de este día.

Pues… ¡Comenzamos!

Web estática en Amazon S3

Entre los muchos usos que podemos darle a Amazon S3, se trata de usarlo como infraestructura para una web estática. Podemos realizar la parte principal de este laboratorio sin necesidad de tener comprado un dominio en Route53. En la segunda parte veremos de qué manera conectaríamos nuestro dominio con el bucket S3.

La primera parte de este laboratorio no incurrirá en ningún coste teniendo la capa gratuita de AWS.

Para seguir la segunda parte sí debes de tener una zona hospedada en Route53 (0,50$) + un dominio registrado (9$-12$)

Amazon S3

No pretendo en esta entrada hacer una descripción extensa de qué es Amazon S3 pero sí es importante que entendamos los conceptos básicos:

  • Amazon S3 ofrece una infraestructura para almacenar objetos con un nivel extremadamente alto de durabilidad, disponibilidad (99,99%) y escalabilidad a un costo muy bajo.
  • Físicamente, nuestros datos estarán distribuidos por los Data Center de Amazon, permaneciendo ajeno a nosotros.
  • Para la organización de nuestros archivos, Amazon ha creado tres conceptos:
    • buckets: Son los contenedores donde almacenaremos nuestros objetos. Los nombres de los buckets están compartidos entre toda la red de Amazon S3, por lo que si creamos un bucket, nadie más podrá usar ese nombre para un nuevo bucket.
    • objects: Nuestros ficheros en sí.
    • keys: son una clave única dentro de un bucket que identifica a los objects de cada bucket. Un object se identifica de manera unívoca dentro de todo S3 mediante su bucket+key.
  • En cuanto a seguridad, Amazon ha implementado un sistema de permisos de acceso a ficheros por usuario a los que podremos dar capacidad de “Lectura”, “Escritura” o “Control Total”.
  • Administraremos nuestros buckets desde la interfaz de servicios web simple o mediante la API REST de Amazon S3 que usa un esquema HTTP personalizado basado en un HMAC (Hash Message Authentication Code) con clave para la autenticación.

Laboratorio

Seleccionaremos el servicio de S3

Una vez dentro de S3, haremos clic en “Crear bucket”

Si nuestra idea posterior es conectar nuestro dominio de Route53 con el bucket es importantísimo que el nombre único que asignemos al bucket se corresponda exactamente con el dominio que tengamos pensado apuntarle.

Seleccionamos la región que prefiramos y hacemos clic en “Siguiente”

En el siguiente apartado podríamos configurar control de versiones de nuestros objetos así como sus etiquetas. No vamos a configurar nada aquí, así que haremos clic en “Siguiente”.

Ahora es importantísimo que quitemos la marca de “Bloquear todo acceso público” pues nos interesa que el acceso sea público para nuestra web.

Una vez desmarcado, haremos clic en “Siguiente”

Nos mostrará un resumen, haremos clic en “Crear bucket”

Una vez completado este paso, veremos nuestro nuevo bucket. Si hacemos clic en él accederemos.

Una vez dentro, haremos clic en “Propiedades”

Y dentro de propiedades haremos clic sobre “Alojamientos de sitios web estáticos”

Aquí es donde se produce la magia, pues marcaremos “Usar este bucket para alojar un sitio web”

E introduciremos como mínimo, el nombre del documento índice de nuestra web estática.

Una vez que hagamos clic en “Guardar” quedará de la siguiente manera:

Bien, ya tenemos preparado nuestro bucket para funcionar como una web estática.

A continuación, vamos a subir los ficheros que conforman nuestra web estática, que en mi caso son los siguientes

Para ello, haremos clic en “Información general”

y en “Cargar” para poder arrastrar nuestros ficheros

Una vez arrastrados haremos clic en “Siguiente”

Aquí es importante hacer clic en las opciones de “Administrar permisos públicos”

para seleccionar “Conceder acceso de lectura público a estos objetos”

Luego le daremos clic a “Siguiente”

Y en la siguiente ventana dejaremos la clase de almacenamiento estándar

Una vez visualizado el resumen, haremos clic en “Cargar”

Observaremos una barra de progreso:

Y al terminar esta podemos ver por fin nuestros ficheros cargados.

Si volvemos a irnos a “Propiedades”,

y a “Alojamiento de sitios web estáticos”

Podremos hacer clic en el nombre del punto de enlace de nuestro bucket

y podremos comprobar cómo instantáneamente habremos accedido a nuestra nueva web.

¡Ya está! Pero… ¿Pero y si queremos acceder mediante un nombre de dominio?

Apuntar dominio de Route53 a bucket S3

Accedemos a Route53 (para esta parte debemos de tener un dominio registrado, si quieres ver como se hace continúa leyendo aquí)

Hacemos clic en “Zonas hospedadas”

y vamos a la zona correspondiente al dominio que nos interese.

Ahora, haremos clic en “Crear un conjunto de registros”

y ahora, entenderemos por qué era importante nombrar a nuesto bucket con el nombre de dominio que tuviéramos pensado, y es que, de lo contrario, al seleccionr “alias” no nos aparecería nuestro bucket. Solo aparecerá si en “Nombre” ponemos un nombre que coincida con el del bucket S3

Aquí está nuestro bucket:

Una vez hecho esto, haremos clic en “Crear”

Podemos comprobar la propagación con https://www.whatsmydns.net

Observamos que ha sido inmediata, vamos pues a intentar acceder al dominio por fin…

¡Y aquí lo tenemos!

Deshacer todo

Para evitar costes innecesarios vamos a deshacer todo

Eliminaremos el registro por un lado (aunque esto no supondría ningún coste)

y por otro lado, eliminaremos el bucket S3

¡Y esto ha sido todo!

¿CloudFront + S3?

Almacenar el contenido estático con S3 ofrece muchas ventajas. Pero para ayudar a optimizar el rendimiento y la seguridad de nuestra aplicación y, al mismo tiempo, administrar los costos de manera efectiva, AWS recomienda configurar Amazon CloudFront para servir y proteger el contenido.

CloudFront sirve contenido a través de una red mundial de centros de datos llamados Ubicaciones Edge. El uso de servidores perimetrales para almacenar en caché y servir contenido mejora el rendimiento al proporcionar contenido más cercano al lugar donde se encuentran los espectadores. CloudFront tiene servidores perimetrales en ubicaciones de todo el mundo:

Observemos la siguiente infografía:

Imaginemos que tenemos usuarios ubicados en todo el mundo accediendo a la vez. Cada vez que un usuario solicita contenido, la solicitud debe ir a través de Internet público a la ubicación de origen, el segmento S3 en Europa. Dependiendo de la ubicación del usuario, esto puede llevar mucho tiempo, y los retrasos pueden incluso hacer que algunas solicitudes de los usuarios reboten y devuelvan un error de la página.

Si usamos CloudFront con el bucket S3, ya no habría solicitudes que atraviesan el mundo para acceder a nuestro contenido. Las solicitudes se enrutarían a la ubicación de borde con menos latencia; es decir, la más cercana en términos de velocidad de entrega.

CloudFront luego serviría el contenido en caché de forma rápida y directa al usuario solicitante cercano.

Si quieres ver como como haríamos esto, pásate por el laboratorio en el blog de Mauro.

Si quieres pasar a otro tema, en mi siguiente laboratorio veremos el Lab2 Route53 Geolocation

Taggs:
Write a comment

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información. Si está interesado en leer el aviso de privacidad pinche aquí.

ACEPTAR
Cookies y privacidad