Aprende a instalar y usar el módulo lwip en Windows fácilmente en tu proyecto Node.js.

Cómo instalar y usar lwip (Procesador ligero de imágenes) en Windows para Node.js

El procesamiento de imágenes es una tarea pesada para manejarse en Javascript, por lo tanto, si deseas brindar una experiencia de uso fluida en la manipulación y el procesamiento de imágenes, elegirás lwip entre otras bibliotecas de procesamiento de imágenes disponibles para node.js (como jimp , una imagen módulo de procesamiento escrito en javascript puro) porque lwip usa un módulo nativo escrito en C++, que hará que el procesamiento de imágenes sea rápido y fluido.

El módulo lwip proporciona capacidades completas, rápidas y sencillas de procesamiento y manipulación de imágenes. No hay dependencias de tiempo de ejecución externas, lo que significa que no tiene que instalar nada más en su sistema.

Formatos admitidos

Decodificación (lectura):

  • JPEG, 1 y 3 canales (escala de grises y RGB).
  • PNG, transparencia compatible.
  • GIF, transparencia compatible. Los GIF animados se pueden leer, pero solo se recuperará el primer fotograma.

Codificación (escritura):

  • JPEG, 3 canales (RGB).
  • PNG (sin pérdida), 3 canales (RGB) o 4 canales (RGBA).
  • GIF (sin animaciones)

En este artículo, aprenderá cómo instalar y usar el módulo lwip en su proyecto node.js fácilmente en un par de minutos.

1. Instale node-gyp a nivel mundial

Necesitará node-gyp para poder usar el módulo lwip. Continúe con la instalación de node-gyp como una variable global en el símbolo del sistema del nodo ejecutando el siguiente comando:

npm install -g node-gyp

node-gyp es una herramienta de línea de comandos multiplataforma escrita en Node.js para compilar módulos complementarios nativos para Node.js. Incluye el proyecto gyp utilizado por el equipo de Chromium y elimina el dolor de lidiar con las diversas diferencias en las plataformas de construcción.

2. Instalación de las herramientas necesarias

Para trabajar con lwip necesitaremos las siguientes herramientas disponibles en el sistema:

  • Entorno de compilación de Visual C++.
  • Python v2.7.x , las versiones v3.x no son compatibles con node-gyp.

Opción 1: instalación automática

Ejecute el siguiente comando en el símbolo del sistema del nodo ( ejecutar como administrador ):

npm install --global --production windows-build-tools

Este módulo instalará python 2.7 y el compilador de Visual Studio C ++ . La instalación puede tardar un poco, sin embargo, facilitará el proceso de instalación.

Windows-build-tools setup and python

Opción 2: instalación manual

Vaya al área de descargas en el sitio web oficial de Python y descargue el último instalador 2.7.xy continúe con la instalación como lo haría con cualquier instalador. No olvide agregar Python en su variable de entorno seleccionando la opción en la configuración.

Python 2.7 installer windows setup environment variable

En caso de que tenga otra versión de Python (es decir, v3), puede identificar qué versión de Python usa node-gyp configurando la variable ' --python ':

node-gyp --python /path/to/python2.7

Si se llama a node-gyp a través de npm y tiene varias versiones de Python instaladas, entonces puede establecer la clave de configuración 'python' de npm en el valor apropiado:

npm config set python /path/to/executable/python2.7

Ahora que tiene Python, solo necesitamos el entorno de compilación de Visual C++. Esto se puede instalar mediante la configuración del entorno de compilación de Visual C ++ aquí o la instalación de Visual Studio 2015 (o modificar una instalación existente) y seleccionar Herramientas comunes para Visual C ++ durante la instalación. Esto también funciona con las ediciones gratuitas Community y Express for Desktop.

Una vez que se complete la instalación del entorno de compilación de Visual C ++, ejecute el siguiente comando en el símbolo del sistema del nodo para establecer la versión de Visual Studio en 2015 en la configuración:

npm config set msvs_version 2015

Y estás listo para empezar. Si los pasos anteriores no le funcionaron, visite las Pautas de Node.js de Microsoft para Windows para obtener sugerencias adicionales.

3. Instale lwip en el proyecto

Ahora que tenemos todas las herramientas necesarias para compilar el módulo nativo de lwip, podemos empezar a usarlo, así que finalmente procedamos con la instalación del módulo ejecutando el siguiente comando en el símbolo del sistema del nodo:

npm install lwip

Se iniciará la descarga del módulo e inmediatamente se iniciará el proceso de compilación (que podría llevar un tiempo). Para probar si hicimos todo correctamente, vamos a manipular la siguiente imagen ( image.jpg):

Not now please meme code

Y un pequeño script para manipularlo usando lwip en node.js (index.js):

