Guía para Crear una Función de CloudFront de AWS para Autenticación Básica en tu Sitio Web

Guía para Crear una Función de CloudFront de AWS para Autenticación Básica en tu Sitio Web

¡Hola a todos! En este post, les voy a mostrar cómo crear una función de CloudFront en AWS para implementar una autenticación básica antes de que los usuarios puedan acceder a tu sitio web. AWS CloudFront es un servicio de entrega de contenido que acelera la distribución de contenido estático y dinámico a los usuarios finales. Con las funciones de CloudFront, puedes agregar lógica personalizada directamente en el borde de la red, lo que permite implementar medidas de seguridad como la autenticación básica.

Mientras buscaba soluciones en Internet, me encontré con el uso de AWS Lambda para implementar autenticación básica. Sin embargo, AWS ha habilitado la posibilidad de crear funciones directamente en CloudFront, lo que simplifica enormemente el proceso y reduce la latencia. Decidí probar esta nueva funcionalidad y descubrí que es una opción poderosa y fácil de implementar para proteger mi sitio web.

Paso 1: Configuración Inicial

Antes de comenzar, asegúrate de tener una cuenta de AWS y haber creado una distribución de CloudFront para tu sitio web. Si no lo has hecho, sigue estos pasos:

  1. Inicia sesión en la Consola de Administración de AWS.
  2. Navega a CloudFront y selecciona "Create Distribution".
  3. Configura tu distribución con el origen y las configuraciones deseadas.

Paso 2: Crear una Función de CloudFront

  1. En la Consola de Administración de AWS, ve a la sección de CloudFront.
  2. En el menú de la izquierda, selecciona "Functions" y luego "Create Function".
  3. Ponle un nombre a tu función, por ejemplo, BasicAuthFunction.
  4. Haz clic en "Create".

Paso 3: Escribir el Código de la Función

Ahora, vamos a escribir el código para nuestra función de autenticación básica. Es importante destacar que en el siguiente ejemplo, las credenciales (nombre de usuario y contraseña) están codificadas de manera directa en el código. En un entorno de producción, esto no es una práctica segura ya que expone las credenciales de manera potencialmente vulnerable. Para mejorar la seguridad, se recomienda utilizar métodos seguros para la gestión de credenciales, como variables de entorno seguras o sistemas de gestión de secretos.

Aquí tienes una versión comentada del código, adaptada para una mejor seguridad:

BasicAuthFunction.js
GitHub Gist: instantly share code, notes, and snippets.

Paso 4: Publicar la Función y Probar

    • En la página de la función recién creada, selecciona "Test" para verificar que el código se ejecuta sin errores, aunque no lo ejecutes, nosotros lo probaremos más adelante.
    • Una vez verificado, selecciona "Publish" para publicar la función.

Paso 5: Implementar la Función en tu Distribución de CloudFront:

    • Navega a tu distribución de CloudFront y selecciona "Behaviors".
    • Edita el comportamiento (behavior) que deseas proteger con autenticación básica.
    • En la sección "Function associations", selecciona "Add function association".
    • Configura la asociación para ejecutar tu función en la fase de "Viewer Request" (solicitud del visor).
    • Guarda los cambios.

Paso 6: Probar la Autenticación:

    • Después de implementar la función, intenta acceder a tu sitio web. Deberías ver una ventana emergente solicitando las credenciales. Ingresa el usuario y la contraseña que configuraste para acceder al contenido.
    • Asegúrate de hacer las pruebas en una ventana de incógnito para evitar problemas con el almacenamiento en caché del navegador.

Notas Importante sobre la Prueba de la Función

Dado que este código maneja la autenticación básica, no podrás probarlo completamente dentro del entorno de la consola de AWS. Para asegurarte de que funciona correctamente, sigue estos pasos:

  1. Implementa esta función en una distribución de prueba de CloudFront.
  2. Realiza las pruebas de acceso a tu sitio web desde una ventana de incógnito para evitar problemas con el almacenamiento en caché del navegador.
  3. Una vez que hayas verificado que la autenticación funciona correctamente en el entorno de prueba, puedes implementarla en tu distribución de producción.

Paso Final: Implementar y Probar

Después de implementar la función, intenta acceder a tu sitio web. Deberías ver una ventana emergente solicitando las credenciales. Ingresa el usuario y la contraseña que configuraste para acceder al contenido.

¡Buena suerte con tu configuración!