El plugin para imprimir en impresoras térmicas alcanza hoy su versión 3.4.0 agregando soporte para imprimir en una POS printer a partir de HTML o una página web.
Con la nueva actualización vas a poder diseñar un ticket a partir de HTML agregando estilos e incluso JavaScript, colocando imágenes, códigos QR, texto con tildes, fuentes distintas, etcétera.
Todo lo que puedas hacer en una página web con HTML estático vas a poder imprimirlo en una impresora térmica. Veamos cómo usar estas nuevas funcionalidades del plugin.
Nuevos métodos
Se han agregado las siguientes operaciones al plugin:
- GenerarImagenAPartirDeHtmlEImprimir(html string, anchoPagina float64, maximoAncho float64, algoritmo float64):
- Genera una imagen a partir del html usando el anchoPagina como el ancho de la pantalla del navegador web para renderizar la imagen. Después, imprime esa imagen con el maximoAncho y el algoritmo indicado
- GenerarImagenAPartirDePaginaWebEImprimir(direccionPagina string, anchoPagina float64, maximoAncho float64, algoritmo float64):
- Genera una imagen a partir del html generado por la página web ubicada en la direccionPagina usando el anchoPagina como el ancho de la pantalla del navegador web para renderizar la imagen Después, imprime esa imagen con el maximoAncho y el algoritmo indicado
Apartado técnico: ¿cómo se imprime el HTML en la impresora térmica?
Para imprimir en una impresora térmica a partir de una cadena HTML el proceso que se sigue es invocar a wkhtmltoimage pasándole el HTML proporcionado por el invocador y después imprimir la imagen en la impresora térmica usando el algoritmo indicado.
Básicamente se imprime una imagen, pero esa imagen fue creada con HTML. Sobra decir que la nitidez no será la misma, pero esta operación solo es una más que se agrega al plugin; puedes seguir imprimiendo texto e imágenes nativamente.
Para el caso de la página web, el proceso es exactamente el mismo, la única diferencia es que se visita la página web proporcionada, se descarga su HTML y se imprime con el primer método explicado.
Sobre wkhtmltoimage
Para lograr la impresión de HTML en impresora térmica, mi plugin necesita que el ejecutable wkhtmltoimage.exe esté disponible en la PATH del sistema. Dicho con palabras simples, el plugin y wkhtmltoimage deben estar en la misma ubicación.
Descarga wkhtmltoimage del siguiente sitio. No la he programado yo ni tengo alguna relación con los creadores; simplemente mi plugin la usa. Te recomiendo descargar el zip para Windows y después extraer wkhtmltoimage: https://wkhtmltopdf.org/downloads.html
Ejemplos
Mi plugin puede ser invocado desde cualquier lenguaje de programación simplemente indicando las operaciones.
Para imprimir HTML a partir de código HTML, envía la cadena HTML que se convertirá a imagen y se imprimirá. Para ello necesitas la operación GenerarImagenAPartirDeHtmlEImprimir. Veamos un ejemplo simple que puedes probar en el playground:
const cargaUtil = {
"serial": "",
"nombreImpresora": "Nombre de tu impresora",
"operaciones": [
{
"nombre": "Iniciar",
"argumentos": []
},
{
"nombre": "GenerarImagenAPartirDeHtmlEImprimir",
"argumentos": [
"<html><meta charset=\"UTF-8\"><p><strong>¡Hola</strong> mundo!</p></html>",
380,
380,
0,
false
]
},
{
"nombre": "Iniciar",
"argumentos": []
},
{
"nombre": "Feed",
"argumentos": [
2
]
}
]
};
const respuestaHttp = await fetch("http://localhost:8000/imprimir", {
method: "POST",
body: JSON.stringify(cargaUtil)
});
const respuesta = await respuestaHttp.json();
if (respuesta.ok) {
console.log("Impreso correctamente")
} else {
console.error("Petición ok pero error en el plugin: " + respuesta.message);
}También puedes proporcionar una URL y el plugin se encargará de descargarla, convertirla a imagen e imprimirla. De nuevo veamos el código de ejemplo a continuación que ya puedes probar en el área de pruebas:
const cargaUtil = {
"serial": "",
"nombreImpresora": "Termica",
"operaciones": [
{
"nombre": "Iniciar",
"argumentos": []
},
{
"nombre": "GenerarImagenAPartirDePaginaWebEImprimir",
"argumentos": [
"https://example.com/",
380,
380,
0,
false
]
},
{
"nombre": "Iniciar",
"argumentos": []
},
{
"nombre": "Feed",
"argumentos": [
2
]
}
]
};
const respuestaHttp = await fetch("http://localhost:8000/imprimir", {
method: "POST",
body: JSON.stringify(cargaUtil)
});
const respuesta = await respuestaHttp.json();
if (respuesta.ok) {
console.log("Impreso correctamente")
} else {
console.error("Petición ok pero error en el plugin: " + respuesta.message);
}Documentación unificada y actualizada
Si quieres ver la descripción de cada operación y mantenerte al tanto de la documentación oficial ya existe el sitio de la documentación para el plugin HTTP a ESC POS: https://parzibyte.me/http-esc-pos-desktop-docs/es/
