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 conPillow
1. Preparación
- Crea dos buckets en Amazon S3:
source-bucket
ydest-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 |