var lwip = require('lwip');

lwip.open('image.jpg', function(err, image){
    // comprobar err ...
    // defina un lote de manipulaciones y guárdelo en el disco como JPEG:
    image.batch()
    .scale(0.75)          // escala al 75%
    .rotate(45, 'white')  // girar 45 grados en el sentido de las agujas del reloj (relleno blanco)
    .writeFile('output.jpg', function(err){
        if(err){
            console.log(err);
        }
    });
});

Guarde el código en un archivo js (en este caso index.js) y pruebe el script usando:

node index.js

El script anterior debería crear una imagen (ouput.jpg) con la siguiente imagen:

Not now orientation lwip module

Todas las operaciones son asincrónicas y el procesamiento se lleva a cabo en un grupo de subprocesos administrado por libuv que es parte de NodeJS. Este grupo de subprocesos es independiente del bucle de eventos utilizado para procesar las solicitudes HTTP, por lo que el uso de lwip no debería afectar significativamente el manejo de las solicitudes HTTP por una aplicación web. Sin embargo, el grupo de subprocesos se comparte con otros módulos nativos con subprocesos, como los que proporcionan E / S de base de datos y sistema de archivos.

El tamaño de grupo de subprocesos predeterminado de 4 será apropiado para la mayoría de las aplicaciones. Sin embargo, si su aplicación procesa regularmente muchas imágenes al mismo tiempo y desea aprovechar al máximo un sistema multinúcleo o evitar que el trabajo pesado de procesamiento de imágenes retrase la E / S de la base de datos o del sistema de archivos, es posible que desee aumentar el tamaño del grupo de subprocesos configurando la UV_THREADPOOL_SIZEvariable ambiental al proceso de NodeJS, por ejemplo:

UV_THREADPOOL_SIZE=8 node index.js

4. Utilice lwip

Todas las operaciones se realizan en un imageobjeto. Un objeto image se puede obtener mediante:

  1. Abrir un archivo de imagen existente o un búfer con el openmétodo.
  2. Creando un nuevo objeto de imagen con el createmétodo.
  3. Clonando un objeto de imagen existente con el image.clonemétodo.
  4. Extraer una subimagen de un objeto de imagen existente con el image.extractmétodo.

Aquí encontrará un par de ejemplos de tareas extrañas que puede lograr con lwip:

Creando una imagen

La creación de una imagen es útil cuando se quiere tomar la imagen como un canvas en el que se van a renderizar o modificar más imágenes, etc. El tercer parámetro proporciona el color del lienzo, por defecto es transparente.

var lwip = require('lwip');

lwip.create(500, 500, 'yellow', function(err, image){
    image.writeFile('myimage.jpg', function(err){
        if(err){
            console.log(err);
        }
    });
});

El fragmento anterior creará una imagen (cuadrada) de 500x500px con fondo amarillo.

Exportando una imagen a base64

Puede recuperar el contenido base64 de una imagen convirtiendo el búfer en una cadena.

var lwip = require('lwip');

lwip.create(300, 300, 'yellow', function(err, image){
    image.toBuffer('png', function(err,buffer) {
        var base64data = buffer.toString('base64');
        var finalBase64String = 'data:image/png;base64,' + base64data;

        console.log(finalBase64String);
    });
});

Tenga en cuenta que el búfer proporcionará los datos simples de base64, por lo que si desea proporcionar una cadena de base64 que se pueda mostrar directamente en el navegador, debe agregar el " formato en línea ".

Manipulación de imágenes base64

Puede manipular imágenes desde el formato base64 directamente en lwip sin crear un archivo estático. En su lugar, cree una nueva instancia de Buffer con los datos Base64 (recuerde eliminar los datos innecesarios, el búfer espera el contenido simple de base64 o el archivo se corromperá).

var lwip = require('lwip');

var base64String = "data:image/jpeg;base64,qweqwe.......";

var encondedImageBuffer = new Buffer(base64String.replace(/^data:image\/(png|gif|jpeg);base64,/,''), 'base64');

lwip.open(encondedImageBuffer, 'jpg', function(err, image){
    // comprobar err ...
    // define un lote de manipulaciones y guárdelo en el disco como JPEG:
    image.batch().writeFile('myimage.jpg', function(err){
        if(err){
            console.log(err);
        }
    });
});

Puede leer más ejemplos y la documentación de la biblioteca en el repositorio oficial o en el área de uso del archivo Léame .

Que te diviertas ❤️!


Ingeniero de Software Senior en EPAM Anywhere. Interesado en la programación desde los 14 años, Carlos es un programador autodidacta, fundador y autor de la mayoría de los artículos de Our Code World.

Conviertete en un programador más sociable

Patrocinadores