Skip to main content

Media Library Filament de Ralph J. Smit + Spatie Media Library + Livewire

Introducción

A menudo, es más efectivo seguir un enfoque lógico al resolver problemas, pero en ocasiones nos encontramos con obstáculos. En esos momentos, recurrimos a Internet en busca de respuestas. También consultamos a inteligencias artificiales como ChatGPT, Claude, Gemini o DeepSeek, pero si no encuentran soluciones exactas, pueden llevarnos por caminos erróneos, generando respuestas confusas.

En mi caso, persistí en resolver un problema y me di cuenta de que me faltaba un elemento por revisar: Livewire.

Error de tamaño en la subida de imágenes

En mi aplicación de desarrollo, comencé a utilizar Media Library Filament, que se basa en Spatie Media Library.

Dado que manejo archivos grandes de imágenes, lo primero que hice fue buscar los límites de tamaño permitidos.

Lo habitual es verificar:

  • PHP (php.ini)
  • Media Library (config/media-library.php)

Sin embargo, a pesar de haber configurado un límite de 30 MB en todas las configuraciones, continuaba recibiendo el siguiente error:

The uploads.2f138bcc-28d3-40b2-a941-a516d750c1d7 field must not be greater than 12288 kilobytes.

Ralphjsmit Media Library Manager Livewire Issue

Era evidente que el problema era de configuración, pero ¿dónde estaba el error?

Todas las respuestas de inteligencia artificial y los tutoriales de Laracast no ofrecían nada nuevo, ya que solo repetían lo que ya había verificado:

En el php.ini, teníamos upload_max_filesize=64M y en config/media-library.php 'max_file_size' => 1024 * 1024 * 30, // 30MB.

Sin embargo, a menudo olvido que muchos paquetes dependen de otros, como Filepond y Livewire... ¿Oh, mencioné Livewire?

Es fundamental revisar su configuración, que efectivamente existe. Puedes publicarla usando el siguiente comando:

php artisan livewire:publish --config

En la configuración, encontramos lo siguiente:

'temporary_file_upload' => [
    'disk' => null,        // Ejemplo: 'local', 's3'              | Predeterminado: 'default'
    'rules' => null,       // Ejemplo: ['file', 'mimes:png,jpg']  | Predeterminado: ['required', 'file', 'max:12288'] (12MB)
    'directory' => null,   // Ejemplo: 'tmp'                      | Predeterminado: 'livewire-tmp'
    'middleware' => null,  // Ejemplo: 'throttle:5,1'             | Predeterminado: 'throttle:60,1'
    'preview_mimes' => [   // Tipos de archivos admitidos para URLs pre-firmadas temporales...
        'png', 'gif', 'bmp', 'svg', 'wav', 'mp4',
        'mov', 'avi', 'wmv', 'mp3', 'm4a',
        'jpg', 'jpeg', 'mpga', 'webp', 'wma',
    ],
    'max_upload_time' => 5, // Duración máxima (en minutos) antes de que una carga sea invalidada...
    'cleanup' => true,      // ¿Debería limpiar cargas temporales más antiguas de 24 horas?
],

Me había pasado por alto revisar la configuración de Livewire.

Para corregir el límite de tamaño de carga, puedes modificar la regla correspondiente:

'rules' => 'file|max:30720', // Ejemplo: ['file', 'mimes:png,jpg']  | Predeterminado: ['required', 'file', 'max:12288'] (12MB)
Aviso

Esta documentación y su contenido, no implica que funcione en tu caso o determinados casos. También implica que tienes conocimientos sobre lo que trata, y que en cualquier caso tienes copias de seguridad. El contenido el contenido se entrega, tal y como está, sin que ello implique ningún obligación ni responsabilidad por parte de Castris

Si necesitas soporte profesional puedes contratar con Castris soporte profesional.

Back to top