HTML를 PDF로 만들기

웹브라우저에서 HTML를 그대로 PDF로 만들기 위해서 찾아 보게 되었습니다.

위 사진은 웹페이지 그대로 화면은 캡쳐한 부분입니다. 해당 화면을 가지고 그대로 PDF로 만들어야 하는 상태 입니다. background로 제작을 하면 되지만 고객이 일단 화면에 먼저 보여지기를 원해서 View를 만들고 그다음에 PDF로 제작을 해야 되는 조건이 붙었습니다.

이렇게 VIew 에서 PDF로 다운 받아서 그대로 확인을 할 수 있도록 만들기 위해서 html2pdf 라이브러리를 사용을 하여서 제작을 하게 되었습니다. 일단든 보여지는 그대로 나오기 때문에 그다지 어렵지는 않았습니다.

 // Get the element.
var element = document.getElementById('PDFROOT');

// Generate the PDF.
// orientation는 출력 방항 ( 가로 세로 ),
//  scale 는 확대
html2pdf().from(element).set({
	filename: '<?=$mainResData['reportNo'];?>',
	html2canvas: { scale: 1 },
	jsPDF: {orientation: 'portrait', unit: 'mm', format: 'A4', compressPDF: true}
}).save();

Javascript 코드는 위와 같이 처리를 하면은 됩니다. 좀 더 자세한 사항은 html2pdf 옵션을 찾아 보면은 자세하게 설명이 되어 있을 것입니다.

JS 파일은 나중에 구할 수 있지만 혹시나 몰라서 첨부 파일로 올리게 되었습니다.