Apoya mi contenido: 

Tabla de contenido

Tutorial: Crear un Generador de Thumbnails y Optimizador de Imágenes en Serverless

En este tutorial aprenderás cómo implementar un servicio serverless usando AWS Lambda y S3 para generar automáticamente thumbnails y optimizar imágenes cuando se suban a un bucket.

Tecnologías utilizadas

  • AWS Lambda
  • Amazon S3
  • Node.js con sharp o Python con Pillow

1. Preparación

  • Crea dos buckets en Amazon S3: source-bucket y dest-bucket.
  • Asigna permisos en IAM para que Lambda pueda acceder a ambos buckets y escribir logs.

2. Código del Lambda (Node.js)


import { S3Client, GetObjectCommand, PutObjectCommand } from '@aws-sdk/client-s3';
import sharp from 'sharp';
import { Readable } from 'stream';

export const handler = async (event) => {
  const srcBucket = event.Records[0].s3.bucket.name;
  const srcKey = decodeURIComponent(event.Records[0].s3.object.key.replace(/\+/g, " "));
  const dstBucket = srcBucket + "-resized";
  const dstKey = "resized-" + srcKey;

  const s3 = new S3Client({ region: 'us-east-1' });
  const response = await s3.send(new GetObjectCommand({ Bucket: srcBucket, Key: srcKey }));
  const stream = response.Body;
  const buffer = Buffer.concat(await stream.toArray());

  const outputBuffer = await sharp(buffer).resize(200).toBuffer();

  await s3.send(new PutObjectCommand({
    Bucket: dstBucket,
    Key: dstKey,
    Body: outputBuffer,
    ContentType: "image"
  }));

  console.log(`Resized and uploaded ${dstBucket}/${dstKey}`);
};

3. Configurar trigger en S3

  • Activa el trigger desde S3 hacia Lambda al cargar nuevos archivos en source-bucket.
  • Evita bucles si Lambda escribe de nuevo al bucket original.

4. Pruebas

  • Usa eventos simulados desde la consola Lambda.
  • Sube imágenes reales y comprueba resultados en el bucket de destino.

5. Mejoras opcionales

  • Genera múltiples tamaños con Step Functions.
  • Integra validaciones de tipo/medidas.

6. Alternativa: Thumbor

Thumbor es un sistema open-source para manipular imágenes en tiempo real. Es ideal si necesitas recorte inteligente, filtros avanzados y escalabilidad.

Resumen del Flujo

Paso Descripción
Subida Usuario carga imagen al source-bucket
Trigger Lambda se ejecuta automáticamente
Resize Lambda procesa y redimensiona la imagen
Almacenamiento La imagen optimizada se guarda en dest-bucket
Opcional Usar Step Functions o Thumbor para funciones más avanzadas

¡Comunícate con nosotros!

Ads Blocker Image Powered by Code Help Pro

Bloqueador de anuncios detectado!!!

 Por favor, apóyanos desactivando este bloqueador de anuncios para seguir creando contenido que te gusta 🙏🏼

Powered By
Best Wordpress Adblock Detecting Plugin | CHP Adblock