Tutorial: configuración de un sitio web estático en Amazon S3 - Amazon Simple Storage Service

Tutorial: configuración de un sitio web estático en Amazon S3

Puede configurar un bucket de Amazon S3 para que funcione como un sitio web. En este ejemplo se muestran los pasos para el alojamiento de un sitio web en Amazon S3.

Paso 1: crear un bucket

Las siguientes instrucciones proporcionan información general sobre cómo crear los buckets para el alojamiento de sitios web. Para obtener instrucciones detalladas paso a paso sobre la creación de un bucket, consulte Crear un bucket.

Para crear un bucket

  1. Inicie sesión en la AWS Management Console y abra la consola de Amazon S3 en https://console.aws.amazon.com/s3/.

  2. Elija Create bucket (Crear bucket).

  3. Introduzca el Bucket name (Nombre del bucket) (por ejemplo: example.com).

  4. Elija la región en la que desea crear el bucket.

    Elija una región que esté cercana geográficamente para minimizar la latencia y los costos, o para cumplir los requisitos normativos. La región que elija determina el punto de enlace de sitio web de Amazon S3. Para obtener más información, consulte Puntos de enlace de sitio web.

  5. Para aceptar la configuración predeterminada y crear el bucket, elija Create (Crear).

Paso 2: habilitar el alojamiento de un sitio web estático

Después de crear un bucket, puede habilitar el alojamiento de sitios web estático para su bucket. Puede crear un nuevo bucket o utilizar un bucket existente.

Para habilitar el alojamiento estático de sitios web

  1. Inicie sesión en la AWS Management Console y abra la consola de Amazon S3 en https://console.aws.amazon.com/s3/.

  2. En la lista Buckets, seleccione el nombre del bucket para el que desea habilitar el alojamiento de sitios web estáticos.

  3. Seleccione Properties (Propiedades).

  4. Elija Static website hosting (Alojamiento de sitios web estáticos), elija Edit (Editar).

  5. Elija Use this bucket to host a website (Usar este bucket para alojar un sitio web).

  6. En Static website hosting (Alojamiento de sitios web estáticos), elija Enable (Habilitar).

  7. En Index Document (Documento de índice), escriba el nombre de archivo del documento de índice, normalmente index.html.

    El nombre del documento de índice distingue entre mayúsculas y minúsculas y debe coincidir exactamente con el nombre del archivo del documento de índice HTML que tiene previsto cargar en el bucket de S3. Al configurar un bucket para el alojamiento de sitios web, debe especificar un documento de índice. Amazon S3 devuelve este documento de índice cuando se reciben solicitudes en el dominio raíz o en cualquiera de las subcarpetas. Para obtener más información, consulte Configurar un documento de índice.

  8. Si desea proporcionar su propio documento de error personalizado para los errores de clase 4XX, escriba el nombre de archivo del documento de error personalizado en Error document (Documento de error).

    El nombre del documento de error distingue entre mayúsculas y minúsculas y debe coincidir exactamente con el nombre del archivo del documento de error HTML que tiene previsto cargar en el bucket de S3. Si no especifica un documento de error personalizado y se produce un error, Amazon S3 devuelve un documento de error HTML predeterminado. Para obtener más información, consulte Configurar un documento de error personalizado .

  9. (Opcional) Si desea especificar reglas de redireccionamiento avanzadas, en Redirection rules (Reglas de redireccionamiento), especifique JSON para describir las reglas.

    Por ejemplo, puede dirigir condicionalmente las solicitudes según nombres de clave de objeto o prefijos específicos en la solicitud. Para obtener más información, consulte Configurar reglas de redireccionamiento para utilizar redireccionamiento condicional avanzado.

  10. Elija Save changes.

    Amazon S3 permite activar el alojamiento de sitios web estáticos para su bucket. En la parte inferior de la página, en Static website hosting (Alojamiento de sitios web estáticos), verá el punto de enlace del sitio web para su bucket.

  11. En Static website hosting (Alojamiento de sitios web estáticos), anote el valor de Endpoint (Punto de enlace).

    Endpoint (Punto de enlace) es el punto de enlace del sitio web de Amazon S3 para el bucket. Cuando termine de configurar el bucket como un sitio web estático, puede utilizar este punto de enlace para probar el sitio web.

Paso 3: editar la configuración de bloqueo de acceso público

De forma predeterminada, Amazon S3 bloquea el acceso público a su cuenta y sus buckets. Si desea utilizar un bucket para alojar un sitio web estático, puede utilizar estos pasos para editar la configuración de bloqueo de acceso público.

aviso

