Como gerar um pdf a partir de página web html? [fechado]

Estou à procura de uma biblioteca para transformar a minha página web em um arquivo PDF depois de clicar em evento de um botão. Estou a tentar, mas imprime sem o CSS, Como posso fazer isto usando JavaScript/jQuery e manter o meu CSS? Ou outro CSS que eu possa escolher?

Author: Angel Politis, 2014-07-31

3 answers

Existe uma nova solução jQuery + cloud que irá tornar qualquer página HTML e seu CSS (incluindo as regras de mídia impressa) em PDF. A solução é configurada para imprimir qualquer região da sua página web, basta dizer ao formatador qual o elemento de contêiner que deseja imprimir e a biblioteca faz o resto. O que você recebe de volta é um PDF incorporável ou a infra-estrutura irá empurrar de volta um PDF para download.

Aqui está a tua biblioteca.):
https://github.com/Xportability/css-to-pdf Aqui está. o teu violino:
http://jsfiddle.net/kstubs/jrtM5/ Aqui está uma demo.:
http://xep.cloudformatter.com/doc/

De momento não existem instruções de Utilização, mas seguir as amostras (ver fonte) deve ser bastante auto-explicativo (procurar os botões imprimir It) e aqui está, mais ou menos, as opções/parâmetros adicionais que o método de formato entende.

options 
{
    pageWidth: "8.5in",             
    pageHeight: "11in", 
    pageMargin: ".25in", 
    pageMarginTop: "1in",
    pageMarginRight: "1in",
    pageMarginBottom: "1in",
    pageMarginLeft: "1in",
    render: ("none"|"newwin<default>"|embed"|"download<default IE>"),
    foStyle: { 
        // puts fo style attributes on the root, ex. fontSize:14px
        foStyleName: 'value', ...
    }           
}

Aqui está a lista dos atributos CSS que são actualmente compativel.

[
    'lineHeight', 
    'alignmentBaseline', 
    'backgroundImage', 'backgroundPosition', 'backgroundRepeat', 'backgroundColor',
    'baselineShift', 
    'border',
    'borderWidth', 'borderColor','borderStyle',
    'borderTop','borderLeft','borderRight','borderBotttom',
    'borderTopWidth','borderTopStyle','borderTopColor', 
    'borderBottomWidth','borderBottomStyle','borderBottomColor',
    'borderLeftWidth','borderLeftStyle','borderLeftColor',
    'borderRightWidth','borderRightStyle','borderRightColor',
    'borderCollapse',             
    'clear', 'color', 
    'display', 'direction', 'dominantBaseline', 
    'fill', 'float', 
    'fontStyle', 'fontVariant', 'fontWeight', 'fontSize', 'fontFamily', 
    'listStyleType', 'listStyleImage', 'letterSpacing', 
    'marginTop', 'marginBottom', 'marginLeft', 'marginRight','orphans', 
    'paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft',
    'pageBreakAfter', 'pageBreakBefore', 
    'tableLayout', 
    'textAlign', 'textAnchor','textDecoration', 'textIndent', 'textTransform', 
    'verticalAlign',
    'widows', 'wordSpacing', 'width'
]
Espero que isto ajude!
 10
Author: kstubs, 2017-11-29 22:26:07

Tente este pacote npm htmlto. ele cria PDF a partir de html com o estilo CSS

var htmlTo = require('htmlto')

htmlTo.pdf('./public/html/report.html','./public/pdf/report.pdf',{width: 2480, height: 3508})

Instalar:

npm install -S htmlto

npm install -S phantom

*pode também especificar as dimensões.phantom version ^4.0.3 e node version v6. 5. 0 https://www.npmjs.com/package/htmlto

 1
Author: node, 2017-05-20 09:38:27

Criei uma API simples e muito fácil de usar que usa a biblioteca snappy, baseada na biblioteca wkhtmltopdf} baseada no WebKit, a fim de converter uma página HTML do URL para PDF. Aqui está o Github repo: https://github.com/Dellos7/dhtml2pdf

Este é um exemplo de como usá-lo a partir de uma marca de âncora. Isto irá mostrar o PDF gerado do site https://www.github.com numa nova página do navegador:

<a href="https://dhtml2pdf.herokuapp.com/api.php?url=https://www.github.com&result_type=show" target="_blank">Show PDF</a>

Exemplo de como usá-lo para baixar o PDF:

<a href="https://dhtml2pdf.herokuapp.com/api.php?url=https://www.github.com&result_type=download&file_name=my_pdf">Download PDF</a>

Com esta solução, nem sequer precisa de usar javascript para gerar o seu PDF.

Mas se ainda precisares de o fazer usando javascript, podes fazê-lo assim:

document.getElementById("your-button-id").addEventListener("click", function() {
    var link = document.createElement('a');
    link.href = 'https://dhtml2pdf.herokuapp.com/api.php?url=https://www.github.com&result_type=download';
    link.download = 'file.pdf';
    link.dispatchEvent(new MouseEvent('click'));
});

No repo eu também explico como clonar e implantar a sua própria API emHeroku para que você possa manter a API sozinho e não depender de serviços externos.

 0
Author: David López, 2018-02-04 13:17:39