Plugin para impresora térmica

Documentación de la API del plugin para impresoras térmicas v2

Este post describe todos los métodos del conector para el plugin de impresión térmica directa en la nube usando JavaScript, en su versión 2. El código fuente del conector lo encuentras aquí.

Demostrar capacidades del plugin para impresoras térmicas

Voy a suponer que tienes un conocimiento básico sobre JavaScript y que has configurado el plugin junto con tu impresora.

Recuerda que los ejemplos están en otro lugar, aquí solo está la documentación de ConectorPlugin.js.

Por cierto, es importante mencionar que el plugin escucha en el puerto 8000. Debido a que el plugin simplemente hace peticiones con fetch, puedes usar async y await o promesas, como a ti te parezca mejor.

Métodos estáticos

Estos métodos se pueden invocar sin crear una instancia de la clase.

obtenerImpresoras

Opcionalmente recibe la URL donde está escuchando el plugin. Normalmente la URL no debe ser proporcionada, al menos que se quiera invocar a un plugin en otra computadora con otra IP.

Devuelve una promesa que al resolverse tendrá un arreglo con la lista de impresoras compartidas.

Este método hará que aparezca brevemente el símbolo del sistema. Esto no se puede cambiar hasta el momento, pero no afecta gravemente a la experiencia del usuario.

Ejemplo:

ConectorPlugin.obtenerImpresoras()
.then(impresoras => {
  console.log(impresoras);
});

Métodos de la clase

constructor

Opcionalmente recibe la ruta donde el plugin escucha. Normalmente esto nunca cambiará, al menos que se quiera invocar al plugin en otra computadora usando su IP.

Ejemplo:

const conector = new ConectorPlugin();

texto

Imprime texto en la impresora. Recuerda que puedes usar \n dentro de la cadena para poner saltos de línea. Los saltos de línea son importantes y ayudan a separar el contenido.

Por ejemplo, cuando imprimas texto y luego una imagen, separa a ambos dejando un salto de línea en el texto.

Ejemplo: conector.texto("Me gusta imprimir\n");

textoConAcentos

En caso de que la impresora no imprima texto con acentos, letras ñ o caracteres especiales al usar el método texto, se puede invocar a este método para forzar la impresión de acentos. Recibe el texto con acentos o caracteres especiales que se desea imprimir.

Solo basta con una llamada a este método, ya que por alguna razón habilita los acentos, y las siguientes llamadas a texto con cadenas que tienen acentos ya funcionan. Igualmente si se invoca varias veces no hay problema.

Ejemplo: conector.textoConAcentos("¡Hola María José!");

feed

Agrega un salto de línea a la impresora. Es útil para separar contenido. Al igual que los saltos de línea con \n, feed agrega saltos y recorre el papel. Yo suelo terminar mis impresiones con un feed(3) para que el ticket salga completo.

Este método recibe la cantidad de saltos que debe dar.

Ejemplo: conector.feed(3);

establecerTamanioFuente

Cambia el tamaño de la fuente. Recibe el multiplicador de ancho  y el multiplicador de altura como números.

El rango de los números debe ser del 1 al 8.

Ejemplo: conector.establecerTamanioFuente(1,2);

establecerFuente

Cambia el tipo de fuente de la impresora. No todas las impresoras lo soportan, así que aunque la cambies, puede que notes que sigue siendo la misma fuente al imprimir.

Recibe la fuente, misma que debe ser una constante de ConectorPlugin.Constantes, y puede ser FuenteA, FuenteB o FuenteC.

Ejemplo: conector.establecerFuente(ConectorPlugin.Constantes.FuenteA);

establecerEnfatizado

Hace que las letras estén enfatizadas o en su estilo bold. Recibe un 1 si quieres que se enfatice, y un 0 en caso de que no quieras.

Ejemplo: conector.establecerEnfatizado(1);

establecerJustificacion

Cambia la alineación del texto de la impresora ya sea a la izquierda, centro o derecha. También cambia la alineación de las imágenes (solo debes invocar a este método antes de imprimir la imagen).

La justificación debe ser un valor de ConectorPlugin.Constantes y puede ser AlineacionCentro, AlineacionDerecha o AlineacionIzquierda.

Ejemplo:

conector.establecerJustificacion(ConectorPlugin.Constantes.AlineacionCentro);

cortar

Este método corta el papel de la impresora. En algunas impresoras no funciona ya sea porque no son compatibles o porque no tienen una cortadora (no esperas que el plugin modifique el hardware e instale una cortadora en tu impresora, ¿cierto?)

Ejemplo: conector.cortar();

abrirCajon

Envía un pulso al cable que conecta la impresora y el cajón de dinero para abrirlo, en caso de que exista.

Ejemplo: conector.abrirCajon();

cortarParcialmente

Corta el papel de manera parcial. En ocasiones hay que combinarlo con el método cortar en caso de que ninguno de los dos funcione por separado.

Ejemplo: conector.cortarParcialmente();

imagenDesdeUrl

Este método recibe la URL de una imagen e imprime esa imagen en la impresora térmica. Con esto se pueden imprimir la mayoría de imágenes, ya que acepta cualquier URL válida, así que podemos imprimir imágenes de nuestro servidor, de internet, etcétera.

Es importante mencionar que el plugin va a descargar la imagen de la URL y confiar en que será una imagen válida. El servidor puede denegar la solicitud o grabar la IP de nuestra computadora, tal y como si nosotros hubiéramos descargado la imagen.