Antes de completar este paso, consulte Bloquear el acceso público a su almacenamiento de Amazon S3 para asegurarse de que comprende y acepta los riesgos que implica otorgar el acceso público. Cuando desactiva la configuración de acceso público de bloqueo para que el bucket sea público, cualquier usuario de Internet puede acceder al bucket. Le recomendamos que bloquee todo el acceso público a sus buckets.

  1. Abra la consola de Amazon S3 en https://console.aws.amazon.com/s3.

  2. Elija el nombre del bucket que ha configurado como sitio web estático.

  3. Elija Permissions (Permisos).

  4. En Block public access (bucket settings) (Bloquear acceso público [configuración de bucket]), elija Edit (Editar).

  5. Desactive Block all public access (Bloquear todo el acceso público) y elija Save changes (Guardar cambios).

    aviso

    Antes de completar este paso, consulte Bloquear el acceso público a su almacenamiento de Amazon S3 para asegurarse de que comprende y acepta los riesgos que implica otorgar el acceso público. Cuando desactiva la configuración de acceso público de bloqueo para que el bucket sea público, cualquier usuario de Internet puede acceder al bucket. Le recomendamos que bloquee todo el acceso público a sus buckets.

    Amazon S3 desactiva la configuración del bloqueo de acceso público para su bucket. Para crear un sitio web público y estático, es posible que también tenga que editar la configuración del bloqueo de acceso público para su cuenta antes de agregar una política de bucket. Si la configuración de cuenta para el bloqueo de acceso público está activada actualmente, verá una nota en Block public access (bucket settings) [Bloqueo de acceso público (configuración de bucket)].

Paso 4: agregar una política de bucket para que el contenido del bucket sea público

Después de editar la configuración de acceso público de bloques de S3, debe agregar una política de bucket para garantizar el acceso de lectura público a su bucket. Cuando concede permiso de lectura público, cualquier persona de Internet puede acceder a su bucket.

importante

La política que se muestra a continuación es solo un ejemplo y permite acceso completo al contenido del bucket. Antes de continuar con este paso, revise ¿Cómo puedo proteger los archivos en mi bucket de Amazon S3? para asegurarse de que comprende las prácticas recomendadas para proteger los archivos en el bucket de S3 y los riesgos que implica la concesión de acceso público.

  1. En Buckets, elija el nombre del bucket.

  2. Elija Permissions (Permisos).

  3. En Bucket Policy (Política de bucket), elija Edit (Editar).

  4. Para conceder acceso público de lectura a su sitio web, copie la siguiente política de bucket y péguela en el Bucket policy editor (Editor de políticas de bucket).

    { "Version": "2012-10-17", "Statement": [ { "Sid": "PublicReadGetObject", "Effect": "Allow", "Principal": "*", "Action": [ "s3:GetObject" ], "Resource": [ "arn:aws:s3:::Bucket-Name/*" ] } ] }
  5. Actualice el valor de Resource para el nombre de su bucket.

    En la política de bucket de ejemplo anterior, Bucket-Name es un marcador de posición para el nombre del bucket. Para utilizar esta política de bucket con su propio bucket, debe actualizar este nombre para que coincida con su nombre de bucket.

  6. Elija Save changes.

    Aparecerá un mensaje que indicará que la política de bucket se ha agregado correctamente.

    Si ve un error que indica Policy has invalid resource, confirme que el nombre del bucket en la política del bucket coincide con el nombre de su bucket. Para obtener información acerca de cómo agregar una política de bucket, consulte ¿Cómo añado una política de bucket de S3?

    Si recibe un mensaje de error y no puede guardar la política de bucket, compruebe la configuración del bloqueo de acceso público para la cuenta y el bucket para confirmar que permite acceso público al bucket.

Paso 5: configurar un documento de índice

Cuando habilite el alojamiento de sitio web estático para su bucket, escriba el nombre del documento de índice (por ejemplo, index.html). Después de habilitar el alojamiento de sitio web estático para el bucket, cargue un archivo HTML con el nombre de este documento de índice en el bucket.

