LiveCommerce Blog

Tecnología, estrategia y resultados en ecommerce

ShopIn CDN - Sistema de Proxy y Caché de Imágenes

Arquitectura General
Este sistema implementa un proxy y caché de imágenes que opera como CDN (Content Delivery Network), cuyo objetivo es descargar imágenes desde URLs externas, redimensionarlas bajo demanda, almacenarlas en caché local y servirlas de forma eficiente mediante una capa de distribución.

Punto de entrada: url_image.php
El archivo principal actúa como controlador de entorno y decide la configuración de ejecución en función de la IP del cliente.

  • Modo desarrollo : si la IP está en la lista permitida, carga url_image_inc_test.php con debug habilitado y sin límite de tiempo.
  • Modo producción : para cualquier otra IP, carga url_image_inc.php con configuración optimizada, debug desactivado y timeout de 30 segundos.

Flujo principal de procesamiento

1. Decodificación de parámetros
El parámetro hash contiene datos codificados en base64 que se decodifican e interpretan como JSON estructurado, desde donde se extraen la URL original y las dimensiones solicitadas.

2. Sistema de caché jerárquico
Las imágenes se organizan usando el hash SHA1 de la URL original, distribuyendo los archivos en subdirectorios para evitar saturación por volumen.

Ejemplo de estructura: f3/a4/b2/f3a4b2c8d9e1...

  • Imagen original : almacenada sin sufijos de dimensiones.
  • Imagen redimensionada : almacenada con sufijo _[ancho]_[alto].[extensión].

3. Lógica de servicio de imágenes
La secuencia de resolución prioriza la eficiencia y la integridad del archivo.

  • Verificación de caché : si la versión redimensionada existe y es válida, se redirige a Cloudflare; si está corrupta, se elimina.
  • Caducidad específica : las imágenes del dominio cdn2.depau caducan cada 2 días y se eliminan automáticamente al superar ese umbral.
  • Generación : si no existe la imagen local, se descarga la original, se valida con getimagesize() y se redimensiona manteniendo proporciones.
  • Fallback : si el redimensionado falla, se intenta servir la versión _0_0; como último recurso se redirige a la URL original.

4. Sistema de descarga (downloadImage)
La función de descarga está diseñada para minimizar bloqueos y corrupción de archivos.

  • User-Agent completo simulando Chrome en macOS junto con headers modernos como Sec-Ch-Ua.
  • Timeout de 3 segundos para limitar consumo de recursos.
  • Escritura atómica mediante archivos temporales con nomenclatura aleatoria.
  • Validación de descarga exitosa antes de persistir.
  • Manejo de concurrencia para evitar colisiones.

5. Procesamiento de imágenes
Se utiliza la librería PHPImageWorkshop para cargar archivos locales, redimensionar con anclaje centro-centro (MM) y guardar con calidad 100% en el formato original o JPG por defecto, con soporte para JPG, PNG, GIF y BMP.

Características técnicas relevantes

Manejo de errores y validación

  • Lista blanca de extensiones permitidas.
  • Verificación estructural con getimagesize().
  • Eliminación automática de archivos corruptos.
  • Fallback a la imagen original ante fallos de redimensionado.

Optimizaciones de rendimiento

  • Caché distribuida en subdirectorios.
  • Headers HTTP con Expires configurado a 600 días.
  • Redirección a Cloudflare para servir contenido estático.
  • Limpieza de temporales tras el procesamiento.

Seguridad

  • Filtrado por IP para acceso a modo desarrollo.
  • Sanitización básica de URLs sustituyendo espacios por %20.
  • Validación estricta de tipos de archivo.
  • Límites de timeout para reducir superficie de ataques DoS.

Funciones auxiliares

  • gv() : extracción segura de valores desde arrays u objetos con fallback.
  • redirect() : redirección HTTP con headers de caché optimizados.
  • file_put_contents_force() : escritura forzada creando directorios si es necesario.
  • valid_extension_image() : validación de extensiones permitidas.

