En el tutorial de hoy vamos a ver cómo comunicarnos con una impresora térmica desde JavaScript para imprimir tickets, abrir el cajón, cortar el papel y otras cosas usando un plugin como intermediario y HTTP.

Con esto podremos imprimir tickets o recibos desde JS, imprimir imágenes, códigos de barras, códigos QR, imágenes como base64, caracteres personalizados y muchas cosas más.

Descargando plugin

Para que esto funcione debes descargar el plugin y configurar tu impresora como ahí se menciona. A continuación dejo el enlace, te recomiendo verlo y después volver: https://parzibyte.me/blog/2022/09/30/plugin-impresoras-termicas-version-3/

De hecho en el plugin ya está un ejemplo con JavaScript, pero si quieres la explicación detallada sigue leyendo y luego podrás revisar el código fuente.

Nota: si tú quieres imprimir de JavaScript a una impresora Bluetooth mira:

Plugin gratuito para impresoras térmicas Bluetooth en Android

Importando conector

Para comunicarte con el plugin puedes usar el conector programado por mí. Lo dejo a continuación, recuerda que puedes incluirlo en tu proyecto con una etiqueta <script> o simplemente pegando todo el código.

Obtener lista de impresoras

Si tú quieres darle al usuario la oportunidad de elegir su impresora, puedes invocar al método obtenerImpresoras para obtener las impresoras compartidas.

const impresoras = await ConectorPluginV3.obtenerImpresoras();

En este caso impresoras será un arreglo de tipo cadena con la lista de impresoras. Por cierto, en el ejemplo de arriba estoy usando await pero puedes hacerlo con promesas:

Nota: tanto esta y la función imprimirEn pueden manejarse con async y await o con promesas. Es tu decisión cuál usas.

Hola mundo con impresora térmica y JS

Veamos ahora cómo crear un recibo e imprimirlo en la impresora térmica. Primero debes crear una instancia de ConectorPluginV3 y encadenar todos los métodos que prefieras. Aquí un ejemplo simple:

Como puedes ver, al final debes invocar a imprimirEn pasándole el nombre de la impresora como cadena y esperar la respuesta.

Si la respuesta es true entonces la impresión fue correcta, si no, la respuesta tendrá el mensaje de error.

Nota: te repito que puedes usar async y await o promesas.

Recuerda que al crear una instancia de ConectorPluginV3 puedes pasar la URL del plugin en caso de que no lo estés ejecutando en el puerto por defecto, y lo mismo aplica para el método obtenerImpresoras.

Imprimir ticket de compra en impresora Xprinter o Epson con JavaScript

A continuación te muestro un ejemplo más avanzado. Fíjate en que podemos encadenar todos los métodos:

Recuerda que la documentación está en la página del plugin: https://parzibyte.me/blog/2022/09/30/plugin-impresoras-termicas-version-3/

Al imprimir debería aparecer un ticket como el siguiente:

Ticket impreso con impresora Xprinter usando plugin - Soporta imágenes, códigos QR, de barras y acentos

Ticket impreso con impresora Xprinter usando plugin – Soporta imágenes, códigos QR, de barras y acentos

Y así es como puedes comunicarte desde JavaScript a una impresora térmica que entienda comandos ESC POS. Recuerda que hay más métodos que no mostré en el ejemplo y que puedes leer en la documentación oficial.

En caso de que quieras obtener una licencia encontrarás los detalles aquí: https://parzibyte.me/blog/2022/09/30/plugin-impresoras-termicas-version-3/

Te dejo con más detalles sobre el plugin y más tutoriales de JavaScript.


Estoy disponible para trabajar en tu proyecto o realizar tu tarea pendiente, no dudes en ponerte en contacto conmigo.
Si el post fue de tu agrado muestra tu apoyo compartiéndolo, suscribiéndote al blog, siguiéndome o realizando una donación.

Suscribir por correo

Ingresa tu correo y recibirás mis últimas entradas sobre programación, open source, bases de datos y todo lo relacionado con informática

Únete a otros 6,932 suscriptores

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/

0 Comentarios

Deja un comentario

Marcador de posición del avatar

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

A %d blogueros les gusta esto: