実現したいこと
Webサーバ側にPDFファイル（複数ページ）・画像ファイルを保持しており、
embedタグ、imgタグでHTML上にファイルを配置している状況で
クライアント側でJavascriptを使って１つの最終的にはPDFファイルに出力したい（ブラウザ側にダウンロードさせたい）。
現在の構想としては、
PDF、画像ファイルを一度canvasタグに1ページずつ貼り付けし、画像化→PDF出力と考えております。
また、それに伴いPDFファイルのテキスト部分が画像→再PDFによる劣化や、画質等の劣化は避けられないと考えております。
発生している問題・分からないこと
pdfjsのライブラリでembedタグからPDFを取得して、可能でしょうか。
※あるいは何か参考になる書籍、サイトがあると助かります。
あるいは別のライブラリだともっと簡単にできる等があれば教えていただけると幸いです。
該当のソースコード
HTML
1<body> 2<button id="button" onclick="return createPDF();">Download PDF</button> 3 4<div id="content"> 5 <p> 6 [ Download PDF ]ボタンをクリックすると、<br> 7 PDFファイルのダウンロードを開始します。 8 </p> 9 <embed src="./data/複数ページあるPDFファイル.pdf" type="application/pdf" width="100%" height="100%"/> 10 <img src="./data/画像1.jpg" /> 11 <img src="./data/画像2.jpg" /> 12 13 <!-- このcanvasにembedとimgを結合した画像を出力させてPDF保存(ダウンロード)させたい --> 14 <canvas id="outputCanvas"></canvas> 15 16</div> 17</body>
試したこと・調べたこと
上記の詳細・結果
html2pdf.jsのライブラリを用いて
imgタグにある画像をもとにPDFに出力させることは確認しました。
補足
利用ライブラリ
- pdfjs-4.3.136-dist（PDFから画像ファイルに変換したいライブラリとして利用したいがうまく利用できてない）
- html2pdf.js （canvasタグに生成した画像をPDFに出力するのに利用
- html2canvas.js (内部的にhtml2pdf.js)で使用
0 コメント