Artículo originado en https://medium.com/@hafiqiqmal93/blurry-image-detection-in-laravel-4c91168e00f1

Aspecto crucial de la experiencia del usuario: almacenar imágenes borrosas resta significativamente la calidad de un sitio web o aplicación. Este artículo profundiza en cómo detectar y gestionar imágenes borrosas usando Laravel con la ayuda de Python y OpenCV, garantizando que los medios de la aplicación se mantengan nítidos y atractivos.

El desafío de las imágenes borrosas

Las imágenes borrosas son más que una simple molestia visual; pueden socavar el profesionalismo de su sitio web o aplicación. En el comercio electrónico, listados de bienes raíces, galerías en línea o cualquier plataforma donde la calidad de la imagen sea primordial, garantizar la claridad es esencial. El desafío radica en detectar la borrosidad mediante programación.

Laravel al rescate

Laravel se puede combinar con Python para crear una solución eficaz para este problema. Al aprovechar la validación de archivos de Laravel junto con un script de Python que utiliza OpenCV, los desarrolladores pueden integrar perfectamente la detección de desenfoque en sus procesos de carga de archivos.

Concepto de detección de borrosidad

La detección de imágenes borrosas implica analizar la nitidez de la imagen. Esto normalmente se hace mediante el operador laplaciano, una herramienta matemática utilizada en el procesamiento de imágenes. El operador laplaciano mide la velocidad a la que cambia la intensidad de los píxeles y una variación más baja del laplaciano indica una imagen más borrosa.

Implementando en Laravel

En Laravel, podemos crear una regla de validación personalizada para verificar si la imagen está borrosa. Esta regla ejecuta un script de Python que utiliza el operador laplaciano para determinar la nitidez de la imagen. Analicemos el proceso:

Instalación OpenCV Python:

Instalar PIP (Ubuntu):

sudo apt install python3-pip

Instalar OpenCV usando PIP

pip3 install opencv-python

Es posible que desees considerar instalar bajo el usuario **www-data** si tu aplicación se ejecuta bajo **www-data**. En caso afirmativo, siga los siguientes comandos para instalar

sudo mkdir /var/www/.local

sudo mkdir /var/www/.cache

sudo chown www-data.www-data /var/www/.local

sudo chown www-data.www-data /var/www/.cache

sudo -H -u www-data pip3 install opencv-python

Crear secuencia de comandos de Python

import sys

import cv2

def get_image_laplacian_value(image_path):

    image = cv2.imread(image_path)

    gray_image = cv2.cvtColor(image, cv2.COLOR_BGR2GRAY)

    return cv2.Laplacian(gray_image, cv2.CV_64F).var()

if name == "main":

    if len(sys.argv) != 2:

        sys.exit(1)

    image_path = sys.argv[1]

    laplacian_value = get_image_laplacian_value(image_path)

    print(laplacian_value)

Crear regla de Laravel:

class ImageBlurDetectionRule implements ValidationRule

{

    public function validate(string $attribute, mixed $value, Closure $fail): void

    {

        if ( ! $value instanceof UploadedFile) {

            return;

        }

        // ignore if not image

        if ('' !== $value->getPath() && ! in_array($value->guessExtension(), ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'svg', 'webp'])) {

            return;

        }

        // get real path for the file

        $path = $value->getRealPath();

        $command = escapeshellcmd(config('image.python_path') . " blur_detection.py '{$path}'");

        $result = Process::path(base_path('scripts'))->run($command);

        if ( ! $result->successful()) {

            return;

        }

        if (trim($result->output()) 
            $fail(__('Blur image are not accepted. Please make sure your :attribute image is clearly visible.'));

        }

    }

}

Cómo funciona

La integración de Laravel con un script de Python para la detección de desenfoque funciona de manera perfecta, ofreciendo un enfoque sofisticado pero sencillo para garantizar la calidad de la imagen. Así es como se desarrolla el proceso:

Subir imagen

Cuando un usuario carga una imagen en la aplicación Laravel, se activa la regla de validación personalizada (ImageBlurDetectionRule).

Ejecución de la regla de validación

Esta regla primero verifica si el archivo cargado es realmente una imagen verificando su extensión. Si el archivo no es una imagen, el proceso se detiene aquí.

Invocación de script Python

Si el archivo es una imagen, la regla llama a un script de Python, blur_detection.py. La ruta de la imagen se pasa a este script como argumento de línea de comando.

Procesamiento de imágenes en Python:

• El script Python utiliza OpenCV para manejar el análisis de la imagen.
• El script lee la imagen y la convierte a escala de grises. Esta simplificación permite un análisis más sencillo sin la complejidad del color.
• Luego aplica el operador laplaciano a la imagen en escala de grises. El operador laplaciano es una herramienta matemática que resalta áreas de rápido cambio de intensidad, que suelen ser bordes de una imagen. Las imágenes borrosas tienen menos bordes y menos definidos, lo que da como resultado una variación menor del laplaciano.

Medición de borrosidad

El guión calcula la variación del laplaciano, que sirve como medida de la nitidez de la imagen. Una variación más baja indica una imagen más borrosa.

Evaluación de resultados:

• El script genera la varianza laplaciana como un valor numérico.
• De vuelta en Laravel, la regla de validación captura este resultado y verifica si el valor cae por debajo de un umbral predefinido. Este umbral determina si una imagen se considera lo suficientemente nítida.

Comentarios de validación

Si la imagen está demasiado borrosa (por ejemplo, la varianza laplaciana está por debajo del umbral), la regla de validación falla y el usuario recibe un mensaje que indica que la imagen está borrosa y debe verificarse.

Mejora de la experiencia del usuario

Al evitar la carga de imágenes borrosas y de baja calidad, esta solución mejora la experiencia general del usuario. Se solicita a los usuarios que carguen únicamente imágenes claras y de alta calidad, lo que mantiene el estándar visual de la aplicación.

Este proceso es altamente personalizable. Los desarrolladores pueden ajustar el umbral de borrosidad según las necesidades específicas de su aplicación. Tenga en cuenta que el umbral se basa en su observación. Para un uso avanzado, es posible que necesite ML para determinar el umbral. Además, la integración de Python en Laravel permite una mayor expansión hacia técnicas de procesamiento de imágenes más avanzadas, ofreciendo una solución flexible y sólida para gestionar la calidad de la imagen.

Aplicación práctica

Incorporar esta funcionalidad en su aplicación Laravel mejora la experiencia del usuario al evitar la carga de imágenes de baja calidad. Esto es particularmente útil en escenarios donde la claridad de la imagen es fundamental, como portafolios en línea, catálogos de productos o imágenes de perfil de usuario.

Personalización y flexibilidad

El umbral de borrosidad se puede ajustar según las necesidades específicas. Además, la integración de Python dentro de Laravel ofrece flexibilidad para incorporar técnicas de procesamiento de imágenes más avanzadas si es necesario.

Conclusión

La combinación de Laravel y Python para detectar imágenes borrosas es una solución poderosa. No sólo garantiza la calidad visual de su aplicación, sino que también mejora la experiencia general del usuario. Con este enfoque, los desarrolladores pueden mantener altos estándares para el contenido multimedia, lo que contribuye a una presencia en línea más pulida y profesional.

¿Has intentado implementar esta solución en tu proyecto Laravel? Comparta sus experiencias y cualquier conocimiento que haya obtenido en los comentarios a continuación. ¡Sigamos elevando juntos los estándares del desarrollo web!