El resultado es un sistema CDN completo para imágenes con redimensionado dinámico, caché persistente en disco y distribución escalable apoyada en Cloudflare.

Sistema de CDN (Content Delivery Network) para procesamiento, redimensionado y caché de imágenes externas con integración Cloudflare.

PHP 7.4+
Cloudflare
GD / cURL

Descripción

Proxy inteligente que descarga imágenes desde URLs externas, las procesa, las almacena en caché local y las sirve a través de Cloudflare.

Arquitectura

Flujo de datos

URL Externa → Descarga → Caché Local → Procesamiento → Cloudflare CDN → Usuario Final

Estructura

/
├── url_image.php
├── url_image_inc.php
├── helpers.php
└── database_images_urls/

Instalación

  • PHP 7.4+
  • Extensiones: gd, curl, fileinfo
  • Permisos de escritura en database_images_urls/

Uso

Formato de URL

https://tu-dominio.com/url_image.php?hash=[datos_codificados]

Generación en PHP

$data = [
  'url' => 'https://ejemplo.com/imagen.jpg',
  'w'   => 300,
  'h'   => 200
];

$hash = base64_encode(json_encode($data));
$url  = "https://tu-dominio.com/url_image.php?hash=".$hash;

Generación en JavaScript

function generateImageUrl(originalUrl, width, height){
  const data = { url: originalUrl, w: width, h: height };
  const hash = btoa(JSON.stringify(data));
  return `https://tu-dominio.com/url_image.php?hash=${hash}`;
}

Características

Redimensionado
Mantiene proporciones
Caché
SHA1 jerárquico
Formatos
JPG, PNG, GIF, BMP
  • Validación con getimagesize()
  • Timeout descarga 3s
  • Escritura atómica
  • Headers HTTP con caché 600 días

Sistema de caché

database_images_urls/
└── f3/a4/b2/
    ├── f3a4b2c8d9e1...
    ├── f3a4b2c8d9e1..._300_200.jpg
└── f3a4b2c8d9e1..._150_150.png

Original: [hash_sha1]
Redimensionada: [hash_sha1]_[ancho]_[alto].[ext]

Flujo de procesamiento

  1. Decodificación de parámetros
  2. Validación
  3. Chequeo de caché
  4. Descarga
  5. Redimensionado
  6. Almacenamiento
  7. Redirección a Cloudflare

Funciones principales

downloadImage()

  • Timeout 3s
  • Validación de contenido
  • Escritura atómica

resizeAndSave()

  • Calidad 100%
  • Centrado automático
  • Multi-formato

Configuración de entornos

Producción
  • Debug desactivado
  • Timeout 30s
  • Optimizado para rendimiento
Desarrollo
  • Debug activado
  • Logs detallados
  • Restricción por IP

Mantenimiento

  • Limpieza automática de archivos corruptos
  • Caducidad específica para cdn2.depau
  • Monitorización de uso de disco

Troubleshooting

Imagen no se muestra

  • Verificar accesibilidad de la URL original
  • Comprobar permisos
  • Revisar logs del servidor

Procesamiento lento

  • Revisar conectividad externa
  • Comprobar carga del servidor
  • Validar timeouts

Licencia

Sistema propietario para ShopIn CDN.

Contribución

Modificaciones coordinadas con el equipo de desarrollo de ShopIn.

Compártelo:

¿Tienes alguna consulta?

Si tienes alguna pregunta o sabes la respuesta sobre algún comentario, no dudes en contribuir.
Responderemos rápidamente.
Puedes utilizar etiquetas BBCode para escribir negrita, enlaces, imágenes, etc...
Más información en la página oficial de BBCOde http://www.bbcode.org/ Ejemplo:
[url=http://google.com]links[/url], [color=red]colores[/color] [b]negrita[/b]...

¿Has visto los videos en nuestro canal de Youtube?

En nuestro canal de Youtube publicamos periódicamente mejoras y funcionalidades del software de ecommerce .