2012-10-02 22 views
15

Estoy buscando una solución para generar un PDF desde un documento HTML5/CSS3, en el lado del servidor.HTML5 to PDF serverside

Sé que hay una gran cantidad de solución para crear un PDF (como FOP, iText ...), pero tengo que asegurarme de que se verá 100% igual que la página HTML. Por lo tanto, no quiero crear un elemento PDF por elemento como FOP o iText.

En realidad, algo debería existir porque eso es lo que hace cuando imprime como PDF desde su navegador. Lo ideal es que la solución incorpore un motor de navegador web (webkit o gecko). Intenté wkHtmlToPdf ... pero el resultado no es bueno en absoluto (el lienzo de HTML5 ni siquiera está impreso ...)

Si alguien tiene una idea de alguna solución, gratis o no, en cualquier idioma ... Lo haré ¡aprecio MUCHO! ¡Gracias!

+0

¿Por qué este todavía está cerrado? Cada pregunta causa más "solicite debate, argumentos, encuestas o discusiones extensas" que esto. –

+1

wkhtml2pdf ahora * does * render canvas ... ver wkhtmltopdf.org. Pulgares arriba para wkhtml2pdf ... es simplemente increíble tener un solo ejecutable en lugar de tratar con más de 7000 clases de java de Fop –

Respuesta

0

¿Qué idioma está utilizando en el servidor?

Crear una captura de pantalla de la página y luego convertir la imagen a un pdf probablemente le dará los mejores resultados. Mostraría la página exactamente igual a como sería renderizada por un navegador.

Existen algunas herramientas de Screenshot-as-a-Service, como browshot.com. Eche un vistazo a API y supported languages.

O puede usar su herramienta. Para node.js existe un buen proyecto en github.

+0

Gracias por su respuesta. Estoy usando Java en el lado del servidor, pero estoy abierto a usar algo más para esta generación de PDF. Lamentablemente, la captura de pantalla no es una opción, ya que el PDF generado debe ser un PDF real para una impresora profesional (por ejemplo, el texto debe ser texto, no algunos píxeles). – Olivier

+0

Convertir una imagen a PDF es una muy mala idea: perderá todo el texto, por lo que no se acercará demasiado y no se podrá copiar ni pegar ni buscar. También hará que el archivo PDF sea más grande de lo que necesita ser. Si usa wkHtmlToPdf o phantomJs o la opción de impresión de un navegador normal, el texto irá al PDF como texto, y cualquier vector gráfico también irá como vector, evitando estos problemas. – rjmunro

1

Según la complejidad de su HTML, puede usar XmlWorker, que es un proyecto de los desarrolladores de iText y utiliza iText.

23

He usado PhantomJS para generar imágenes png desde páginas web y también puede producir PDF y la calidad es buena. La propiedad se llama captura de pantalla y se describe here. Los formatos admitidos son PNG, JPEG, GIF y PDF.

Cuando se convierten a PDF, los textos de las páginas se conservan como textos.

Después de probar algunas otras bibliotecas o programas, PhantomJS encontró la solución más perfecta. PhantomJS usa WebKit, un motor de diseño y representación real.

Algunos ejemplos están en https://github.com/ariya/phantomjs/wiki/Examples. En la sección Rendering/rasterización se menciona la siguiente secuencia de comandos que le ayuda en el proceso:

rasterize.js rasterizes a web page to image or PDF 

PhantomJS QuicStart Guide dice:

Producir salida PDF es posible, por ejemplo, de un artículo de Wikipedia:

phantomjs rasterize.js 'http://en.wikipedia.org/w/index.php?title=Jakarta&printable=yes' jakarta.pdf 

o cuando se crea de impresora preparada hoja de trucos:

phantomjs rasterize.js http://www.nihilogic.dk/labs/webgl_cheat_sheet/WebGL_Cheat_Sheet.htm webgl.pdf 

Probé pdf generación de pocas páginas y si la página sigue las normas, que produce buenos resultados. El texto es seleccionable e imprimible como de alta calidad, pero en algunas páginas el diseño en pdf no es el mismo que en png.A continuación se muestra dos capturas de pantalla que se generan utilizando comandos:

$ phantomjs rasterize.js 'http://windows.microsoft.com/en-US/windows/home' microsoft.png 

$ phantomjs rasterize.js 'http://windows.microsoft.com/en-US/windows/home' microsoft.pdf 

Example of png and pdf generation using Phantomjs

Probé también http://lab.simurai.com/buttons/. El pdf y png era muy idéntico y debajo hay una muestra de pdf que rasterizó a 5641 px de ancho y recortó una región. Como en el ejemplo de PDF anterior, el texto se puede seleccionar en PDF y, como puede ver, el texto es nítido (¡no hay antialias!).

CSS3Buttons

INSTALACIÓN

Probé primero en instalar la biblioteca Qt y PhantomJS en CentOS5 compilar desde el código fuente, pero no hubo suerte. A continuación, en Ubuntu 11.10 y el proceso fue rápido:

he descargado http://phantomjs.googlecode.com/files/phantomjs-1.7.0-linux-x86_64.tar.bz2 y extrajeron usando

tar -xjvf phantomjs-1.7.0-linux-x86_64.tar.bz2 

Y luego copiado PhantomJS ejecutable para dir bin del sistema:

$ cp phantomjs-1.7.0-linux-x86_64/bin/phantomjs /usr/local/bin/phantomjs 

y PhantomJS estaba listo correr.

Si el PDF generado no es bueno, puede intentar actualizar Webkit, pero supongo que el resultado debería ser suficiente. El PhantomJS tiene un excelente ciclo de actualización, por lo que los errores se deben corregir en un tiempo razonable.

PhantomJS FAQ también tiene una buena información de posibilidades.

Cuestiones relacionadas