Para configurar el documento de índice

  1. Cree un archivo index.html.

    Si no tiene un archivo index.html, puede usar el siguiente HTML para crear uno:

    <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>My Website Home Page</title> </head> <body> <h1>Welcome to my website</h1> <p>Now hosted on Amazon S3!</p> </body> </html>
  2. Guarde el archivo de índice localmente.

    El nombre del archivo de documento de índice debe coincidir exactamente con el nombre del documento de índice que especifique en el cuadro de diálogo Static website hosting (Alojamiento de sitio web estático). El nombre del documento de índice distingue entre mayúsculas y minúsculas. Por ejemplo, si escribe index.html en el nombre del Index document (Documento de índice) en el cuadro de diálogo Static website hosting (Alojamiento de sitio web estático), el nombre del archivo de documento de índice también debe ser index.html y no Index.html.

  3. Inicie sesión en la AWS Management Console y abra la consola de Amazon S3 en https://console.aws.amazon.com/s3/.

  4. En la lista Buckets, elija el nombre del bucket que desea utilizar para alojar un sitio web estático.

  5. Habilite el alojamiento de sitios web estáticos para su bucket e introduzca el nombre exacto del documento de índice (por ejemplo: index.html). Para obtener más información, consulte Habilitar el alojamiento de sitios web.

    Después de habilitar el alojamiento estático del sitio web, continúe con el paso 6.

  6. Para cargar el documento de índice en el bucket, realice una de las siguientes acciones:

    • Arrastre y suelte el archivo de índice en la lista de buckets de la consola.

    • Elija Upload (Cargar) y siga las instrucciones para elegir y cargar el archivo de índice.

    Para obtener instrucciones paso a paso, consulte Carga de objetos.

  7. (Opcional) Cargue otros contenidos del sitio web en su bucket.

Paso 6: configurar un documento de error

Cuando habilite el alojamiento de sitios webs estáticos para el bucket, escriba el nombre del documento de error (por ejemplo, 404.html). Después de habilitar el alojamiento de sitios web estáticos para el bucket, cargue un archivo HTML con el nombre de este documento de error en el bucket.

Para configurar un documento de error,

  1. Cree un documento de error, por ejemplo 404.html.

  2. Guarde el archivo de documento de error localmente.

    El nombre del documento de error distingue mayúsculas y minúsculas y debe coincidir exactamente con el nombre que escriba al habilitar el alojamiento de sitios web estáticos. Por ejemplo, si escribe 404.html en el nombre del Error document (Documento de error) en el cuadro de diálogo Static website hosting (Alojamiento de sitio web estático), el nombre del archivo del documento de error también debe ser 404.html.

  3. Inicie sesión en la AWS Management Console y abra la consola de Amazon S3 en https://console.aws.amazon.com/s3/.

  4. En la lista Buckets, elija el nombre del bucket que desea utilizar para alojar un sitio web estático.

  5. Habilite el alojamiento de sitios web estáticos para su bucket y escriba el nombre exacto del documento de error (por ejemplo: 404.html). Para obtener más información, consulte Habilitar el alojamiento de sitios web.

    Después de habilitar el alojamiento estático del sitio web, continúe con el paso 6.

  6. Para cargar el documento de error en el bucket, realice una de las siguientes acciones:

    • Arrastre y suelte el archivo del documento de error a la lista de buckets de la consola.

    • Elija Upload (Cargar) y siga las instrucciones para elegir y cargar el archivo de índice.

    Para obtener instrucciones paso a paso, consulte Carga de objetos.

Paso 7: probar el punto de enlace del sitio web

Después de configurar el alojamiento de sitios web estáticos para el bucket, puede probar el punto de enlace del sitio web.

nota

Amazon S3 no admite el acceso HTTPS al sitio web. Si desea usar HTTPS, puede emplear Amazon CloudFront para atender a un sitio web estático alojado en Amazon S3.

Para obtener más información, consulte Cómo usar CloudFront para dar servicio a un sitio web estático alojado en Amazon S3 y Requerir HTTPS para la comunicación entre lectores y CloudFront.

  1. En Buckets, elija el nombre del bucket.

  2. Seleccione Properties (Propiedades).

  3. En la parte inferior de la página, en Static website hosting (Alojamiento de sitios web estáticos), elija el punto de enlace del sitio web del bucket.

    El documento de índice se abre en una ventana independiente del explorador.

Ahora puede alojar un sitio web en Amazon S3. Este sitio web está disponible en el punto de enlace del sitio web de Amazon S3. Sin embargo, es posible que tenga un dominio, como example.com, que desee utilizar para distribuir el contenido del sitio web creado. Es posible que también desee utilizar el soporte para dominio raíz de Amazon S3 para distribuir las solicitudes para http://www.example.com y http://example.com. Esto requiere pasos adicionales. Para ver un ejemplo, consulte Configuración de un sitio web estático mediante un dominio personalizado registrado con Route 53.

Paso 8: eliminar

Si creó un sitio web estático solo como parte de un ejercicio de aprendizaje, elimine los recursos de AWS que asignó para dejar de acumular cargos. Después de que haya eliminado los recursos de AWS, el sitio web ya no estará disponible. Para obtener más información, consulte Eliminar un bucket.