web-dev-qa-db-fra.com

convertir HTML (avec Javascript) en PDF en utilisant JavaScript

Je veux convertir HTML (contenant du JavaScript) en PDF. Comment puis je faire ça?

Je veux juste montrer ce qui est montré dans la page Web. J'affiche un diagramme de Gantt généré par une bibliothèque JavaScript. 

Maintenant, je veux enregistrer cette page Web HTML au format PDF, comment le faire?

13
g.revolution

Nous recherchons également un moyen de convertir des fichiers html contenant du javascript complexe au format pdf . Le javasript contenu dans nos fichiers contient document.write et une manipulation DOM.

Nous avons essayé d’utiliser une combinaison de HtmlUnit pour analyser les fichiers et Flying Saucer pour l’affichage au format PDF, mais les résultats obtenus ne sont pas assez satisfaisants. Cela fonctionne, mais dans notre cas, le pdf n'est pas assez proche de ce que l'utilisateur veut.

Si vous voulez essayer ceci, voici un extrait de code permettant de convertir un fichier html local en pdf.

URL url = new File("test.html").toURI().toURL();
WebClient webClient = new WebClient(); 
HtmlPage page = webClient.getPage(url);

OutputStream os = null;
try{
   os = new FileOutputStream("test.pdf");

   ITextRenderer renderer = new ITextRenderer();
   renderer.setDocument(page,url.toString());
   renderer.layout();
   renderer.createPDF(os);
} finally{
   if(os != null) os.close();
}
5
Serxipc

Je suis surpris que personne n'ait mentionné la possibilité d'utiliser une API pour effectuer le travail.

Certes, si vous souhaitez rester sécurisé, convertir du code HTML au format PDF directement à partir du navigateur, à l'aide de javascript, n'est pas une bonne idée.

Mais voici ce que vous pouvez faire:

Lorsque votre utilisateur appuie sur le bouton "Imprimer" (par exemple), vous:

  1. Envoyez une demande à votre serveur sur un noeud final spécifique avec des détails sur ce qu'il faut convertir (URL de la page, par exemple).
  2. Ce noeud final enverra ensuite les données à convertir en une API et recevra le PDF en réponse.
  3. qu'il retournera à votre utilisateur.

Pour les utilisateurs, ils recevront un PDF en cliquant sur un bouton.

Il existe de nombreuses API disponibles qui font le travail, certaines meilleures que d'autres (ce n'est pas la raison pour laquelle je suis ici) et une recherche sur Google vous donnera beaucoup de réponses.

En fonction de ce qui est écrit dans votre backend, vous pourriez être intéressé par PDFShift (vérité: je travaille là-bas).

Ils proposent des packages prêts à l'emploi pour PHP, Python et Node.js. Tout ce que vous avez à faire est d’installer le paquet, de créer un compte, d’indiquer votre clé d’API et vous êtes prêt!

L’avantage de l’API est qu’elles fonctionnent bien dans toutes les langues. Tout ce que vous avez à faire est une demande (généralement POST) contenant les données que vous voulez convertir et obtenir un PDF en retour. Et en fonction de votre utilisation, il est généralement gratuit, sauf si vous êtes un grand utilisateur.

2
Cyril N.

Vous pouvez utiliser iText for Java pour convertir en PDF.

Utiliser itext pour convertir le code HTML en PDF

J'ai beaucoup utilisé iText et c'est très facile et vous l'apprendre rapidement. 

1
Trick

Utilisez un widget de navigateur ( comme celui de SWT ) pour rendre le graphique sous forme d’image, puis utilisez iText pour créer PDF à partir de cela.

1
Aaron Digulla

Je recommande d'utiliser wkhtmltopdf: http://wkhtmltopdf.org/

1
arkod

Avec Docmosis ou JODReports , vous pouvez insérer votre code HTML et JavaScript dans le processus de rendu du document qui pourrait produire PDF, doc ou d’autres formats. La conversion ci-dessous est effectuée par OpenOffice. Les résultats dépendent donc des filtres d'importation OpenOffice. Vous pouvez essayer manuellement en enregistrant votre page Web dans un fichier, puis en le chargeant avec OpenOffice. Si cela vous convient, ces outils pourront alors vous donner le même résultat qu’en format PDF.

0
Paul Jowett

Découvrez ceci http://www.techumber.com/2015/04/html-to-pdf-conversion-using-javascript.html

Fondamentalement, vous devez utiliser html2canvas et jspdf pour que cela fonctionne. Vous allez d’abord convertir votre image dom en image, puis utiliser jspdf pour créer un pdf avec les images.

EDIT: Une petite note sur son fonctionnement . Nous utiliserons deux bibliothèques pour effectuer ce travail. http://html2canvas.hertzen.com/ et https://github.com/MrRio/jsPDF Nous allons d'abord créer une image dom en utilisant html2, puis les utiliser. Méthode jspdf addImage pour ajouter cette image au format pdf . Cela semble simple, mais jsPdf et html2cavas ont quelques bogues, il peut donc être nécessaire de modifier temporairement le style de dom . J'espère que cela vous aidera.

0

PhantomJS a le potentiel pour y parvenir avec sa fonctionnalité de capture qui prend également en charge le format PDF.

Dans le cas où vous voulez quelque chose qui est interactable sur la ligne de commande; J'ai essayé de construire une application pour cela appelé Nota (encore à ses balbutiements). Il permet à JavaScript de rendre/manipuler, puis de capturer la page au format PDF.

0
Felix Akkermans

Essayez TableExport, un plugin jQuery.

https://github.com/kayalshri/tableExport.jquery.plugin

0
Steven Vachon

À l'aide du Print...élément de menu du navigateur, vous pouvez utiliser un pilote d'imprimante PDF, comme PDFCreator . De cette manière, tout navigateur JavaScript inclus dans la page est traité par le navigateur lors du rendu de la page.

PDFCreator est un outil gratuit pour créer des fichiers PDF à partir de presque toutes les applications Windows.

  • Créer des PDF à partir de n’importe quel programme capable d’imprimer
0
gimel

Copiez-le et collez-le dans votre site pour créer un lien qui convertira la page en page PDF.

<a href="javascript:void(window.open('http://www.htmltopdfconverter.net/?convert='+window.location))">Convert To PDF</a>
0
Jokin