Esto no es un problema, solo lo digo por seguridad. Así que solo usa URLs de tu propio servidor, de sitios confiables o de localhost.

Solo se soportan imágenes JPG y PNG hasta el momento. Con otro tipo de imagen el comportamiento no está garantizado.

Ejemplo: conector.imagenDesdeUrl("https://github.com/parzibyte.png");

imagenLocal

En lugar de una URL como en imagenDesdeUrl, este método recibe la ruta absoluta de una imagen en la computadora en donde se encuentra el plugin y la imprime en la impresora térmica.

El plugin va a confiar en que el archivo existe y que es una imagen válida, así que ten cuidado con la ruta.

No olvides que en Windows se usa \ para separar los directorios, pero a su vez \ es un carácter usado para definir caracteres especiales como el salto de línea u otros valores, así que si defines la ruta desde una cadena en JavaScript no lo hagas así:

const ruta = "C:\Users\parzibyte\vacaciones.png";

Hazlo así:

const ruta = "C:\\Users\\parzibyte\\vacaciones.png";

Esto ya no tiene que ver con el plugin, sino con JavaScript, Windows y las cadenas.

Ejemplo: conector.imagenLocal("C:\\Users\\parzibyte\\vacaciones.png");

qr

Trata de imprimir un código QR de manera nativa en la impresora. Esto suele no funcionar en la mayoría de casos, pero nada pierdes con probar.

Recibe el contenido del código QR. Ejemplo:

conector.qr("Hola mundo");

qrComoImagen

En lugar de imprimir un código QR nativo confiando en la impresora, se puede optar por hacer que el plugin genere el QR como imagen y luego lo imprima en la impresora térmica como imagen (en lugar de pedirle a la impresora que genere un QR).

Este método es el que funciona en la mayoría de casos.

Recibe el contenido del código QR. Por cierto, este método va a crear una imagen temporal en la ubicación del plugin y luego la va a eliminar. El usuario ni siquiera lo va a notar, pero no está de más documentar esa parte.

Ejemplo: conector.qrComoImagen("Soy el contenido del código QR");

codigoDeBarras

Imprime un código de barras. Recibe el contenido del código de barras y el tipo. El tipo del código debe ser una constante de ConectorPlugin.Constantes, mismas que se pueden ver en el código fuente.

Ejemplo:

conector.codigoDeBarras("123", ConectorPlugin.Constantes.AccionBarcode39);

No está garantizado que esto funcione en todas las impresoras que existan. Tal vez en el futuro se agregue un método parecido al del QR para que el plugin genere el código de barras como imagen, pero todo depende del apoyo que reciba el desarrollo del plugin.

imprimirEn

Este método envía todo el conector a la impresora y termina la impresión. Devuelve una promesa que al resolverse traerá la respuesta. Si la respuesta es true, significa que todo fue bien; en caso contrario significa que hubo un error (el error estará en la respuesta como cadena)

Ejemplo:

conector.imprimirEn(nombreImpresora)
.then(respuestaAlImprimir => {
    if (respuestaAlImprimir === true) {
        console.log("Impreso correctamente");
    } else {
        console.log("Error. La respuesta es: " + respuestaAlImprimir);
    }
});

Ejemplo con async y await:

const respuestaAlImprimir = await conector.imprimirEn(nombreImpresora);
if (respuestaAlImprimir === true) {
    console.log("Impreso correctamente");
} else {
    console.log("Error. La respuesta es: " + respuestaAlImprimir);
}

Recuerda configurar correctamente tu impresora como se describe en el post de instalación del plugin.

Estoy aquí para ayudarte 🤝💻


Estoy aquí para ayudarte en todo lo que necesites. Si requieres alguna modificación en lo presentado en este post, deseas asistencia con tu tarea, proyecto o precisas desarrollar un software a medida, no dudes en contactarme. Estoy comprometido a brindarte el apoyo necesario para que logres tus objetivos. Mi correo es parzibyte(arroba)gmail.com, estoy como@parzibyte en Telegram o en mi página de contacto

No te pierdas ninguno de mis posts 🚀🔔

Suscríbete a mi canal de Telegram para recibir una notificación cuando escriba un nuevo tutorial de programación.
parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

Ver comentarios

  • Estoy probando el plugin y los ejemplos no me funcionan. Dan este error:
    16/9/2022 18:14:52 Error. La respuesta es: Error en el servidor: json: cannot unmarshal object into Go value of type []main.OperacionTicket
    ALguna ayuda?

Entradas recientes

Desplegar PWA creada con Vue 3, Vite y SQLite3 en Apache

Ya te enseñé cómo convertir una aplicación web de Vue 3 en una PWA. Al…

3 días hace

Arquitectura para wasm con Go, Vue 3, Pinia y Vite

En este artículo voy a documentar la arquitectura que yo utilizo al trabajar con WebAssembly…

3 días hace

Vue 3 y Vite: crear PWA (Progressive Web App)

En un artículo anterior te enseñé a crear un PWA. Al final, cualquier aplicación que…

3 días hace

Errores de Comlink y algunas soluciones

Al usar Comlink para trabajar con los workers usando JavaScript me han aparecido algunos errores…

3 días hace

Esperar promesa para inicializar Store de Pinia con Vue 3

En este artículo te voy a enseñar cómo usar un "top level await" esperando a…

3 días hace

Solución: Apache – Server unable to read htaccess file

Ayer estaba editando unos archivos que son servidos con el servidor Apache y al visitarlos…

4 días hace

Esta web usa cookies.