Volver al Blog

Proxy de Archivos Multimedia en un Entorno de Desarrollo Local de WordPress con DDEV

2023-07-043 min de lectura

El proxy de archivos multimedia en un entorno de desarrollo local de WordPress es una habilidad esencial para los desarrolladores que desean asegurarse de que su sitio local refleje el contenido y la funcionalidad del sitio de producción en vivo. Descargar todos los archivos multimedia a tu entorno local podría no ser la mejor solución, especialmente si el sitio de producción tiene una biblioteca de medios grande. En su lugar, puedes configurar tu entorno de desarrollo local para hacer proxy de las solicitudes de medios al servidor de producción. Para el desarrollo local, estoy usando DDEV, una herramienta de código abierto que hace que sea extremadamente sencillo poner en marcha entornos de desarrollo PHP locales en cuestión de minutos. En esta entrada del blog, compartiré una solución que me resultó útil para el proxy de archivos multimedia en un entorno DDEV local sin usar un plugin.

El Problema

Mientras trabajaba con WordPress localmente usando DDEV, necesitaba una forma de mostrar archivos multimedia sin descargarlos realmente a mi entorno local. Mi objetivo era hacer que WordPress cargara estos archivos desde el servidor de producción cada vez que se solicitaran.

La Solución

Podemos lograr esto agregando funciones personalizadas al archivo functions.php de nuestro tema de WordPress. Estas funciones cambiarán las URL de los adjuntos y las miniaturas para que apunten al servidor de producción.

Aquí tienes el fragmento de código que puedes añadir a tu archivo functions.php:

if ($_SERVER['HTTP_HOST'] == 'your-local-ddev-url') {

    function replace_domain($url) {
        return str_replace('https://your-local-ddev-url', 'https://your-production-url', $url);
    }

    function rewrite_attachment_url($url) {
        return replace_domain($url);
    }
    add_filter('wp_get_attachment_url', 'rewrite_attachment_url');

    function rewrite_thumbnail_attributes($attr, $attachment, $size) {
        if (isset($attr['srcset'])) {
            $attr['srcset'] = replace_domain($attr['srcset']);
        }
        return $attr;
    }
    add_filter('wp_get_attachment_image_attributes', 'rewrite_thumbnail_attributes', 10, 3);

}

Reemplaza your-local-ddev-url con la URL de tu entorno DDEV local y your-production-url con la URL de tu servidor de producción.

Cómo Funciona

  • La función replace_domain toma una URL como entrada y reemplaza el dominio local con el dominio de producción.
  • La función rewrite_attachment_url utiliza el filtro wp_get_attachment_url para cambiar las URL de los archivos adjuntos.
  • La función rewrite_thumbnail_attributes cambia el atributo srcset para las imágenes en miniatura. Esto es útil cuando tu tema utiliza imágenes responsivas con diferentes tamaños.

DDEV: Una Gran Herramienta para el Desarrollo Local

DDEV es una herramienta de código abierto que te ayuda a configurar rápidamente entornos de desarrollo PHP locales con Docker. Es increíblemente fácil de usar y puede acelerar drásticamente tu flujo de trabajo de desarrollo. Al usar DDEV para tu desarrollo local de WordPress, puedes asegurarte de que tu entorno sea coherente con tu servidor de producción, lo cual es crucial para evitar el problema de "funciona en mi máquina".

Si eres nuevo en DDEV y quieres saber cómo configurarlo para WordPress y Drupal, tengo una guía que te llevará a través del proceso de configuración de un sitio local con DDEV. Consulta mi publicación anterior: Cómo Configurar un Sitio Local de WordPress y Drupal con DDEV.

Conclusión

Al hacer proxy de archivos multimedia desde un servidor de producción, puedes ahorrar espacio y tiempo en tu entorno de desarrollo local. Esta solución es especialmente útil cuando se utiliza DDEV para sitios grandes de WordPress con extensas bibliotecas de medios. Ten siempre en cuenta la carga que esto podría añadir al servidor de producción y asegúrate de que tu entorno de producción pueda manejar el tráfico adicional. ¡Feliz codificación!