Hoy vamos a programar la impresión de un PDF generado a partir de HTML de modo que serás capaz de crear un PDF a partir de una cadena HTML indicando el tamaño de las hojas y márgenes para después enviar ese PDF a cualquier impresora de manera automáticamente.
Dicho con otras palabras te voy a enseñar a imprimir un PDF directamente desde cualquier lenguaje de programación (incluyendo JavaScript) sin diálogos de confirmación, creando ese PDF usando HTML, así puedes diseñar cualquier documento directamente con el plugin.
Descargando herramientas
Para este tutorial vas a necesitar contar con:
plugin_pdf_prod_32.exe
oplugin_pdf_prod_64.exe
el cual se descarga en: https://github.com/parzibyte/plugin-silent-pdf-print-examples/releases/latestPDFtoPrinter.exe
el cual se descarga en: https://mendelson.org/pdftoprinter.html o en https://github.com/emendelson/pdftoprinter/blob/main/PDFtoPrinter.exe?raw=truewkhtmltopdf.exe
el cual se descarga en: https://wkhtmltopdf.org/downloads.html. Descarga el zip para Windows y extraewkhtmltopdf.exe
en la misma carpeta donde se encuentreplugin_pdf_prod_32.exe
oplugin_pdf_prod_64.exe
yPDFtoPrinter.exe
Nota: ninguna de las herramientas contiene malware, aunque los antivirus o sistemas lo detecten como tal. Es tu responsabilidad obligar al sistema a confiar en los programas y de ser necesario agregarlos a las excepciones.
También he notado que en ocasiones el navegador bloquea la descarga; de nuevo, es tu responsabilidad forzarla.
Una vez descargados, ejecuta plugin_pdf_prod_32.exe
o plugin_pdf_prod_64.exe
y deja a PDFtoPrinter.exe
y wkhtmltopdf.exe
en el mismo directorio donde se encuentra el archivo que has ejecutado.
Prueba rápida
Para hacer una prueba rápida, abre tu navegador en http://localhost:8080/version y debe aparecer:
{"version":"0.3","plataforma":"Desktop PDF","sistemaOperativo":"windows"}
Si no te aparece ese mensaje exacto, asegúrate de haber ejecutado el plugin. Te recomiendo revisar todo de nuevo, ya que si no aparece ese mensaje no podrás imprimir el documento.
También fíjate que en plataforma debe decir Desktop PDF, ya que tengo otros plugins y si bien funcionan, no tienen que ver con este tutorial específico.
Demostración
Si ya estás ejecutando el plugin y has descargado ambas herramientas, entonces puedes probar la demostración sin salir de tu navegador.
Ingresa al siguiente ejemplo: https://parzibyte.github.io/plugin-silent-pdf-print-examples/html.html
Elige tu impresora de la lista, utiliza el diseñador WYSIWYG para crear el recibo PDF a tu gusto y haz clic en Imprimir, se debería imprimir un PDF generado con el HTML contenido en el diseñador.
Por defecto el campo ya está lleno con un diseño simple de HTML que también contiene una imagen, pero siempre puedes cambiar ese valor y generar el HTML desde cualquier lugar.
Al imprimir habrás generado un PDF a partir de HTML, incluyendo imágenes. Lo genial de esta opción es que puedes incluso ejecutar código JavaScript (dentro del HTML enviado) para generar cosas como códigos QR directamente al generar el PDF.
Si quieres ver el código completo de dicha demostración, navega al siguiente enlace: https://github.com/parzibyte/plugin-silent-pdf-print-examples/blob/main/html.html
Nota: en este caso la demostración está programada con JavaScript para que lo puedas hacer desde tu navegador web, pero el plugin puede ser invocado desde cualquier lenguaje de programación e interfaz.
Generar e imprimir PDF a partir de HTML
Ahora que has visto la demostración veamos el código fuente para imprimir este HTML de manera programada y automática desde cualquier página web o lugar.
Tienes que hacer una petición HTTP de tipo POST a la URL http://localhost:8080/html
enviando un JSON con las siguientes propiedades:
html
: la cadena HTML para generar el PDF.nombreImpresora
: una cadena indicando el nombre de la impresora en donde el PDF será impresoserial
: cadena opcional si quieres apoyar al desarrollo del software, absolutamente opcionalancho
: número indicando el ancho de la página en milímetrosalto
: número indicando el alto de la página en milímetrosmargenDerecho
: número indicando el margen derechomargenIzquierdo
: número indicando el margen izquierdo
Veamos un ejemplo con JS:
const imprimir = async () => {
const htmlDelEditor = "Aquí va el HTML"
const ancho = 210,
alto = 297,
margenIzquierdo = 0,
margenDerecho = 0;
const respuestaHttp = await fetch("http://localhost:8080/html", {
method: "POST",
body: JSON.stringify({
html: html,
nombreImpresora: "Aquí el nombre de tu impresora",
serial: "",
ancho: ancho,
alto: alto,
margenIzquierdo: margenIzquierdo,
margenDerecho: margenDerecho,
})
});
if (respuestaHttp.status === 200) {
alert("Impreso correctamente")
} else {
const mensajeDeError = await respuestaHttp.text();
alert("Error: " + mensajeDeError)
}
}
Y así de simple es como se puede imprimir un PDF desde JS indicando el HTML para renderizar el documento.
Tips para generar PDF a partir de HTML
- Recomiendo diseñar y ver el HTML en un navegador web y con un editor de código decente para que puedas ordenar y ver el diseño que se enviará al plugin. Una vez que estés satisfecho con el diseño, copia y pega el HTML para enviarlo al plugin
- Al enviar el HTML al plugin, envíalo completo, desde la etiqueta
<html>
y no te olvides de indicar el<meta charset="UTF-8">
para que tenga la codificación correcta y, en palabras simples, puedas imprimir acentos y eñes. - Puedes ejecutar scripts en el HTML enviado, solo que deben ser “inline”, es decir, no debes importar los scripts de algún sitio, debes colocar el código desde el HTML. No he probado si la importación de scripts externos funciona, y no la garantizo.
- También puedes indicar estilos CSS con la etiqueta
<style>
o directamente en la propiedadstyle
de cada elemento - Puedes enviar imágenes codificadas como base64
- La fuente puede ser cambiada con el estilo CSS. A mí me gusta la Helvetica, pero todo depende de tus gustos.
Para que te des una idea, yo he podido generar, de manera programada, la siguiente nota de venta para una impresora térmica incluyendo imágenes.
El código QR que se ve ahí fue generado desde JavaScript al momento de generar el HTML, no lo generé desde la aplicación que consume al plugin.
¿Se puede invocar desde otros lenguajes de programación?
Puedes imprimir un PDF a partir de HTML desde cualquier lenguaje de programación que permita hacer peticiones HTTP (sin importar la herramienta usada para generar el PDF).
Cualquier lenguaje moderno puede hacerlo, por ahora se me ocurre JavaScript, PHP, Golang, C#, Java, Python e incluso C con libcurl.
Lo único que tienes que hacer es una petición de tipo POST a la ruta http://localhost:8080/html
enviando las propiedades en el cuerpo de la petición.
Nota: si tienes una aplicación en un servidor que no es local y accedes a ella a través del navegador web, será necesario usar la versión JavaScript del lado del cliente. No puedes acceder a archivos del cliente desde un servidor.
Solución de errores
Si hay algún error, el plugin te lo hará saber. Te dejo con una lista de posibles errores y su solución (aunque la misma ya está en el mismo mensaje).
Recuerda que los mensajes de error podrían variar ligeramente.
- “fork/exec PDFtoPrinter.exe: The system cannot find the file specified.”: El ejecutable PDFtoPrinter no está en la misma ubicación que el plugin
- “fork/exec wkhtmltopdf.exe: The system cannot find the file specified.”: El ejecutable wkhtmltopdf.exe no está en la misma ubicación que el plugin
- Printer name “Impresora” not found or argument “Impresora” is invalid: la impresora en la que intentas imprimir no existe.
- La lista de impresoras no carga o está vacía: no estás ejecutando el plugin, debes ejecutarlo para que se pueda cargar la lista. Asegúrate de ejecutar el plugin y después refresca la página.
Más ejemplos
En mi blog he escrito sobre cómo imprimir PDF usando este plugin. Puedes revisar los ejemplos en la siguiente categoría: Plugin PDF.
También tengo algunos ejemplos para imprimir un PDF según su ubicación local y también cómo imprimir un PDF de internet: https://parzibyte.me/blog/2020/12/07/plugin-imprimir-pdf-manera-silenciosa-javascript/